Android 图表开源框架之MPAndroidChart LineChart之常用自定义设置功能

最新推荐文章于 2024-08-28 08:00:19 发布

冰糖葫芦三剑客

最新推荐文章于 2024-08-28 08:00:19 发布

阅读量3k

点赞数 2

分类专栏：第三方网络

本文链接：https://blog.csdn.net/shenggaofei/article/details/106198353

版权

第三方网络专栏收录该内容

12 篇文章 0 订阅

订阅专栏

参考项目地址：https://github.com/PhilJay/MPAndroidChart

一.常用属性：

https://recomm.cnblogs.com/blogpost/8492893

Line-, Bar-, Scatter-, Bubble- 、CandleDataSet
setHighLightColor(int color) 设置高亮颜色

Line-, Bar-, Scatter-, Candle- / RadarDataSet
setDrawHighlightIndicators(boolean enabled) 设置是否绘制高亮指示线
setHighlightLineWidth(float width) 设置高亮指示线宽度

Line- 、 RadarDataSet
setFillColor(int color)   设置填充颜色
setFillAlpha(int alpha)   设置填充颜色的透明度
setFillDrawable(Drawable d)   选择一个Drawable文件去填充
setDrawFilled(boolean filled)   开启之后将会完全填充绘制,而不是仅仅只有一条线，开启将影响性能,API小于18无法使用
setLineWidth(float width)   设置数据线宽度

LineDataSet
setCircleRadius(float size)   设置圆形指示器的大小（半径）,默认值4f
setDrawCircles(boolean enabled)   设置是否绘制圆形指示器,默认true
setDrawCubic(boolean enabled)   开启之后数据线将显示成立体模式,对性能有影响默认false
setCubicIntensity(float intensity)   设置立体强度最大值为1f, 最小0.05f,默认0.2f
setCircleColor(int color)   设置圆形指示器的颜色
setCircleColors(List colors)   设置圆形指示器颜色（传入list）
setCircleColorHole(int color)   设置圆形指示器内部圆的颜色
setDrawCircleHole(boolean enabled)   设置是否绘制圆形指示器内部圆
enableDashedLine(float lineLength, float spaceLength, float phase)   设置使用虚线数据线

BarDataSet
setBarSpacePercent(float percent)   设置条形图间距
setBarShadowColor(int color)   设置条形图背景阴影颜色
setHighLightAlpha(int alpha)   设置条形图背景高亮指示器的透明度,最小0(完全透明),最大255(不透明).
setStackLabels(String[] labels)   给层叠条形图设置多个标签值

ScatterDataSet
setScatterShapeSize(float size) 设置形状大小
setScatterShape(ScatterShape shape) 设置形状样式

CandleDataSet
setBodySpace(float space)   设置左右两个蜡烛图的间距,默认0.1f(10%),最大0.45f,最小0f
setShadowWidth(float width)   设置蜡烛阴影线的宽度,默认3f.
setShadowColor(int color)   设置阴影颜色
setDecreasingColor(int color)   当开盘比收盘数据大时,使用该颜色显示.
setIncreasingColor(int color)   当开盘比收盘数据小时,使用该颜色显示.
setDecreasingPaintStyle(Paint.Style style)   当开盘比收盘数据大时,使用该样式绘制(填充或者描边).
setIncreasingPaintStyle(Paint.Style style)   当开盘比收盘数据小时,使用该样式绘制(填充或者描边).

BubbleDataSet
etHighlightCircleWidth(float width) 设置高亮圈的宽度

PieDataSet
setSliceSpace(float degrees) 设置分开的饼图两片间的间距,默认:0没有间距,最大20,最小0
setSelectionShift(float shift) 设置选中的扇形离开中心点的距离,默认12f

二.LineChart之设置不同圆点的颜色：

1.设置折线图的连接线和圆点的颜色:

首先自定义MyDataSet：

import java.util.List;

import com.github.mikephil.charting.data.Entry;
import com.github.mikephil.charting.data.LineDataSet;

/**
 * 根据数值显示圆圈节点的颜色
 * 
 */
public class MyDataSet extends LineDataSet {
	private int start; // 最小值
	private int end; // 最大值
	List<Entry> list;

