关于 MPAndroidChart 中的 LineChart 的使用小结

不得不说MPAndroidChart这个开源库是比较强大的,在描述各种数据图形上,功能还是比较齐全,最近一直在使用Linechart,看到网上的案例大多都是讲一些属性,没有具体的一个使用Demo和用户体验,所以自己稍微封装了一下其中的Linechart实现功能。

使用的jar包:mpchartlib.jar

相关API:https://jitpack.io/com/github/PhilJay/MPAndroidChart/v2.2.5/javadoc/

前提是,这个封装好的类,只适用于传入数据并打印,功能比较简单。

public class LineChartShow {
    private LineChart mLineChart;
    private LineData mLineData;
    
    //默认显示
    public LineChartShow(LineChart lineChart) {
        mLineChart = lineChart;
        showChart(mLineChart,new LineData(),Color.TRANSPARENT);
    }
    //清除数据
    public void ClearData(){
        showChart(mLineChart,new LineData(),Color.TRANSPARENT);
    }
    //画图,传入参数
    public void drawLineonStart(float[] yData,int WLstartpoint,int WLendpoint,int WLspace) {
        mLineData = getLineData(yData,WLstartpoint,WLendpoint,WLspace);
        showChart(mLineChart, mLineData, Color.TRANSPARENT);
    }

    // 设置显示的样式
    private void showChart(LineChart lineChart, LineData lineData, int color) {
        lineChart.setDrawBorders(true); // 是否在折线图上添加边框
        lineChart.setDescription("NIRSA");// 数据描述
        lineChart.setDescriptionPosition(550,60);//设置表格描述
        lineChart.setDescriptionColor(Color.BLACK);//设置颜色
        // 如果没有数据的时候,会显示这个,类似listview的emtpyview
        lineChart.setNoDataTextDescription("You need to provide data for the chart.");
        lineChart.setDrawGridBackground(true); // 是否显示表格颜色
//        lineChart.setGridBackgroundColor(Color.WHITE & 0x70FFFFFF); // 表格的的颜色,在这里是是给颜色设置一个透明度
        lineChart.setGridBackgroundColor(Color.WHITE);
        lineChart.setTouchEnabled(true); // 设置是否可以触摸
        lineChart.setDragEnabled(true);// 是否可以拖拽
        lineChart.setScaleEnabled(true);// 是否可以缩放
        lineChart.setPinchZoom(true);//X、Y轴同时缩放
        lineChart.getAxisRight().setEnabled(false); // 隐藏右边 的坐标轴
//        lineChart.getXAxis().setPosition(XAxis.XAxisPosition.BOTTOM);//设置横坐标在底部
        lineChart.getXAxis().setGridColor(Color.TRANSPARENT);//去掉网格中竖线的显示
        // if disabled, scaling can be done on x- and y-axis separately
        lineChart.setPinchZoom(false);//
        lineChart.setBackgroundColor(color);// 设置背景
        // add data
        lineChart.setData(lineData); // 设置数据,默认设置空数据
        // get the legend (only possible after setting data)
        Legend mLegend = lineChart.getLegend(); // 设置比例图标示,就是那个一组y的value的
        mLegend.setForm(Legend.LegendForm.CIRCLE);// 样式
        mLegend.setFormSize(6f);// 字体
        mLegend.setTextColor(Color.WHITE);// 颜色
        // mLegend.setTypeface(mTf);// 字体
        lineChart.animateX(0); // 立即执行的动画,x轴

        /**
         * 设置X轴
         * */
        XAxis xAxis = lineChart.getXAxis();
        xAxis.setEnabled(true);//显示X轴
        xAxis.setPosition(XAxis.XAxisPosition.BOTTOM);//X轴位置
        xAxis.setDrawGridLines(true);//设置x轴上每个点对应的线
        xAxis.setSpaceBetweenLabels(2);
        xAxis.setDrawGridLines(false);


        /**
         *
         * 设置左侧Y轴
         * */

        YAxis leftAxis = lineChart.getAxisLeft();
        leftAxis.setPosition(YAxis.YAxisLabelPosition.OUTSIDE_CHART);
//        leftAxis.setValueFormatter();//自定义Y轴数据格式
        leftAxis.setStartAtZero(false);//设置Y轴的数据不是从0开始
        leftAxis.setDrawTopYLabelEntry(true);
    }


    /**
     * 生成一个数据
     *
     * @return
     * @paramcount 表示图表中有多少个坐标点
     * @paramrange 用来生成range以内的随机数
     */
    private LineData getLineData(float[] yData,int WLstartpoint,int WLendpoint,int WLspace) {

        //设置X轴的标签,此处只是简单的数字
        String[] xData = new String[yData.length];
        int count = 0;
        int[] app = new int[yData.length];
        for (int i = 0; i < app.length; i++){
            app[i] = count;
            xData[i] = String.valueOf(app[i]);
            count++;
        }

        // X轴的数据,这里传入了Xstart、Xend、Xspace值
        int dataLength = yData.length;
        ArrayList xValues = new ArrayList();
        for (int i = WLstartpoint; i <= WLendpoint; i+=WLspace) {
            xValues.add("" + i);
        }
        // y轴的数据
        ArrayList yValues = new ArrayList();
        for (int i = 0; i < dataLength; i++) {
            yValues.add(new Entry(yData[i], i));
        }

        // y轴的数据集合
        LineDataSet lineDataSet = new LineDataSet(yValues, "" /* 显示在比例图上 */);
        // 用y轴的集合来设置参数
        lineDataSet.setLineWidth(2.0f); // 线宽
        lineDataSet.setCircleSize(0f);// 显示的圆形大小
        lineDataSet.setColor(Color.BLUE);// 显示颜色
        lineDataSet.setCircleColor(Color.TRANSPARENT);// 圆形的颜色
        lineDataSet.setHighLightColor(Color.TRANSPARENT); // 点击后高亮的线的颜色
        lineDataSet.setDrawValues(false);//隐藏折线图每个数据点的值
        ArrayList lineDataSets = new ArrayList();
        lineDataSets.add(lineDataSet); // add the datasets
        lineDataSet.setDrawCircles(false);//图表上的数据点是否用小圆圈表示
        lineDataSet.setDrawCubic(true);//允许设置平滑曲线
//        lineDataSet.setCubicIntensity(2.0f);//设置折线的平滑度
        lineDataSet.setDrawFilled(false);//是否填充折线下方
        lineDataSet.setFillColor(Color.rgb(0, 255, 255));//折线图下方填充颜色设置
        LineData lineData = new LineData(xValues,lineDataSets);
        return lineData;
    }
}
getLineData()中传入的参数分别是Y轴数据,X轴的数据(包括起始、结束、以及X轴的间距),其中具体的一些属性设置,均已标出,总体来说,还是比较简单的,目前还存在一个问题是关于X、Y轴的轴描述值,即X、Y轴的定义没有实现,英语水平比较鸡肋,查看了AxisBase和XAxis、YAxis这几个类的API,也没有发现如何实现,但在之前的版本中,据说是有这个方法的,只是最近的变动有点儿大,并没有找到这个方法,希望某个大牛可以解决一下。

注:这几天一直在看github上的解释和API以及发布问题等,暂时得到结论,目前.MPAndroidChart这个库不支持自定义设置X、Y轴轴描述值的方法,所以暂时可以使用TextView来进行设置。如果后续有更新,我会继续补充的。



你可能感兴趣的:(Android)