MPAndroidChart库绘制图表入门

MPAndroidChart ，一个强大的 Android 图表视图/图形视图库，包括折线图/条形图/圆饼图/雷达图/气泡图/烛台图等样式，支持缩放，拖动和动画等操作。

Grddle 添加依赖

在项目的 build.gradle 文件中添加

allprojects {
    repositories {
        maven { url 'https://jitpack.io' }
    }
}
...
dependencies {
    implementation 'com.github.PhilJay:MPAndroidChart:v3.0.3'
}

创建图表

在 .xml 布局文件中定义自己所需的视图控件，包括 LineChart，BarChart，ScatterChart，CandleStickChart，PieChart，BubbleChart，RadarChart。本文主要介绍 LineChart 相关使用，如下：

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

在布局所对应的 Activity，Fragment 中或其他地方进行实例化：

// in this example, a LineChart is initialized from xml
LineChart chart = (LineChart) findViewById(R.id.chart);

或者动态添加该图表控件到代码中：

// programmatically create a LineChart
LineChart chart = new LineChart(Context);

// get a layout defined in xml
RelativeLayout rl = (RelativeLayout) findViewById(R.id.relativeLayout);
rl.add(chart); // add the programmatically created chart

添加数据

获取到图表实例后，可以创建数据并将其添加到图表上。下面例子使用的 LineChart，对于这个 Entry 类，图表中有一个单独的条目，其中有x和y坐标。

要将数据添加到图表，需要把每个数据对象包装到 Entry 对象中。如下：

YourData[] dataObjects = ...;

List<Entry> entries = new ArrayList<Entry>();

for (YourData data : dataObjects) {
    // 把数据转变为一系列 Entry 对象
    entries.add(new Entry(data.getValueX(), data.getValueY())); 
}

接下来，我们需要将创建的 List<Entry> 添加到一个 LineDataSet 对象中。DataSet 对象持有属于一起的数据（hold data which belongs together），而且该对象允许对该数据进行单独的样式化（individual styling）。下面使用的 “Lable” 只有一个描述性的目的，如果要启用，将显示在图表字符上。

LineDataSet dataSet = new LineDataSet(entries, "Label"); // add entries to dataset
dataSet.setColor(...);
dataSet.setValueTextColor(...); // styling, ...

最后，需要将创建的 LineDataSet 对象（或多的对象）添加到 LineData对象中。该对象持有了代表 Chart 实例的所有数据，而且允许进一步的风格化。在创建好数据对象后，我们可以把它设置到图表中进行刷新显示。

LineData lineData = new LineData(dataSet);
chart.setData(lineData);
chart.invalidate(); // refresh

最终 LineChart 图表会显示出来，如下样式：

在 AxisBase 下有两个基类，分别是表示y轴的 YAxis 和 表示x轴的 XAxis。如上图所示，默认情况下，XAxis 位于图表上方，YAxis 分在两边，没有特殊设置的情况下，右边的 YAxis 会随着左边的 YAxis 进行绘制。

与图表的交互设置

方法	描述
setTouchEnabled(boolean enabled)	允许启用/禁用所有可能的与图表的触摸交互
setDragEnabled(boolean enable)	启用/禁用拖动（平移）图表
setScaleEnabled(boolean enable)	启用/禁用在两个轴上的缩放比例
setScaleXEnabled(boolean enabled)	在x轴上启用/禁用缩放
setScaleYEnabled(boolean enabled)	在y轴上启用/禁用缩放
setPinchZoom(boolean enabled)	如果设置为 true，则启用捏缩放。如果禁用，x轴和y轴可以分开放大
setDoubleTapZoomEnabled(boolean enabled)	将其设置为false，可以禁止通过双击来缩放图表

chart.setTouchEnabled(false); 
chart.setDragEnabled(false);
chart.setScaleEnabled(false); 
chart.setScaleXEnabled(false); 
chart.setScaleYEnabled(false);
chart.setPinchZoom(false); 
chart.setDoubleTapToZoomEnabled(false); 
...

Highlighting 值

通过 LineDataSet 进行 Highlighting 设置

dataSet.setHighlightEnabled(true); //允许突出显示DataSet
dataSet.setDrawHighlightIndicators(true);
dataSet.setHighLightColor(Color.BLACK); //突出显示指示符的颜色
...

Highlight highlight = new Highlight(8f, 8f, 0);
Highlight highlight2 = new Highlight(4f, 4f, 0);
chart.highlightValues(new Highlight[] {highlight, highlight2});

如上图所示，这个 Highlighting 其实就是图表上突出显示的 （4， 4）和 （8，8）两个坐标点。

The Axis 坐标轴设置