	public MyDataSet(List<Entry> yVals, String label) {//, int start, int end
		super(yVals, label);
		this.start = start;
		this.end = end;
		list = yVals;
	}

	@Override
	public int getCircleColor(int index) {
		// 如果超出范围则返回红色
//        if (getEntryForXIndex(index).getVal()<start||getEntryForXIndex(index).getVal()>end){
//            return 0xFFff0000;
//        }else return super.getCircleColor(index);
		if (index < (list.size() - 1)) {
			if ((list.get(index + 1).getVal()) < 10) {//50
				return mColors.get(0);
			} else if (list.get(index + 1).getVal() < 20) {//70
				return mColors.get(1);
			} else {
				return mColors.get(2);
			}
		} else {
			return mColors.get(0);
		}
	}
}

2.然后在主函数中设置颜色：

private void setTest() {

        //2.创建一个List集合，用来存放一条折线上的所有点
        List<Entry> entries = new ArrayList<Entry>();

        entries.add(new Entry(10,20));
        entries.add(new Entry(20,30));
        entries.add(new Entry(30,15));
        entries.add(new Entry(40,50));

        //3.将entries设置给LineDataSet数据集
        LineDataSet dataSet = new LineDataSet(entries, "Label");
        dataSet.setColor(Color.parseColor("#F15A4A"));//线的颜色
        //4.将上面创建的LineDataSet对象设置给LineData
//        LineData lineData = new LineData(dataSet);
        LineDataSet lineDatas = new LineDataSet(entries, "Label");

        //5.把lineData设置给lineChart就可以显示出来折线图了，就像把adapter设置给listview一样
//        lineChart.setData(lineData);
        
      //3.chart设置数据
//        LineData lineData = new LineData(lineDatas);
//        lineChart.setData(lineData);
//        lineChart.invalidate(); // refresh
        
        List<Integer> datas = new ArrayList<>();
        datas.add(1);
        datas.add(3);
        datas.add(5);
        datas.add(-7);
        datas.add(13);
        datas.add(21);
        datas.add(2);
        datas.add(12);
        datas.add(5);
        double maxValue = Collections.max(datas);
		double minValue = Collections.min(datas);
		maxValue += 10;
		minValue -= 7;
        lineChart.setNoDataText("");//无数据
       
		lineChart.setScaleEnabled(false);// 是否可以缩放 x和y轴, 默认是true
		lineChart.setDoubleTapToZoomEnabled(true);// 设置是否可以通过双击屏幕放大图表。默认是true

		lineChart.setHighlightPerDragEnabled(false);// 设置是否显示高亮十字线
		lineChart.setTouchEnabled(true); // 设置是否可以触摸
		lineChart.setDragEnabled(true);// 设置是否可以拖拽
		lineChart.setDrawGridBackground(false); // 是否显示表格
//		lineChart.setDescription("dOD/Time:" + "我是结果");// 描述性文字
		lineChart.setDescriptionTextSize(25);

		XAxis xAxis = lineChart.getXAxis();
		xAxis.setPosition(XAxisPosition.BOTTOM);
		xAxis.setDrawGridLines(false);//设置x轴上每个点对应的线
		xAxis.setDrawAxisLine(true);//是否绘制轴线
		xAxis.setGridLineWidth(1f);
		xAxis.setTextSize(16);
		//添加x轴数据
		final ArrayList<String> arrayList = new ArrayList<>();
		arrayList.clear();
		arrayList.add("Q1");
		arrayList.add("Q2");
		arrayList.add("Q3");
		arrayList.add("Q4");
		arrayList.add("Q5");
		arrayList.add("Q6");
		arrayList.add("Q7");
		arrayList.add("Q8");
		arrayList.add("Q9");
		xAxis.setValueFormatter(new XAxisValueFormatter() {
			
			@Override
			public String getXValue(String original, int index, ViewPortHandler viewPortHandler) {
				// TODO Auto-generated method stub
				return arrayList.get((int) index % arrayList.size());
			}
		});
		

//		lineChart.getAxisRight().setEnabled(false);

		lineChart.getAxisLeft().setStartAtZero(false);
		 //设置Y左边轴显示的值 label 数量
		lineChart.getAxisLeft().setLabelCount(5, false);
		lineChart.getAxisRight().setStartAtZero(false);
//		lineChart.getAxisLeft().setAxisMinValue((float) minValue);
		lineChart.getAxisLeft().setAxisMinValue((float) -10);
		lineChart.getAxisRight().setAxisMinValue((float) -10);
//		lineChart.getAxisLeft().setAxisMaxValue((float) maxValue);
		lineChart.getAxisLeft().setAxisMaxValue((float) 30);
		lineChart.getAxisRight().setAxisMaxValue((float) 30);
//		lineChart.getAxisLeft().setDrawGridLines(false);
//		lineChart.getAxisRight().setDrawGridLines(false);
		lineChart.getAxisLeft().setTextSize(16);
		lineChart.getAxisRight().setTextSize(16);

		 //设置限制临界线
        LimitLine limitLine = new LimitLine(3f, "");//临界点
        limitLine.setLineColor(Color.RED);
        limitLine.setLineWidth(1.5f);
        limitLine.setTextColor(Color.RED);
//        LimitLine avgLine = new LimitLine((float) navg);
//        avgLine.enableDashedLine(5.0f, 3.0f, 3.0f);
//        avgLine.setLineColor(Color.parseColor("#33CC33"));
        lineChart.getAxisLeft().addLimitLine(limitLine);
		
		Legend legend = lineChart.getLegend();
		legend.setPosition(LegendPosition.RIGHT_OF_CHART_INSIDE);
		legend.setTextSize(30);

		// x轴的数据
		ArrayList<String> xValues = new ArrayList<String>();
		// y轴的数据
		ArrayList<Entry> yValues = new ArrayList<Entry>();

		for (int i = 0; i < datas.size(); i++) {
			xValues.add((i + 1) + "");
			float value = (int) (datas.get(i));
			yValues.add(new Entry(value, i));
		}

		// y轴的数据集合
//		LineDataSet lineDataSet = new LineDataSet(yValues, spQcProjectNameA.getSelectedItem().toString());
		MyDataSet lineDataSet = new MyDataSet(yValues, spQcProjectNameA.getSelectedItem().toString());
		lineDataSet.setValueTextSize(12f);
		 //折线图不显示数值
//		lineDataSet.setDrawValues(false);
		// 用y轴的集合来设置参数
		lineDataSet.setColor(Color.rgb(68, 114, 196));
		lineDataSet.setLineWidth(2f); // 线宽
		lineDataSet.setDrawCircles(true);// 是否有圆点
//		lineDataSet.setDrawCircleHole(true);// 设置数据点是空心还是实心，默认空心
		lineDataSet.setCircleColor(Color.RED);// 圆形的颜色
		lineDataSet.setColors(new int[]{Color.YELLOW,Color.GREEN,Color.BLUE,Color.BLACK});
//		lineDataSet.setCircleSize(5.5f);//折线的圆点大小
//		lineDataSet.setHighLightColor(Color.rgb(244, 117, 117));// 高亮的线的颜色 
		lineDataSet.setDrawValues(false);
		lineDataSet.setDrawCubic(false);// 设置是否为圆滑的线
		ArrayList<LineDataSet> lineDataSets = new ArrayList<LineDataSet>();
		lineDataSets.add(lineDataSet); // add the datasets

		LineData lineData = new LineData(xValues, lineDataSets);
		 //创建覆盖物
        createMakerView();
      //折线图点的标记
        MyMarkerView mv = new MyMarkerView(getActivity());
        lineChart.setMarkerView(mv);
		lineChart.setData(lineData); // 设置数据
		lineChart.animateX(2500); // 立即执行的动画,x轴

	
        //更新
//        mLineChart.invalidate();
	}

