HelloCharts和MPAndroidChart的使用

来源：互联网发布：山东php培训机构哪家好编辑：程序博客网时间：2024/04/29 23:12

框架地址

GITHUB MPAndroid :https://github.com/PhilJay/MPAndroidChart

HelloCharts https://github.com/lecho/hellocharts-android

在此贴出关键代码，源码上传需要的下载观看作者会不断更新

DEMO地址 http://download.csdn.net/detail/jerry872235631/9684707

1.柱状图

 public void showColumnView(List<ReportOrder> reportOrderList) {        mReportOrderList = new ArrayList<>();        mReportOrderList.addAll(reportOrderList);        //显示多少个集合        int numColumns = WEEK_ARRAY.length;        //X轴坐标        List<AxisValue> axisValues = new ArrayList<>();        //定义线的集合        List<Column> columns = new ArrayList<>();        // 节点数据结合        List<SubcolumnValue> values;        //每个集合的柱子遍历        for (int i = 0; i < numColumns; ++i) {            values = new ArrayList<>();            //第一个值是数值(值>0 方向朝上，值<0，方向朝下)，第二个值是颜色            values.add(new SubcolumnValue(reportOrderList.get(i).orderCount, COLOR[i]));            //X轴添加自定义坐标            axisValues.add(new AxisValue(i).setLabel(reportOrderList.get(i).date));            //一个柱状图的实例            Column column = new Column(values);            //点击的时候是否显示柱状图的高度，和setHasLabels()和用的时候，setHasLabels()失效            column.setHasLabelsOnlyForSelected(true);//            column.setHasLabels(false);            columns.add(column);        }        //表格的数据实例        ColumnChartData columnData = new ColumnChartData(columns);        //自定义X轴坐标        Axis axisX = new Axis();        axisX.setHasLines(false);//是否显示网格线        axisX.setTextColor(getResources().getColor(R.color.colorSkyBlue));        axisX.setValues(axisValues);        //自定义Y轴        Axis axisY = new Axis();        axisY.setHasLines(true);        axisY.setTextColor(getResources().getColor(R.color.colorSkyBlue));        axisY.setHasSeparationLine(true);//分割线        axisY.setLineColor(getResources().getColor(R.color.colorSkyBlue));//        axisY.setMaxLabelChars(4);        columnData.setAxisXBottom(axisX);        columnData.setAxisYLeft(axisY);        columnData.setValueLabelBackgroundAuto(false);//是否数据背景颜色与节点颜色一致        columnData.setValueLabelBackgroundEnabled(false);//是否有数据背景颜色        columnData.setValueLabelsTextColor(getResources().getColor(R.color.colorDeepGray));//        Viewport viewport = new Viewport();//        viewport.left = 0;//        viewport.top = mColumnChartView.getHeight();//        viewport.bottom = 0;//        viewport.right = 10;//        mColumnChartView.setMaximumViewport(viewport);//        mColumnChartView.setCurrentViewportWithAnimation(viewport);        mColumnChartView.setColumnChartData(columnData);        mColumnChartView.setValueSelectionEnabled(true);        mColumnChartView.setInteractive(true);//与用户互动        mColumnChartView.setZoomEnabled(false);//是否支持缩放//        mColumnChartView.setZoomType(ZoomType.HORIZONTAL_AND_VERTICAL);//缩放方向//        mColumnChartView.setRotation(30);//图表倾斜度        mColumnChartView.startDataAnimation(500);//延时动画    }

2.折线图

 private void initData() {        int number = months.length;        List<Line> lines = new ArrayList<>();        List<PointValue> values = new ArrayList<>();        //X轴坐标        List<AxisValue> axisValues = new ArrayList<>();        for (int i = 0; i < number; i++) {            values.add(new PointValue(i, (int) (Math.random() * 50)));            //X轴添加自定义坐标            axisValues.add(new AxisValue(i).setValue(i).setLabel(months[i]));        }        Line line = new Line(values);        line.setColor(ChartUtils.pickColor());        line.setStrokeWidth(1);//设置折线宽度        line.setHasLines(true);        line.setFilled(false);   //下面填充阴影        line.setHasPoints(true);//是否显示节点        line.setPointColor(Color.GREEN);//节点颜色        line.setPointRadius(3);//节点半径        line.setHasLabels(true);//是否显示节点数据        line.setShape(ValueShape.DIAMOND);// 节点图形样式 DIAMOND菱形、SQUARE方形、CIRCLE圆形        line.setCubic(true);// 是否设置为立体的        lines.add(line);        //自定义X轴坐标        Axis axisX = new Axis();        axisX.setHasLines(true);// 是否显示X轴网格线        axisX.setHasSeparationLine(true);//设置是否有分割线        axisX.setTextColor(Color.BLACK);        axisX.setLineColor(getResources().getColor(R.color.colorGreen));        axisX.setTextSize(14);        axisX.setTypeface(Typeface.DEFAULT);//设置字体样式        axisX.setHasTiltedLabels(true);//设置X轴文字向左旋转45度        axisX.setName("本年度");        axisX.setValues(axisValues);//为X轴显示的刻度值设置数据集合        //自定义Y轴        Axis axisY = new Axis();        axisY.setHasLines(true);        axisY.setTextColor(Color.BLACK);//        axisY.setName("运单数量");        //能看到最后几位        axisY.setMaxLabelChars(4);        LineChartData data = new LineChartData();        data.setLines(lines);        data.setAxisXBottom(axisX);        data.setAxisYLeft(axisY);        data.setBaseValue(Float.NEGATIVE_INFINITY);// 设置反向覆盖区域颜色        data.setValueLabelBackgroundAuto(false);// 设置数据背景是否跟随节点颜色        data.setValueLabelBackgroundColor(ChartUtils.pickColor());//设置数据背景颜色        data.setValueLabelBackgroundEnabled(false);//设置数据背景颜色是否显示        data.setValueLabelsTextColor(Color.BLUE);//设置数据文字颜色        mLineCharView.setLineChartData(data);        //设置图表是否可以与用户互动        mLineCharView.setInteractive(true);        //设置是否支持缩放        mLineCharView.setZoomEnabled(true);        Animation animation = new AlphaAnimation(0.3f, 1.0f);        animation.setDuration(1000);        mLineCharView.startAnimation(animation);    }

3.饼图

HelloCharts

 public void showPieChartView(int columnIndex, List<ReportOrder> reportOrderList, String date) {        List<SliceValue> values = new ArrayList<>();        String[] orderStatusArray = getResources().getStringArray(R.array.order_status_array);        String[] amountTypeArray = getResources().getStringArray(R.array.amount_array);        for (int i = 0; i < reportOrderList.size(); i++) {            float value = (float) reportOrderList.get(i).amountOrder;            SliceValue sliceValue = new SliceValue(value, COLOR[i]);            String amountType = amountTypeArray[i];            Log.i(TAG, "---value:" + value);            if (value > 0.01f) {                String label = amountType + "￥" + ((int) value);                sliceValue.setLabel(label);                sliceValue.setSliceSpacing(1);                values.add(sliceValue);            }        }        Viewport viewport = new Viewport();        viewport.left = 0;        viewport.top = 100;        viewport.bottom = 0;        viewport.right = 10;        mPieChartView.setMaximumViewport(viewport);        mPieChartView.setCurrentViewportWithAnimation(viewport);        PieChartData data = new PieChartData(values);        data.setHasLabels(true);//显示标签        data.setHasLabelsOnlyForSelected(false);//只在点击时显示标签        data.setHasLabelsOutside(true);//标签数据是否显示在外围        data.setHasCenterCircle(true);//是否是环形显示        data.setValueLabelBackgroundEnabled(false);//设置数据背景颜色是否显示        data.setValueLabelBackgroundAuto(true);//设置数据背景颜色是否与图表背景颜色一致//        data.setValueLabelBackgroundColor(Color.GREEN);        data.setValueLabelsTextColor(getResources().getColor(R.color.colorDeepGray));//设置标签字体颜色        data.setSlicesSpacing(0);//设置分离距离//        data.setValueLabelTextSize(14);//设置标签字体大小        data.setCenterCircleScale(0.6f);//内环比例        data.setCenterText1(date + " " + WEEK_ARRAY[columnIndex]);        // Get roboto-italic font.        Typeface typeface1 = Typeface.createFromAsset(getActivity().getAssets(), "Roboto-Italic.ttf");        data.setCenterText1Typeface(typeface1);        // Get font size from dimens.xml and convert it to sp(library uses sp values).        data.setCenterText1FontSize(16);        data.setCenterText2(orderStatusArray[status] + "费用");        data.setCenterText2Color(getResources().getColor(R.color.colorSkyBlue));        Typeface typeface2 = Typeface.createFromAsset(getActivity().getAssets(), "Roboto-Italic.ttf");        data.setCenterText2Typeface(typeface2);        data.setCenterText2FontSize(22);        mPieChartView.setPieChartData(data);//为饼图设置数据        mPieChartView.setCircleFillRatio(0.7f);//设置饼图其中的比例        mPieChartView.setViewportCalculationEnabled(true);//设置饼图自动适应大小        mPieChartView.setValueSelectionEnabled(true);//选择饼图的某一块变大        mPieChartView.setAlpha(0.8f);//设置透明度//        mPieChartView.setChartRotation(360, true);//设置饼图旋转角度，且是否为动画        mPieChartView.setChartRotationEnabled(true);//设置饼图是否可以手动旋转//        mPieChartView.moveToWithAnimation(1, 2);//移动到指定位置        mPieChartView.startDataAnimation(1000);//延时开启动画    }

MPAndroidChart

private void initPieChart(PieChart pieChart) {    pieChart.setUsePercentValues(true);//显示成百分比    pieChart.setDescription("BarChart Test");    pieChart.setOffsets(5, 10, 5, 5);// 设置偏移量    pieChart.setDrawHoleEnabled(true);//是否内环显示    pieChart.setTransparentCircleRadius(55f); //空心圆半径    pieChart.setHoleRadius(50f);  //内环半径    pieChart.setDrawCenterText(true);  //饼状图中间可以添加文字    pieChart.setRotationAngle(90); // 初始旋转角度    pieChart.setRotationEnabled(true); // 可以手动旋转    pieChart.setCenterText("PieChart");  //饼状图中间的文字    //设置数据    PieData pieData = getPieData(6);    pieChart.setData(pieData);    Legend mLegend = pieChart.getLegend();  //设置比例图    mLegend.setPosition(Legend.LegendPosition.RIGHT_OF_CHART_CENTER);  //最左边显示    mLegend.setForm(Legend.LegendForm.SQUARE);  //设置比例图的形状，默认是方形 SQUARE    mLegend.setXEntrySpace(7f);    mLegend.setYEntrySpace(5f);    pieChart.animateXY(1000, 1000);  //设置动画    pieChart.invalidate();}private PieData getPieData(int count) {    int[] yy = {121, 12, 18, 20, 28, 10};    ArrayList<String> xValues = new ArrayList<>();  //xVals用来表示每个饼块上的内容    for (int i = 0; i < count; i++) {        //饼块上显示成PieChart1, PieChart2, PieChart3, PieChart4，PieChart5，PieChart6        xValues.add("PieChart" + (i + 1));    }    /**     * 将一个饼形图分成六部分， 各个部分的数值比例为12:12:18:20:28:10     * 所以 12代表的百分比就是12%     * 在具体的实现过程中，这里是获取网络请求的list的数据     */    ArrayList<Entry> yValues = new ArrayList<Entry>();  //yVals用来表示封装每个饼块的实际数据    for (int i = 0; i < count; i++) {        yValues.add(new Entry(yy[i], i));    }    //y轴的集合    PieDataSet pieDataSet = new PieDataSet(yValues, "PieChart Revenue 2014");    pieDataSet.setSliceSpace(0f); //设置个饼状图之间的距离    // 饼图颜色    ArrayList<Integer> colors = new ArrayList<Integer>();    colors.add(Color.rgb(205, 205, 205));    colors.add(Color.rgb(114, 188, 223));    colors.add(Color.rgb(255, 123, 124));    colors.add(Color.rgb(57, 135, 200));    colors.add(Color.rgb(30, 20, 200));    colors.add(Color.rgb(80, 60, 150));    pieDataSet.setColors(colors);    //dataSet.setXValuePosition(PieDataSet.ValuePosition.OUTSIDE_SLICE);    DisplayMetrics metrics = getResources().getDisplayMetrics();    float px = 5 * (metrics.densityDpi / 160f);    pieDataSet.setSelectionShift(px); // 选中态多出的长度    return new PieData(xValues, pieDataSet);}

0 0