在去年4月份,就MPAndroidChart的旧版本中的LineChart进行了简单封装,上个月在做另一个项目时,无意间去看了一下这个控件的github,竟然发现更新了,所以在新项目中,尝试使用了更新之后的LineChart,发现效果还不错,接下来就这一“折线图”进行简单说明。
github地址:https://github.com/PhilJay/MPAndroidChart
public class LineChartManager {
private LineChart lineChart;
private YAxis leftAxis; //左边Y轴
private YAxis rightAxis; //右边Y轴
private XAxis xAxis; //X轴
public LineChartManager(LineChart mLineChart) {
this.lineChart = mLineChart;
leftAxis = lineChart.getAxisLeft();
// rightAxis = lineChart.getAxisRight();
xAxis = lineChart.getXAxis();
drawLineChart(null,null);
}
/**
* 初始化LineChart 一条折线
*/
private void initLineChart() {
lineChart.setDrawGridBackground(false);
lineChart.setGridBackgroundColor(Color.WHITE);
//显示边界
lineChart.setDrawBorders(true);
lineChart.setLogEnabled(false);
//设置动画效果
lineChart.animateY(0, Easing.EasingOption.Linear);
lineChart.animateX(0, Easing.EasingOption.Linear);
lineChart.getAxisRight().setEnabled(false);//隐藏右侧Y轴
// 折线图例 标签 设置
Legend legend = lineChart.getLegend();
legend.setEnabled(false);
legend.setForm(Legend.LegendForm.LINE);
legend.setTextSize(11f);
//显示位置
legend.setVerticalAlignment(Legend.LegendVerticalAlignment.BOTTOM);
legend.setHorizontalAlignment(Legend.LegendHorizontalAlignment.LEFT);
legend.setOrientation(Legend.LegendOrientation.HORIZONTAL);
legend.setDrawInside(false);
//XY轴的设置
//X轴设置显示位置在底部
xAxis.setPosition(XAxis.XAxisPosition.BOTTOM);
// xAxis.setAxisMinimum(0f);
xAxis.setGranularity(1f);
//保证Y轴从0开始,不然会上移一点
// leftAxis.setAxisMinimum(0f);
leftAxis.setStartAtZero(false);
leftAxis.setSpaceMax(50);
leftAxis.setDrawTopYLabelEntry(true);
}
/**
* 初始化LineChart 多条折线
*/
private void initLineCharts() {
lineChart.setDrawGridBackground(false);
//显示边界
lineChart.setDrawBorders(true);
lineChart.setLogEnabled(false);
//设置动画效果
lineChart.animateY(0, Easing.EasingOption.Linear);
lineChart.animateX(0, Easing.EasingOption.Linear);
lineChart.getAxisRight().setEnabled(false);//隐藏右侧Y轴
// 折线图例 标签 设置
Legend legend = lineChart.getLegend();
legend.setEnabled(true);
legend.setForm(Legend.LegendForm.LINE);
legend.setTextSize(6f);
//显示位置
legend.setVerticalAlignment(Legend.LegendVerticalAlignment.BOTTOM);
legend.setHorizontalAlignment(Legend.LegendHorizontalAlignment.LEFT);
legend.setOrientation(Legend.LegendOrientation.HORIZONTAL);
legend.setDrawInside(false);
//XY轴的设置
//X轴设置显示位置在底部
xAxis.setPosition(XAxis.XAxisPosition.BOTTOM);
// xAxis.setAxisMinimum(0f);
xAxis.setGranularity(1f);
//保证Y轴从0开始,不然会上移一点
leftAxis.setStartAtZero(false);
leftAxis.setSpaceMax(50);
leftAxis.setDrawTopYLabelEntry(true);
}
/**
* 初始化曲线 每一个LineDataSet代表一条线
* @param lineDataSet
* @param color
* @param mode 折线图是否填充
*/
private void initLineDataSet(LineDataSet lineDataSet, int color, boolean mode) {
lineDataSet.setColor(color);
lineDataSet.setCircleColor(color);
lineDataSet.setLineWidth(1f);
lineDataSet.setDrawCircles(false);//隐藏原点
lineDataSet.setDrawValues(false);//隐藏每个点的值
//设置折线图填充
lineDataSet.setDrawFilled(mode);
lineDataSet.setFormLineWidth(1f);
lineDataSet.setFormSize(15.f);
//线模式为圆滑曲线(默认折线)
lineDataSet.setMode(LineDataSet.Mode.CUBIC_BEZIER);
}
/**
* 绘制折线图 一条
*/
public void drawLineChart(float[] xData,float[] yData){
ArrayList<Float> xValues = new ArrayList<>();
List<Float> yValues = new ArrayList<>();
if (xData != null) {
for (int i = 0; i < xData.length; i++) {
xValues.add(xData[i]);
}
for (int i = 0; i < yData.length; i++) {
yValues.add(yData[i]);
}
showLineChart(xValues, yValues, "", Color.GREEN,false);
}else{
//判断 若当前折线图数据存在问题,则显示以下默认数据
float[] x = {1.0f,2.0f,3.0f,4.0f,5.0f,6.0f,7.0f,8.0f,9.0f};
float[] y1 = {-2.0f,-1.5f,-1.0f,-0.5f,0.0f,0.5f,1.0f,1.5f,2.0f};
for (int i = 0; i < x.length; i++) {
xValues.add(x[i]);
}
for (int i = 0; i < y1.length; i++) {
yValues.add(y1[i]);
}
showLineChart(xValues,yValues,"",Color.TRANSPARENT,true);
setDescription("XXXX");
}
}
/**
* 折线图具体的参数设置
*/
public void showLineChart(List<Float> xAxisValues, List<Float> yAxisValues, String label, int color,boolean flag) {
initLineChart();
ArrayList<Entry> entries = new ArrayList<>();
for (int i = 0; i < xAxisValues.size(); i++) {
entries.add(new Entry(xAxisValues.get(i), yAxisValues.get(i)));
}
// 每一个LineDataSet代表一条线
LineDataSet lineDataSet = new LineDataSet(entries,label);
initLineDataSet(lineDataSet, color, false);
ArrayList<ILineDataSet> dataSets = new ArrayList<>();
dataSets.add(lineDataSet);
LineData data = new LineData(dataSets);
//设置X轴的刻度数,通过flag来判断是否显示X轴
if (flag) {
xAxis.setEnabled(false);
leftAxis.setEnabled(true);
lineChart.setData(data);
}else {
xAxis.setEnabled(true);
xAxis.setAxisMinimum(320);
xAxis.setAxisMaximum(780);
lineChart.setData(data);
}
}
/**
* 绘制折线图 多条
*/
public void drawLineCharts(float[] xData,List<float[]> yData,List<String> names,List<Integer> colours){
ArrayList<Float> xValues = new ArrayList<>();
for (int i = 0; i < xData.length; i++) {
xValues.add(xData[i]);
}
List<List<Float>> yValues = new ArrayList<>();
for (int i = 0; i < yData.size(); i++){
List<Float> yValue = new ArrayList<>();
for (int j = 0; j < yData.get(i).length; j++){
yValue.add(yData.get(i)[j]);
}
yValues.add(yValue);
}
try {
showLineChart(xValues, yValues, names, colours);
}catch (Exception e){
Log.e("TAG","数组越界!");
}
}
public void showLineChart(List<Float> xAxisValues, List<List<Float>> yAxisValues, List<String> labels, List<Integer> colours) {
initLineCharts();
ArrayList<ILineDataSet> dataSets = new ArrayList<>();
for (int i = 0; i < yAxisValues.size(); i++) {
ArrayList<Entry> entries = new ArrayList<>();
for (int j = 0; j < yAxisValues.get(i).size(); j++) {
if (j >= xAxisValues.size()) {
j = xAxisValues.size() - 1;
}
entries.add(new Entry(xAxisValues.get(j), yAxisValues.get(i).get(j)));
}
LineDataSet lineDataSet = new LineDataSet(entries, labels.get(i));
initLineDataSet(lineDataSet, colours.get(i), false);
dataSets.add(lineDataSet);
}
LineData data = new LineData(dataSets);
lineChart.setData(data);
}
/**
* 设置Y轴值
*/
public void setYAxis(float max, float min, int labelCount) {
if (max < min) {
return;
}
//设置左边Y轴
leftAxis.setAxisMaximum(max);
leftAxis.setAxisMinimum(min);
leftAxis.setLabelCount(labelCount, false);
// rightAxis.setAxisMaximum(max);
// rightAxis.setAxisMinimum(min);
// rightAxis.setLabelCount(labelCount, false);
lineChart.invalidate();
}
/**
* 设置X轴的值
*/
public void setXAxis(float max, float min, int labelCount) {
xAxis.setAxisMaximum(max);
xAxis.setAxisMinimum(min);
xAxis.setLabelCount(labelCount, true);
lineChart.invalidate();
}
/**
* 设置高限制线
*/
public void setHightLimitLine(float high, String name, int color) {
if (name == null) {
name = "高限制线";
}
LimitLine hightLimit = new LimitLine(high, name);
hightLimit.setLineWidth(2f);
hightLimit.setTextSize(10f);
hightLimit.setLineColor(color);
hightLimit.setTextColor(color);
leftAxis.addLimitLine(hightLimit);
lineChart.invalidate();
}
/**
* 设置低限制线
*/
public void setLowLimitLine(int low, String name) {
if (name == null) {
name = "低限制线";
}
LimitLine hightLimit = new LimitLine(low, name);
hightLimit.setLineWidth(4f);
hightLimit.setTextSize(10f);
leftAxis.addLimitLine(hightLimit);
lineChart.invalidate();
}
/**
* 设置折线图标识
*/
public void setDescription(String str) {
Description description = new Description();
description.setText(str);
lineChart.setDescription(description);
lineChart.invalidate();
}
}
上述是我项目中所使用的一个类,其中对于单一折线和多条折线都给出了较为详细的设置,而关于如何动态添加折线图(这里的 动态添加为在已有的折线图基础上,根据实际情况再添加几条折线图),按照以下的方式添加调用即可:
LineChartManager lineChartManager = new LineChartManager(linechart);
List<float[]> lineData = new ArrayList<>();
List<Integer> colors = new ArrayList<>();
List<String> lables = new ArrayList<>();
//先添加两条折线
lineData.add(data1);
lineData.add(data2);
colors.add(Color.RED);
colors.add(Color.BLUE);
lables.add("xxx");
lables.add("yyy");
lineChartManager.drawLineCharts(x_Data,lineData,lables,colors);
lineChartManager.setDescription("XY");
//更新UI,添加新的折线
lineData.add(new_data);
lineChartManager.drawLineCharts(x_Data,lineData,lables,colors);
lineChartManager.setDescription("XY");
当然,在上述添加新的折线的过程中,对于lineData中的更新的数据,需要判断该数据的位置,因为在测试过程中,会出现某些数据错误的情况,新的MPAndroidChart总体使用起来要比旧版的更加人性化,由于本人水平有限,所以还在学习中,以上若有不当,请尽情指出!