图表开源库MPAndroidChart的使用

使用版本3.0.3

chart 的一些使用规则

一个 linechart 需要两个ArrayList,其他chart 也类似。

ArrayList xList,
ArrayList yList;
xList he yList的size相等。
(i,x)与 (i,y)基于i相交于一点才会绘制在 view中。

1.lineChart

  • 1.1
1
2
3
4
5
6
7
8
9
//        关于图表的描述
int textColor = ContextCompat.getColor(mActivity, R.color.stage_text);
Description description = new Description();
description.setText("周");
description.setTextColor(textColor);
description.setTextSize(12);
description.setXOffset(5);
description.setYOffset(-15);// 相对于Y位置偏移量
mChart.setDescription(description); //图表默认右下方的描述,

  • 1.2
1
2
3
4
5
6
7
8
9
10
//图例设置    图例(声明颜色line, 颜色bar代表什么数据,  如红色代表订购率 )
Legend legend = mChart.getLegend();
legend.setHorizontalAlignment(Legend.LegendHorizontalAlignment.RIGHT);//设置图例水平对齐, 居右侧
legend.setVerticalAlignment(Legend.LegendVerticalAlignment.TOP);// 居上侧
legend.setOrientation(Legend.LegendOrientation.HORIZONTAL);// 水平
legend.setDrawInside(true); //
legend.setDirection(Legend.LegendDirection.LEFT_TO_RIGHT);// 颜色在左 文字在右
legend.setForm(Legend.LegendForm.LINE);////设置图例形状, SQUARE(方格) CIRCLE(圆形) LINE(线性)
legend.setTextSize(12f);
legend.setEnabled(true);

  • 1.3 y轴
1
2
3
4
5
6
7
8
9
10
11
12
//y轴设置  左侧
YAxis leftAxis = mChart.getAxisLeft();
leftAxis.setPosition(YAxis.YAxisLabelPosition.OUTSIDE_CHART);//设置y-labels显示的位置
leftAxis.setDrawGridLines(true);//绘制y网格线
leftAxis.enableGridDashedLine(4f, 2f, 0f);//启用网格虚线
leftAxis.setTextColor(barColor);//label字体颜色
leftAxis.setTextSize(11);//label字体大小
leftAxis.setLabelCount(Y_LABEL_COUNT, false);//y label显示的数量
leftAxis.setDrawLabels(true);//折线上显示值,则不显示坐标轴上的值
leftAxis.setAxisMinimum(0f);
IAxisValueFormatter leftFormaterr = new MyLeftYAxisValueFormatter();
leftAxis.setValueFormatter(leftFormaterr);
  • IAxisValueFormatter 格式话坐标的显示方式
    例如给y轴的所有刻度值后面都加上 ”条“、”%“

  • 1.4 绘制line或者bar等等

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
ArrayList<ILineDataSet> dataSets = new ArrayList<>();
for (int i = 0; i < entriesList.size(); ++i) {
LineDataSet set = new LineDataSet(entriesList.get(i), titles[i]);
if (lineColors != null) {
set.setColor(lineColors[i]);
set.setCircleColor(lineColors[i]);
set.setCircleColorHole(Color.WHITE);
} else {
set.setColor(LINE_COLORS[i % 3]);
set.setCircleColor(LINE_COLORS[i % 3]);
set.setCircleColorHole(Color.WHITE);
}
set.setCircleRadius(2.0f);//折线上圆点的大小。
set.setMode(LineDataSet.Mode.HORIZONTAL_BEZIER);//设置折线图样式 圆滑曲线 平滑曲线 或者 折线
set.setLineWidth(1.5f);//线的宽度(线的粗度)
set.setDrawCircles(true);//禁止显示数据坐标圆点
//设置显示/不显示 在坐标点上方显示坐标值。
set.setDrawValues(false); //Enables / disables drawing values (value-text) for all DataSets this data object contains.
set.setAxisDependency(YAxis.AxisDependency.RIGHT);// 数值属于右侧Y轴
setRightAxisMaximum(deliveryLevelTrend);
dataSets.add(set);
}

2.barChart

3.CombinedChart

3.1

1
2
3
4
5
6
7
8
9
10
11
12
13
CombinedData data = new CombinedData();

data.setData(generateLineData());
data.setData(generateBarData());
data.setData(generateBubbleData());
data.setData(generateScatterData());
data.setData(generateCandleData());
data.setValueTypeface(mTfLight);

xAxis.setAxisMaximum(data.getXMax() + 0.25f);

mChart.setData(data);
mChart.invalidate();

所有数据都必须set到一个 CombinedData中去,不然是会报错的。
也很好立即, CombinedChart就是把所有的图表整合为一个。

Fork me on GitHub