最近在项目开发过程中,增加了一个根据不同类别展示多条曲线的需求,于是就找到了强大无比的MPAndroidChart库,再此记录一下如何使用MPAndroidChart 中的LineChart。
关于导入MPAndroidChart库,这里就不多做介绍,直接发LineChart 配置的代码出来。
先初始化一个LineChart
private void initLineChart(){
if(mLineChart!=null){
mLineChart.setNoDataTextDescription("暂无数据");
mLineChart.getLegend().setForm(Legend.LegendForm.LINE);//这是左边显示小图标的形状
mLineChart.getLegend().setFormSize(0.00f);
mLineChart.setDrawGridBackground(false);
mLineChart.getXAxis().setPosition(XAxis.XAxisPosition.BOTTOM);//设置X轴的位置
mLineChart.getXAxis().setDrawGridLines(false);//不显示网格
mLineChart.setDoubleTapToZoomEnabled(false);//双击缩放
mLineChart.getLegend().setTextSize(15f);
mLineChart.getAxisRight().setEnabled(false);//右侧不显示Y轴
mLineChart.getAxisLeft().setAxisMinValue(0.0f);//设置Y轴显示最小值,不然0下面会有空隙
mLineChart.getAxisLeft().setDrawGridLines(true);//不设置Y轴网格
mLineChart.getAxisRight().setDrawGridLines(true);
mLineChart.getLegend().setStackSpace(10);
mLineChart.setVisibleXRangeMaximum(6);
mLineChart.setScaleXEnabled(true);
mLineChart.setScaleXEnabled(false);
mLineChart.setBackgroundColor(Color.WHITE);
mLineChart.setDescription(null);
mLineChart.animateXY(1000, 2000);//设置动画
mLineChart.setOnChartValueSelectedListener(new OnChartValueSelectedListener() {
@Override
public void onValueSelected(Entry entry, int i, Highlight highlight) {
}
@Override
public void onNothingSelected() {
}
});
}
}
接下来就是如何配置单条曲线与多条曲线。
private void initLineDataSet(ListstrX, List home,List share,
List user, List found, List myde){
LineData data=new LineData(strX,setLine(strX,home,1,null)); //创建LineData实体类并添加第一条曲线
data.addDataSet(setLine(strX,share,2,null)); //添加第2条曲线
data.addDataSet(setLine(strX,user,3,null)); //添加第3条曲线
data.addDataSet(setLine(strX,found,4,null)); //添加第4条曲线
data.addDataSet(setLine(strX,myde,5,null)); //添加第5条曲线
mLineChart.setData(data);
mLineChart.invalidate();
}
private void initLineDataSet(ListstrX, List home){
LineData data=new LineData(strX,setLine(strX,home,1,null)); //创建LineData实体类并添加第一条曲线
mLineChart.setData(data);
mLineChart.invalidate();
}
//画线
private LineDataSet setLine(List addr, List value, int flag, String name) {
ArrayList xValsAge = new ArrayList();
for (int i = 0; i < addr.size(); i++) {
xValsAge.add(addr.get(i));
}
ArrayList yValsTall = new ArrayList();
for (int i = 0; i < value.size(); i++) {
yValsTall.add(new Entry(Float.parseFloat(value.get(i)), i));
}
LineDataSet setData = new LineDataSet(yValsTall,name);
setData.setLabel(null);
setData.setDrawCubic(true); //设置曲线为圆滑的线
setData.setCubicIntensity(0.2f);
setData.setDrawFilled(false); //设置包括的范围区域填充颜色
setData.setDrawCircles(true); //设置有圆点
setData.setLineWidth(2f); //设置线的宽度
setData.setCircleSize(5f); //设置小圆的大小
setData.setDrawValues(false);// 是否显示值
setData.setAxisDependency(YAxis.AxisDependency.LEFT);
setData.setHighLightColor(Color.rgb(244, 117, 117));
//设置曲线颜色
if(flag==1){
setData.setColor(Color.parseColor("#007eff")); //首页
setData.setCircleColor(Color.parseColor("#007eff"));
}
else if(flag==2){
setData.setColor(Color.parseColor("#6500ff")); //分享
setData.setCircleColor(Color.parseColor("#6500ff"));
}
else if(flag==3){
setData.setColor(Color.parseColor("#2bf16c")); //会员
setData.setCircleColor(Color.parseColor("#2bf16c"));
}
else if(flag==4){
setData.setColor(Color.parseColor("#f83333")); //发现
setData.setCircleColor(Color.parseColor("#f83333"));
}
else if(flag==5){
setData.setColor(Color.parseColor("#fa8a25")); //我的
setData.setCircleColor(Color.parseColor("#fa8a25"));
}
// mLineChart.moveViewToX(setData.getEntryCount() - 5);
return setData; //返回曲线
}
接下来到了在activity 调用。
/**
* 多条曲线
* @param strX
* @param home
* @param share
* @param user
* @param found
* @param myde
*/
public void updateActivity(ListstrX, List home,List share,
List user, List found, List myde){
initLineDataSet(strX,home,share,user,found,myde);
initLineChart();
}
/***
* 单条曲线
* @param strX
* @param home
*/
public void updateActivity(ListstrX, List home){
initLineDataSet(strX,home);
initLineChart();
}
最终完成的效果.