// y轴的数据集合
//		LineDataSet lineDataSet = new LineDataSet(yValues, spQcProjectNameA.getSelectedItem().toString());
		MyDataSet lineDataSet = new MyDataSet(yValues, spQcProjectNameA.getSelectedItem().toString());
...
		lineDataSet.setColors(new int[]{Color.YELLOW,Color.GREEN,Color.BLUE,Color.BLACK});

但是有一个问题，线的颜色感觉是乱的，本来只想设置折线图圆点的颜色的，但是上面的方法设置后，连接的线也变了多个颜色了，不知道有没有遇到或成功实现的

3.设置圆形指示器颜色：

// y轴的数据集合
		LineDataSet lineDataSet = new LineDataSet(yValues, "");
lineDataSet.setValueTextSize(12f);
		 //折线图不显示数值
//		lineDataSet.setDrawValues(false);
		// 用y轴的集合来设置参数
		lineDataSet.setColor(Color.rgb(68, 114, 196));
		lineDataSet.setLineWidth(2f); // 线宽
		lineDataSet.setDrawCircles(true);// 是否有圆点
//		lineDataSet.setDrawCircleHole(true);// 设置数据点是空心还是实心，默认空心
//		lineDataSet.setCircleColor(Color.RED);// 圆形的颜色
		List<Integer> lineColors = getLineColors(yValues, Color.RED, Color.YELLOW,
				Color.BLUE);
		lineDataSet.setCircleColors(lineColors);// 圆形的颜色

