Android开发之初试MPAndroidChart

  使用MPAndroidChart需要先导入库，做法如下：

//在项目根目录的build.gradle中添加信息
allprojects {
    repositories {
        maven { url "https://jitpack.io" }
    }
}

//在app目录下build.gradle中添加信息
dependencies {
    implementation 'com.github.PhilJay:MPAndroidChart:v3.0.2'
}

  库我们导入完了，接下来简单的说明一下使用。

//在布局文件中，添加图表控件
//LineChart 是折线图
 <com.github.mikephil.charting.charts.LineChart
            android:id="@+id/chart"
            android:layout_width="match_parent"
            android:layout_height="200dp">
 </com.github.mikephil.charting.charts.LineChart>

   贴一下实现代码，下面的这个例子用了两条线。

        lineChart = findViewById(R.id.chart);

        /*折线图*/
        //自定义了一个数据类
        MyData myData[] = {new MyData(1, 20), new MyData(2, 30),
                new MyData(3, 40), new MyData(4, 40), new MyData(5, 60)};

        MyData myDataT[] = {new MyData(1, 80), new MyData(2, 40),
                new MyData(3, 50), new MyData(4, 30), new MyData(5, 10)};
        //装数据，一条线上所有的数据点的集合
        List<Entry> entries = new ArrayList<>();
        for (MyData mData : myData) {

            entries.add(new Entry(mData.getX(), mData.getY()));
        }

        List<Entry> entries2 = new ArrayList<>();
        for (MyData mData : myDataT) {

            entries2.add(new Entry(mData.getX(), mData.getY()));
        }

        //给这条线起个名字，并对文字颜色、大小做一些设置
        LineDataSet dataSet = new LineDataSet(entries, "数据一");
        dataSet.setColor(Color.BLUE);//线的颜色
        //格式化值
        dataSet.setValueFormatter(new IValueFormatter() {

            @Override
            public String getFormattedValue(float value, Entry entry, int dataSetIndex, ViewPortHandler viewPortHandler) {
                return value + "元";
            }
        });
        //数据二
        LineDataSet dataSet2 = new LineDataSet(entries2, "数据二");
        dataSet2.setColor(Color.GREEN);//线的颜色

        //装入集合
        List<ILineDataSet> iLineDataSets = new ArrayList<>();
        iLineDataSets.add(dataSet);
        iLineDataSets.add(dataSet2);

        //如果是只显示一条线，直接传dataSet就可以了
        LineData lineData = new LineData(iLineDataSets);
        //设置边框是否绘制，边框线的粗细
        //chart.setDrawBorders(true);
        //chart.setBorderWidth(1);

        /*图表的缩放*/
        //图表是否允许Y轴缩放
        lineChart.setScaleYEnabled(false);
        //chart.setScaleEnabled(true);   // 两个轴上的缩放,X,Y分别默认为true
        // chart.setScaleXEnabled(true);  // X轴上的缩放,默认true
        // chart.setScaleYEnabled(true);  // Y轴上的缩放,默认true
        // chart.setPinchZoom(true);  // X,Y轴同时缩放
        // chart.setDoubleTapToZoomEnabled(true); // 双击缩放,默认true

        /*设置右下角的文本描述,文字大小、颜色、内容等*/
        Description description = new Description();
        description.setText("产量表");
        description.setEnabled(true);//是否显示右下角文字信息
        lineChart.setNoDataText("暂无数据"); // 没有数据时显示的内容
        lineChart.setDescription(description);

        /*轴与网格线*/
        XAxis xAxis = lineChart.getXAxis();
        xAxis.setDrawLabels(true);//x轴上的数值是否显示
        xAxis.setDrawAxisLine(true);//是否绘制X轴
        xAxis.setDrawGridLines(false);//是否绘制X轴的网格线
        xAxis.setPosition(XAxis.XAxisPosition.BOTTOM);//X轴的位置
        lineChart.getAxisRight().setEnabled(false);//取消y轴的右侧
        lineChart.getAxisLeft().setDrawGridLines(false);//是否绘制Y轴的网格线

        /*设置点击数据点后的弹窗*/
        //传入一个自定义的布局
        final MarkerView markerView = new MarkerView(CharActivity.this, R.layout.item_chart);
        lineChart.setMarker(markerView);
        lineChart.setData(lineData);//装载数据
        lineChart.invalidate();
        final TextView tv_X = markerView.findViewById(R.id.tv_X);
        final TextView tv_Y = markerView.findViewById(R.id.tv_Y);
        //设置数据点点击事件，这里是更新弹窗中的信息
        lineChart.setOnChartValueSelectedListener(new OnChartValueSelectedListener() {
            @Override
            public void onValueSelected(Entry e, Highlight h) {

                tv_X.setText(e.getX() + "");
                tv_Y.setText(e.getY() + "");
            }
            @Override
            public void onNothingSelected() {
            }
        });

  效果图：