方法	描述
setEnabled(boolean enabled)	设置启用/禁用，如果禁用，则不管任何其它设置，都不会绘制轴的任何部分
setDrawLabels(boolean enabled)	设置为true，会启用绘制轴的标签（轴上的数字）
setDrawAxisLine(boolean enabled)	设置为true，绘制轴旁边线条(line alongside the axis)
setDrawGridLines(boolean enabled)	设置为true，能够绘制轴的网格线

// 使默认的右y轴不绘制
YAxis rightAxis = chart.getAxisRight();
rightAxis.setEnabled(false);
// 指定左y轴的最大数
YAxis leftAxis = chart.getAxisLeft();
leftAxis.setAxisMaximum(20f);
leftAxis.setTextColor(Color.BLUE);
leftAxis.setTextSize(20f);
leftAxis.setGridColor(Color.BLUE);
leftAxis.setGridLineWidth(2f);
leftAxis.setAxisLineColor(Color.BLUE);
// 在y轴上添加极限值线
LimitLine line = new LimitLine(6f, getString(R.string.limit_line));
line.setLineColor(Color.RED);
line.setLineWidth(2f);
line.setTextColor(Color.BLACK);
line.setTextSize(12f);
leftAxis.addLimitLine(line);

// 把x轴置于图表下方
XAxis mXAxis = chart.getXAxis();
mXAxis.setPosition(XAxis.XAxisPosition.BOTTOM);
// 把x轴数字标签倾斜45度
mXAxis.setLabelRotationAngle(45f);

我们还可以将坐标轴的上的标签格式化，通过 axis.setValueFormatter(IAxisValueFormatter formatter)方法将自定义的格式化的设置轴。如下：

// the labels that should be drawn on the XAxis
final String[] quarters = new String[] { "Q1", "Q2", "Q3", "Q4" };

IAxisValueFormatter formatter = new IAxisValueFormatter() {

    @Override
    public String getFormattedValue(float value, AxisBase axis) {
        return quarters[(int) value];
    }

    // we don't draw numbers, so no decimal digits needed
    @Override
    public int getDecimalDigits() {  return 0; }
};

XAxis xAxis = chart.getXAxis();
xAxis.setGranularity(1f); // minimum axis-step (interval) is 1
xAxis.setValueFormatter(formatter);

更多标签格式化设置信息参考 The ValueFormatter interface 和 The AxisValueFormatter interface。

设置数据

如果想要添加值到图表中，通过如下方法：

public void setData(ChartData data) { ... }

一个 DataSet 对象表示图表中的一组条目，它们属于一起。它旨在从逻辑上分离图表中的不同组值。对于每种类型的图表，存在允许特定样式的扩展的不同对象 DataSet（如 LineDataSet）。

举例，如果想在一个 LineChart 图表中显示多组折线，也就是创建多个 LineDataSet 对象。通过 setAxisDependency(...)方法，DataSet 指定应绘制的轴 如下所示：

// add data
        List<Entry> entries1 = new ArrayList<>();
        List<Entry> entries2 = new ArrayList<>();
        List<DataBean> list1 = new ArrayList<>();
        List<DataBean> list2 = new ArrayList<>();
        for (int i = 0; i < 10; i++) {
            list1.add(new DataBean(Integer.parseInt(getResources().getStringArray(
                    R.array.data_value_x)[i]), Integer.parseInt(getResources().getStringArray(
                    R.array.data_value_y)[i])));
            list2.add(new DataBean(Integer.parseInt(getResources().getStringArray(
                    R.array.data_value_x)[i]), Integer.parseInt(getResources().getStringArray(
                    R.array.data_value_y1)[i])));
        }

        for (DataBean data: list1) {
            entries1.add(new Entry(data.getX(), data.getY()));
        }

        for (DataBean data: list2) {
            entries2.add(new Entry(data.getX(), data.getY()));
        }
        // create LineDataSet object
        // axis dependency-support different axis scales
        LineDataSet dataSet1 = new LineDataSet(entries1, getString(R.string.line_data_set1));
        dataSet1.setAxisDependency(YAxis.AxisDependency.LEFT);
        dataSet1.setColor(Color.BLACK);

        LineDataSet dataSet2 = new LineDataSet(entries2, getString(R.string.line_data_set2));
        dataSet2.setAxisDependency(YAxis.AxisDependency.RIGHT);
        dataSet1.setColor(Color.BLUE);

        List<ILineDataSet> dataSets = new ArrayList<>();
        dataSets.add(dataSet1);
        dataSets.add(dataSet2);

        // create LineData object
        LineData lineData = new LineData(dataSets);
        // set LineData to the chart
        mLineChart.setData(lineData);
        // refresh chart
        mLineChart.invalidate();

更多信息可查看官方文档

https://github.com/PhilJay/MPAndroidChart/wiki

文章只是作为个人记录学习使用，如有不妥之处请指正，谢谢。