lineDataSet.setCircleColors(lineColors);// 圆形的颜色,添加需要设置的颜色的集合

//在方法中判断数值的大小和对应设置的颜色
private static List<Integer> getLineColors(List<Entry> yValues,
			int normalColor, int exceColor, int exceQcColor) {
		List<Integer> list = new ArrayList<>();
//		float maxSD = (float) (targetValue + sdValue * sdMultiple);
//		float minSD = (float) (targetValue - sdValue * sdMultiple);
		float maxSD = 3;
		float minSD = 0;
		for (int i = 0; i < yValues.size(); i++) {
			Entry entry = yValues.get(i);
//            if (errIndexs.contains(i)) {  //限值异常质控不用和sd比较确定显示什么颜色
//                list.add(exceQcColor);
//                continue;
//            }
//			if (entry.getVal() >= maxSD || entry.getVal() < minSD) {
				if (entry.getVal() >= 10) {
				list.add(exceColor);
			} else if(entry.getVal() < 0){
				list.add(normalColor);
			} else if(entry.getVal() < 10 && entry.getVal()>0){
				list.add(exceQcColor);
			} 
		}
		return list;
	}

三.LineChart之设置ValueFormatter（自定义Y单位符号、X轴数据自定义显示）：

1.创建一个类CustomYValueFormatter:

public class CustomYValueFormatter implements IAxisValueFormatter {

    /*private DecimalFormat mFormat;*/
    private boolean drawValue;

    public CustomYValueFormatter(boolean drawValue) {
       /* mFormat = new DecimalFormat("###,###,###,##0");*/
        this.drawValue = drawValue;
    }

    @Override
    public String getFormattedValue(float value, AxisBase axis) {
        /*if (value==0){
            return mFormat.format(value);
        }
        return *//*"￥" + *//*mFormat.format(value);*/

        if (drawValue){
            if (value>=100000){
                return (int)value/10000+"w -";
            }else if (value>=10000){
                return (int)value/10000+"."+(int) value/1000%10+"w -";
            }else {
                return (int)value+" -";
            }
        }else {
            return "-";
        }
    }
}

设置使用Y轴自定义ValueFormatter：

YAxis leftAxis = lineChart.getAxisLeft();
leftAxis.setValueFormatter(new CustomYValueFormatter(true));

2.创建一个数组添加进来，动态的添加Labels：

public class CustomXValueFormatter implements IAxisValueFormatter {

    private List<String> labels;

    /**
     * @param labels 要显示的标签字符数组
     */
    public CustomXValueFormatter(List<String> labels) {
        this.labels = labels;
    }

    @Override
    public String getFormattedValue(float value, AxisBase axis) {
        LoggerUtil.d("value:" + value + ";size:" + labels.size());
        return labels.get((int) value % labels.size());
    }
}

设置X轴的数据：

 lineChart.getXAxis().setValueFormatter(new CustomXValueFormatter(mXLabels));

参考：

https://blog.csdn.net/qq_39521922/article/details/80723536

https://blog.csdn.net/qq_44720366/article/details/104815574

https://blog.csdn.net/ww897532167/article/details/74139843/

https://www.jianshu.com/p/85b6a0b6b992

https://www.cnblogs.com/Sharley/p/8492893.html

https://www.cnblogs.com/r-decade/p/6241693.html

https://www.cnblogs.com/wangfeng520/p/5664528.html

https://blog.csdn.net/sinat_28238111/article/details/80112299