柱状图

 <com.github.mikephil.charting.charts.BarChart
            android:id="@+id/bc"
            android:layout_width="match_parent"
            android:layout_height="200dp"
            app:layout_constraintTop_toBottomOf="@id/chart">     
 </com.github.mikephil.charting.charts.BarChart>

        barChart = findViewById(R.id.bc);
        List<BarEntry> barEntries = new ArrayList<>();
        barEntries.add(new BarEntry(2000, 20));
        barEntries.add(new BarEntry(2001, 30));
        barEntries.add(new BarEntry(2002, 10));
        barEntries.add(new BarEntry(2003, 40));

        BarDataSet barDataSet = new BarDataSet(barEntries, "数据一");
        BarData barData = new BarData(barDataSet);

        XAxis xAxis1 = barChart.getXAxis();
        xAxis1.setPosition(XAxis.XAxisPosition.BOTTOM);
        xAxis1.setDrawGridLines(false);
        barChart.getAxisRight().setEnabled(false);
        barChart.getAxisLeft().setValueFormatter(new IAxisValueFormatter() {
            @Override
            public String getFormattedValue(float value, AxisBase axis) {

                return (int) value + "吨";
            }
        });
        //给开头和结尾留空白
        barChart.setFitBars(true);
        barChart.setData(barData);
        barChart.invalidate();

  效果图：

饼状图

        <com.github.mikephil.charting.charts.PieChart
            android:id="@+id/pc"
            android:layout_width="match_parent"
            android:layout_height="200dp"
            app:layout_constraintTop_toBottomOf="@id/bc">
        </com.github.mikephil.charting.charts.PieChart>

        pieChart = findViewById(R.id.pc);
        List<PieEntry> pieEntries = new ArrayList<>();
        pieEntries.add(new PieEntry(20, "部分一"));
        pieEntries.add(new PieEntry(50, "部分二"));
        pieEntries.add(new PieEntry(80, "部分三"));
        PieDataSet pieDataSet = new PieDataSet(pieEntries, "数据一");
        pieDataSet.setColors(new int[]{Color.DKGRAY, Color.CYAN, 
                    Color.GREEN});

        pieDataSet.setSliceSpace(3);//各个部分的间距
        PieData pieData = new PieData(pieDataSet);
        pieChart.setEntryLabelColor(Color.BLACK);
        //百分比显示
        pieChart.setUsePercentValues(true);
        pieChart.setData(pieData);
        pieChart.invalidate();

效果图：

雷达图

        <com.github.mikephil.charting.charts.RadarChart
            android:id="@+id/rc"
            android:layout_width="match_parent"
            app:layout_constraintTop_toBottomOf="@id/pc"
            android:layout_height="200dp">
        </com.github.mikephil.charting.charts.RadarChart>

        radarChart = findViewById(R.id.rc);
        List<RadarEntry> radarEntries = new ArrayList<>();
        radarEntries.add(new RadarEntry(1, "一"));
        radarEntries.add(new RadarEntry(2, "二"));
        radarEntries.add(new RadarEntry(3, "三"));
        radarEntries.add(new RadarEntry(5, "四"));

        RadarDataSet radarDataSet = new RadarDataSet(radarEntries, "数据一");
        RadarData radarData = new RadarData(radarDataSet);
        radarChart.setData(radarData);

效果图：