MPAndroidChart的简单使用折线图

好多天没有写代码了 今天就来更新一下 聊聊最好用的图表控件MPAndroidChart

废话也不多说 接下来就教大家怎样使用

咱们先来个折线图

引入开源库
在项目根目录的build.gradle文件中加入如下代码

allprojects {
    repositories {
        maven { url "https://jitpack.io" }
    }
}
在app根目录的buil.gradle文件中加入依赖

dependencies {
    compile 'com.github.PhilJay:MPAndroidChart:v3.0.1'
}

折线图

首先是我们的布局文件了

<com.github.mikephil.charting.charts.LineChart
                android:id="@+id/mChart"
                android:layout_width="match_parent"
                android:layout_height="match_parent" />

然后在我们的Activity里写主要的展示代码
传入折线的数据

List<List<RequestAnalysisCrtResult>> body = viewMode.analysisCrtBeanObservableList.get().getBody();
initDefaultBarChart(mChart,body);

private void initDefaultBarChart(LineChart mChart, List<List<RequestAnalysisCrtResult>> body) {
        /**
         * Entry 坐标点对象  构造函数 第一个参数为x点坐标 第二个为y点
         */
//LineDataSet每一个对象就是一条连接线


        ArrayList<Entry> values1 = new ArrayList<>();
        ArrayList<Entry> values2 = new ArrayList<>();

        final List<RequestAnalysisCrtResult> requestAnalysisCrtResults = body.get(0);
        if (requestAnalysisCrtResults != null && requestAnalysisCrtResults.size() != 0) {
            for (int i = 0; i < requestAnalysisCrtResults.size(); i++) {

                double mkWeight = requestAnalysisCrtResults.get(i).getMkWeight();
                values2.add(new Entry((float) i, (float) mkWeight));


                double pmWeight = requestAnalysisCrtResults.get(i).getPmWeight();
                values1.add(new Entry((float) i, (float) pmWeight));

            }
        }else{
            return;
        }



        //LineDataSet每一个对象就是一条连接线
        LineDataSet set1;
        LineDataSet set2;



        //判断图表中原来是否有数据
        if (mChart.getData() != null &&
                mChart.getData().getDataSetCount() > 0) {
            //获取数据1
            set1 = (LineDataSet) mChart.getData().getDataSetByIndex(0);
            set1.setValues(values1);
            set1= (LineDataSet) mChart.getData().getDataSetByIndex(1);
            set1.setValues(values2);
            //刷新数据
            mChart.getData().notifyDataChanged();
            mChart.notifyDataSetChanged();
            mChart.getDescription().setEnabled(false);
            mChart.setDrawGridBackground(false);
            mChart.setNoDataText("暂无数据");
        } else {
            //设置数据1  参数1：数据源 参数2：图例名称
            set1 = new LineDataSet(values1, "采购");
            set1.setColor(Color.BLUE);
            set1.setCircleColor(Color.BLUE);
            set1.setLineWidth(1f);//设置线宽
            set1.setCircleRadius(3f);//设置焦点圆心的大小
            set1.enableDashedHighlightLine(10f, 5f, 0f);//点击后的高亮线的显示样式
            set1.setHighlightLineWidth(2f);//设置点击交点后显示高亮线宽
            set1.setHighlightEnabled(true);//是否禁用点击高亮线
            set1.setHighLightColor(Color.RED);//设置点击交点后显示交高亮线的颜色
            set1.setValueTextSize(9f);//设置显示值的文字大小
            set1.setDrawFilled(false);//设置禁用范围背景填充
            set1.setMode(LineDataSet.Mode.CUBIC_BEZIER);
           set1.setDrawFilled(true);
            //设置数据2
            set2 = new LineDataSet(values2, "销售");
            set2.setColor(Color.RED);
            set2.setCircleColor(Color.RED);
            set2.setLineWidth(1f);
            set2.setCircleRadius(3f);
            set2.setValueTextSize(10f);
            set2.setMode(LineDataSet.Mode.CUBIC_BEZIER);
            set2.setDrawFilled(true);
            //保存LineDataSet集合
            ArrayList<ILineDataSet> dataSets = new ArrayList<>();
            dataSets.add(set1); // add the datasets
            dataSets.add(set2);
            //创建LineData对象 属于LineChart折线图的数据集合
            LineData data = new LineData(dataSets);
            // 添加到图表中
            mChart.setData(data);
            //绘制图表
            mChart.invalidate();
        }


  		//设置图表的属性
        XAxis xAxis = mChart.getXAxis();
        xAxis.setPosition(XAxis.XAxisPosition.BOTTOM);
        xAxis.setTypeface(mTf);
        xAxis.setDrawGridLines(false);
        xAxis.setDrawAxisLine(true);
        YAxis leftAxis = mChart.getAxisLeft();
        leftAxis.setTypeface(mTf);
        leftAxis.setLabelCount(5, false);
        leftAxis.setAxisMinimum(0f); // this replaces setStartAtZero(true)

        YAxis rightAxis = mChart.getAxisRight();
        rightAxis.setTypeface(mTf);
        rightAxis.setLabelCount(5, false);
        rightAxis.setDrawGridLines(false);
        rightAxis.setAxisMinimum(0f); // this replaces setStartAtZero(true)

        Legend l = mChart.getLegend();
        l.setVerticalAlignment(Legend.LegendVerticalAlignment.TOP);
        l.setHorizontalAlignment(Legend.LegendHorizontalAlignment.LEFT);
        l.setOrientation(Legend.LegendOrientation.VERTICAL);
        l.setDrawInside(false);
        l.setXEntrySpace(4f);
        l.setYEntrySpace(0f);
        l.setYOffset(0f);

        l.setForm(Legend.LegendForm.CIRCLE);
        //设置日期
        mChart.getXAxis().setLabelCount(requestAnalysisCrtResults.size(), true);
        mChart.getXAxis().setLabelRotationAngle(-60);
        mChart.getXAxis().setValueFormatter(new IAxisValueFormatter() {
            @Override
            public String getFormattedValue(float value, AxisBase axis) {
                if ((int) Math.ceil(value) == requestAnalysisCrtResults.size() || (int) Math.ceil(value) > requestAnalysisCrtResults.size() || (int) Math.ceil(value) < 0) {
                    return "";
                }
                if (((int) value) < requestAnalysisCrtResults.size()) {
                    if (requestAnalysisCrtResults != null && requestAnalysisCrtResults.size() != 0 || (int) Math.ceil(value) <= requestAnalysisCrtResults.size()) {
                        return requestAnalysisCrtResults.get((int) Math.ceil(value)).getWeiDate() == null ? "" : requestAnalysisCrtResults.get((int) Math.ceil(value)).getWeiDate();
                    } else {
                        return null;
                    }
                } else {
                    return null;
                }
            }
        });

这样就很容易实现折线图了 是不是很简单呢