笔记七：使用MPandroidChart绘制双Y轴图表
序言
由于项目需要利用android实现图表的可视化，通过了解学习，决定用MPandroidChart来实现，MPandChart是android里含有的一个多功能绘图工具，可以绘制线状图、点状图、饼状图、k线图等，而且还可以绘制组合图形。此次就以LineChart为例，简单介绍MPandroidCha的使用流程。
1、添加依赖
打开androidstudio后，在项目一栏中点击app包，再打开build.gradle，在依赖（dependencies）下添加以下代码
implementation 'com.github.PhilJay:MPAndroidChart:v3.0.3'
2、设定布局，并在Activity中拿到这个布局
新建名为Char的Activity，在其布局文件中添加以下代码：
mLineChart=findViewById(R.id.chart);
3、编写绘图函数
public void showChart(Context context, final MyLineChart mLineChart, List xDataList,
List yDataList,List yDataList1){
mLineChart.setDrawBorders(true);
//设置标题
mLineChart.getDescription().setText(title);
//设置标题字体大小
mLineChart.getDescription().setTextSize(16f);
// 标题字体颜色
mLineChart.getDescription().setTextColor(context.getApplicationContext().getResources()
.getColor(R.color.txt_black_light));
//显示圆圈
dataSet.setDrawCircles(true);//散点以圆圈形式显示
dataSet.setColor(Color.parseColor("#7d7d7d"));//线条颜色
dataSet.setCircleColor(Color.parseColor("#7d7d7d"));//圆点颜色
dataSet.setLineWidth(1f);//线条宽度
mLineChart.setScaleEnabled(false);
//mLineChart.getLineData().getDataSets().get(0).setVisible(true);
//设置右边y轴
YAxis rightAxis = mLineChart.getAxisRight();
rightAxis.setTextColor(Color.RED);//设置颜色
rightAxis.setAxisMaximum(10);//设置最大值
rightAxis.setAxisMinimum(-20);//设置最小值
rightAxis.setDrawGridLines(true);//是否绘制网格
rightAxis.setDrawZeroLine(true);//是否绘制0刻度线
rightAxis.setGranularityEnabled(true);//等间距
//设置左边y轴
YAxis leftAxis = mLineChart.getAxisLeft();
leftAxis.setTextColor(ColorTemplate.getHoloBlue());
leftAxis.setDrawGridLines(true);
leftAxis.setGranularityEnabled(true);
leftAxis.setEnabled(true);
leftAxis.setAxisMaximum(10);
leftAxis.setAxisMinimum(-20);
//设置x轴
XAxis xAxis = mLineChart.getXAxis();
xAxis.setSpaceMax(50);
xAxis.setTextColor(Color.parseColor("#333333"));
xAxis.setTextSize(11f);
xAxis.setAxisMinimum(0f);
xAxis.setLabelRotationAngle(-60);//x轴标签倾斜
xAxis.setDrawAxisLine(true);//是否绘制轴线
xAxis.setDrawGridLines(false);//设置x轴上每个点对应的线
xAxis.setDrawLabels(true);//绘制标签 指x轴上的对应数值
xAxis.setPosition(XAxis.XAxisPosition.BOTTOM);//设置x轴的显示位置
xAxis.setGranularity(1f);//间隔为1
//透明化图例
Legend legend = mLineChart.getLegend();
legend.setForm(Legend.LegendForm.CIRCLE);
legend.setFormSize(8f);
legend.setTextColor(context.getApplicationContext().getResources().getColor(R.color.bg_blue));
legend.setTextSize(12f);
legend.setVerticalAlignment(Legend.LegendVerticalAlignment.BOTTOM);
legend.setHorizontalAlignment(Legend.LegendHorizontalAlignment.LEFT);
legend.setOrientation(Legend.LegendOrientation.HORIZONTAL);
legend.setDrawInside(false);
// 图例字体
// mLegend.setTypeface(mTf);
// 图例的显示和隐藏
legend.setEnabled(true);
//屏幕左右平移
float scaleX = mLineChart.getScaleX();
if (scaleX == 1)
mLineChart.zoomToCenter(5, 1f);
else {
BarLineChartTouchListener barLineChartTouchListener = (BarLineChartTouchListener) mLineChart.getOnTouchListener();
barLineChartTouchListener.stopDeceleration();
mLineChart.fitScreen();
}
//动画添加
mLineChart.animateX(2500);//图像缓冲时间
// 设置是否启动触摸响应
mLineChart.setTouchEnabled(true);
// 是否可以拖拽
mLineChart.setDragEnabled(true);
// 是否可以缩放
mLineChart.setScaleEnabled(true);
mLineChart.invalidate();
//隐藏x轴描述
Description description = new Description();
description.setEnabled(false);
mLineChart.setDescription(description);
//3.chart设置数据
LineDataSet set1, set2;//数据类型
if (mLineChart.getData() != null &&
mLineChart.getData().getDataSetCount() > 0) {
set1 = (LineDataSet) mLineChart.getData().getDataSetByIndex(0);
set2 = (LineDataSet) mLineChart.getData().getDataSetByIndex(1);
set1.setValues(yDataList);//坐标轴赋值
set2.setValues(yDataList1);
mLineChart.getData().notifyDataChanged();
mLineChart.notifyDataSetChanged();
} else {
// 创建一个数据集,并给它一个类型
set1 = new LineDataSet(yDataList, "原始数据");
set1.setAxisDependency(YAxis.AxisDependency.LEFT);
//set1.isDrawValuesEnabled();
set1.setDrawValues(false);//是否显示数据
set1.setColor(Color.BLACK);//曲线颜色
set1.setCircleColor(Color.WHITE);
set1.setLineWidth(2f);//线宽
set1.setCircleRadius(1f);
// set1.setFillAlpha(65);
//set1.setFillColor(ColorTemplate.getHoloBlue());
set1.setHighLightColor(Color.rgb(244, 117, 117));
set1.setDrawCircleHole(true);
//创建一个数据集,并给它一个类型
set2 = new LineDataSet(yDataList1, "拟合数据");
//set2.isDrawValuesEnabled();
set2.setDrawValues(false);
set2.setAxisDependency(YAxis.AxisDependency.RIGHT);
set2.setColor(Color.RED);
set2.setCircleColor(Color.BLACK);
set2.setLineWidth(2f);
set2.setCircleRadius(1f);
//set2.setFillAlpha(65);
//set2.setFillColor(Color.RED);
set2.setDrawCircleHole(true);
set2.setHighLightColor(Color.rgb(244, 117, 117));
// 创建一个数据集的数据对象
LineData data = new LineData(set1, set2);
data.setValueTextColor(Color.WHITE);
data.setValueTextSize(9f);
//设置数据
mLineChart.setData(data);
}
//是否绘制线条上的文字
mLineChart.invalidate(); // refresh
}
4、函数调用
XAxis xAxis = mLineChart.getXAxis();//拿到X轴
for (int i = 0; i < 1000; i++) {
xDataList.add(String.valueOf(i + 1).concat("天"));
}
xAxis.setValueFormatter(new IndexAxisValueFormatter(xDataList));//X轴赋值
for (int i = 0; i < 1000; i++)
yDataList.add(new Entry(i, new Random().nextFloat()*10*(float) Math.pow(-1,i)));//左侧Y轴赋值
for (int i = 0; i < 1000; i++)
yDataList1.add(new Entry(i, new Random().nextFloat()*10));//右侧Y轴赋值
showChart(this,mLineChart,xDataList,yDataList,yDataList1);//调用函数绘图
5、实现结果
总结
以上内容就是MPandroidChart的简单使用，MPandroidChart使用比较灵活，可以多尝试不同的实现效果，若想实现多轴（三个及三个以上）显示，只需改一下绘图函数，多设置几个LineDataSet即可。在敲代码过程中还是发现了很多问题，在解决双轴问题时，出现了左右两个Y轴刻度比例不一致的问题，也就是说左侧的1对应右侧的1.2类似这样的问题。针对这个问题，我也尝试了很多方法，大多说是和数据本身有关，但由于数据格式固定，又要解决以上这个问题，我就让其在同一侧显示，即把上面的右侧Y轴改成左侧显示，并不影响数据而且能够达到目的。但针对双轴显示刻度比例尺不一致的这个问题，我仍没有很好的解决方法。