Android-MPAndroidChart使用总结

在Android开发中，图表是很常见的，我们常常需要绘制一些图表走势图，此时运用Android的Canvas绘图类绘制时，就显得非常的繁琐，这时非常不便的。此时MPAndroidChart库诞生了，一个专注于Android图表绘制的库，在github有15K的星，使用人数时非常庞大的，接下来将总结一下，我平时用该控件的一些心得：

添加依赖：

• 在Project中的build.gradle中添加：

allprojects {
    repositories {
        jcenter()
        maven { url "https://jitpack.io" }
    }
}

• 在app中的build.gradle中添加：

compile 'com.github.PhilJay:MPAndroidChart:v3.0.2'

1. 图表设置：

// 没有数据时显示的文字
mChart.setNoDataText("当前没有数据");
// 没有数据时显示的文字颜色
mChart.setNoDataTextColor(getResources().getColor(R.color.colorBlue));
// 没有数据时显示的文字样式
mChart.setNoDataTextTypeface(Typeface.DEFAULT_BOLD);


// 设置边框颜色
mChart.setBorderColor(Color.RED);
// 是否设置边框，默认false
mChart.setDrawBorders(true);
// 网格背景色
mChart.setGridBackgroundColor(Color.GREEN);
// 是否绘制网格背景，默认false
mChart.setDrawGridBackground(false);

// 图表背景色
mChart.setBackgroundColor(Color.GRAY);

// 图表描述类
Description desc = new Description();
// 设置文字
desc.setText("热力图表");
// 设置文字颜色
desc.setTextColor(Color.BLACK);
// 设置文字大小
desc.setTextSize(14f);
// 设置图表描述(一般显示在右下方)
mChart.setDescription(desc);
// 不绘制图表描述(默认true)
mChart.getDescription().setEnabled(false);


// 从左往右绘制图形
mChart.animateX(1500);
// 从下往上绘制图形
mChart.animateY(1500);

// 放大到1.4倍
mChart.zoomIn();
// 缩小到0.7倍
mChart.zoomOut();
// 缩放(自定义)
mChart.zoom(2.0f,1.0f,0,0);


// 设置是否可缩放
mChart.setScaleEnabled(true);
// 设置是否可拖拽
mChart.setDragEnabled(true);
// 不允许手势：设置false时，手指缩放、拖拽、点击等效果将不能使用
mChart.setTouchEnabled(false);
// 是否允许拖拽惯性,默认true
mChart.setDragDecelerationEnabled(true);
// 拖拽惯性速率
mChart.setDragDecelerationFrictionCoef(0.5f);

2. XY轴设置：

//-----------------------------------X轴-----------------------------------

// 获取图表的X轴
XAxis xAxis = mChart.getXAxis();
// X轴最小值为5
xAxis.setAxisMinimum(5);
// x轴最大值为30
xAxis.setAxisMaximum(20);
// 是否绘制X坐标轴
xAxis.setDrawAxisLine(true);
// X坐标轴颜色
xAxis.setAxisLineColor(Color.RED);
// 设置x坐标轴字体颜色
xAxis.setTextColor(Color.GREEN);
// 设置x坐标轴字体大小
xAxis.setTextSize(14);
// 否是绘制网格线(X轴代表的为竖线)，默认true
xAxis.setDrawGridLines(false);
// 设置网格线的颜色(x轴代表的为竖线)
xAxis.setGridColor(Color.GREEN);
/**
  * 绘制虚线网格线，
  * DashPathEffect:
  * @params:new float[]{30,20,30,20}   先绘制30px实线，再绘制20px透明，再绘制30px实线，再绘制20px透明
  * @params:0  偏移量,若为20，则效果为：先绘制10px实线，再绘制20px透明，再绘制30px实线，再绘制20px透明
  */
xAxis.setGridDashedLine(new DashPathEffect(new float[]{30,20,30,20},0));
// X轴绘制在图表低端,默认在顶部
xAxis.setPosition(XAxis.XAxisPosition.BOTTOM);

//-----------------------------------Y轴-----------------------------------

YAxis yAxis = mChart.getAxisLeft();
// Y轴最小值为5
yAxis.setAxisMinimum(5);
// Y轴最大值为30
yAxis.setAxisMaximum(20);
// 是否绘制Y坐标轴
yAxis.setDrawAxisLine(true);
// Y坐标轴颜色
yAxis.setAxisLineColor(Color.RED);
// 设置y坐标轴字体颜色
yAxis.setTextColor(Color.GREEN);
// 设置y坐标轴字体大小
yAxis.setTextSize(14);
// 否是绘制网格线(Y轴代表的为横线)，默认true
yAxis.setDrawGridLines(true);
// 设置网格线的颜色(Y轴代表的为横线)
yAxis.setGridColor(Color.GREEN);
/**
  * 绘制虚线网格线，
  * DashPathEffect:
  * @params:new float[]{30,20,30,20}   先绘制30px实线，再绘制20px透明，再绘制30px实线，再绘制20px透明
  * @params:0  偏移量,若为20，则效果为：先绘制10px实线，再绘制20px透明，再绘制30px实线，再绘制20px透明
  */
yAxis.setGridDashedLine(new DashPathEffect(new float[]{30,20,30,20},0));
// 不绘制右边Y值
mChart.getAxisRight().setEnabled(false);

3. 设置图例(图例默认会以小方格形式在图表左下角显示)

// 获取图例(即左下角中各个图形的标识)
Legend legend = mChart.getLegend();
// 设置绘制图例(默认true)
legend.setEnabled(true);
// 设置图例文字颜色
legend.setTextColor(Color.RED);
// 设置图例文字大小
legend.setTextSize(14);
// 设置图例位置：水平居中
legend.setHorizontalAlignment(Legend.LegendHorizontalAlignment.CENTER);
// 设置图例样式(默认是小方格)
legend.setForm(Legend.LegendForm.CIRCLE);
// 设置图例大小
legend.setFormSize(30);

4. 为图表添加数据:

List<Entry> data1 = new ArrayList<>();
for (int i = 0; i < 20; i++) {
    int m = new Random().nextInt(50) + 10;
    // i:x值，m：y值
    data1.add(new Entry(i,m));
}

5. 线条设置：

LineDataSet set2 = new LineDataSet(data2,"line2");
// 设置线条颜色
set2.setColor(Color.BLUE);
// 设置线条宽度
set2.setLineWidth(2f);
// 设置圆的颜色
set2.setCircleColor(Color.RED);
// 设置节点圆的半径
set2.setCircleRadius(10f);
// 是否绘制空心圆(默认true)
//set2.setDrawCircleHole(true);
// 高亮颜色(点击时出现的颜色)
set2.setHighLightColor(Color.BLUE);
/**
 * 虚线绘制：
 * @params 30 实线长
 * @params 20 虚线长
 * @params 0  偏移
 */
set2.enableDashedLine(30,20,0);
// 空心圆半径,需比实心圆半径小，否则变成了实心圆
set2.setCircleHoleRadius(5);
// 空心圆颜色,默认白色
set2.setCircleColorHole(Color.YELLOW);

6. 在图表中显示

LineData lineData = new LineData(set1,set2);
// 设置是否显示高亮，默认true
lineData.setHighlightEnabled(false);
// 线条显示的数值颜色
lineData.setValueTextColor(Color.BLUE);
// 线条显示的数值文字大小
lineData.setValueTextSize(9f);
//

mChart.setData(lineData);