MPAndroidChart3.0使用详解（二）----柱状图、折线图、组合图的使用

ゝ一纸荒年。 2022-06-10 00:52 371阅读 0赞

上篇主要讲到了MPAndroidChart这个开源库的一些[基本特性和基础设置][Link 1]，现在来讲下我们经常要用到的柱状图（直方图）、折线图和组合图的使用。

#### **柱状图** ####

再讲之前，先看效果图。  
![这里写图片描述][SouthEast]  
第一个是单个柱状图，第二个是组合（group）的柱状图  
**使用**  
1、首先先创建BarChart对象，并初始化，进行些基础设置  
2、为BarChart添加对象，利用BarEntry添加x轴，y轴的数据  
3、初始化BarDataSet对象，为BarDataSet添加BarEntry对象  
4、初始化BarData对象，为BarData添加BarDataSet  
5、为BarChart添加BarData，即BarChart.setData(barData)  
这样就完成了柱状图的绘制。  
一些BarChart属性的设置

setDrawValueAboveBar(boolean enabled):// 如果设置为true,在条形图上方显示值。如果为false，会显示在顶部下方。
    setDrawBarShadow(boolean enabled):// 是否显示阴影。启动它会降低约40%的性能
    setDrawValuesForWholeStack(boolean enabled):// 如果设置为true，堆叠条形的所有值会分别绘制，而不仅仅是他们所有的顶部总和。
    setDrawHighlightArrow(boolean enabled):// 是否强调绘制箭头

这里已经封装好了一个BarChartManager,使用的时候只用添加数据即可。代码如下：

import android.graphics.Color;
    
    import com.github.mikephil.charting.animation.Easing;
    import com.github.mikephil.charting.charts.BarChart;
    import com.github.mikephil.charting.components.Description;
    import com.github.mikephil.charting.components.Legend;
    import com.github.mikephil.charting.components.LimitLine;
    import com.github.mikephil.charting.components.XAxis;
    import com.github.mikephil.charting.components.YAxis;
    import com.github.mikephil.charting.data.BarData;
    import com.github.mikephil.charting.data.BarDataSet;
    import com.github.mikephil.charting.data.BarEntry;
    import com.github.mikephil.charting.interfaces.datasets.IBarDataSet;
    
    import java.util.ArrayList;
    import java.util.List;
    
    /**
     * Descriptions:柱状图管理类
     */
    
    public class BarChartManager {
        
        private BarChart mBarChart;
        private YAxis leftAxis;
        private YAxis rightAxis;
        private XAxis xAxis;
        //颜色集合
        List<Integer> colors = new ArrayList<>();
    
        public BarChartManager(BarChart barChart) {
            this.mBarChart = barChart;
            leftAxis = mBarChart.getAxisLeft();
            rightAxis = mBarChart.getAxisRight();
            xAxis = mBarChart.getXAxis();
            colors.add(Color.GREEN);
            colors.add(Color.BLUE);
            colors.add(Color.RED);
            colors.add(Color.CYAN);
            initBarChart();
        }
    
        /**
         * 初始化LineChart
         */
        private void initBarChart() {
            //背景颜色
            mBarChart.setBackgroundColor(Color.WHITE);
            //网格
            mBarChart.setDrawGridBackground(false);
            //背景阴影
            mBarChart.setDrawBarShadow(false);
            mBarChart.setHighlightFullBarEnabled(false);
    
            //显示边界
            mBarChart.setDrawBorders(false);
            //设置动画效果
            mBarChart.animateY(1000, Easing.EasingOption.Linear);
            mBarChart.animateX(1000, Easing.EasingOption.Linear);
            //图表的描述
            mBarChart.getDescription().setText("");
    
            //折线图例 标签 设置
            Legend legend = mBarChart.getLegend();
            legend.setForm(Legend.LegendForm.SQUARE);//图示 标签的形状。   正方形
            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.setGranularity(1f);//设置最小的区间，避免标签的迅速增多
            xAxis.setDrawGridLines(false);//设置竖状的线是否显示
            xAxis.setCenterAxisLabels(true);//设置标签居中
           // xAxis.setSpaceMax(10);
           // xAxis.setValueFormatter();
    
            leftAxis.setDrawGridLines(true);//设置横状的线是否显示
            leftAxis.enableGridDashedLine(6f, 3f, 0);//虚线
    
            leftAxis.setAxisLineWidth(1f);
            leftAxis.setEnabled(true);
            leftAxis.setGridColor(0xacb3e5fc);
         //   leftAxis.setTextColor(0xb3e5fc);//设置左边Y轴文字的颜色
         //   leftAxis.setAxisLineColor(0xb3e5fc);//设置左边Y轴的颜色
    
           // rightAxis.setDrawGridLines(false);//设置横状的线是否显示
            rightAxis.setEnabled(false);//隐藏右边轴和数字
    
            //保证Y轴从0开始，不然会上移一点
            leftAxis.setAxisMinimum(0f);
            rightAxis.setAxisMinimum(0f);
            mBarChart.setDoubleTapToZoomEnabled(false); // 设置为false以禁止通过在其上双击缩放图表。
           // mBarChart.setBorderWidth(15);//设置边界宽度
        }
    
        /**
         * 展示柱状图(一条)
         *
         * @param xAxisValues
         * @param yAxisValues
         * @param label
         * @param color
         */
        public void showBarChart(List<Float> xAxisValues, List<Float> yAxisValues, String label, int color) {
            ArrayList<BarEntry> entries = new ArrayList<>();
            for (int i = 0; i < xAxisValues.size(); i++) {
                entries.add(new BarEntry(xAxisValues.get(i), yAxisValues.get(i)));
            }
            // 每一个BarDataSet代表一类柱状图
            BarDataSet barDataSet = new BarDataSet(entries, label);
    
            barDataSet.setColor(color);
            barDataSet.setValueTextSize(9f);
            barDataSet.setFormLineWidth(1f);
            barDataSet.setFormSize(15.f);
    
            ArrayList<IBarDataSet> dataSets = new ArrayList<>();
            dataSets.add(barDataSet);
            BarData data = new BarData(dataSets);
            //设置X轴的刻度数
            xAxis.setLabelCount(xAxisValues.size()-1 , false);
    
            mBarChart.setData(data);
        }
    
        /**
         * 展示柱状图(多条)
         *
         * @param xAxisValues
         * @param yAxisValues
         * @param labels
         * @param colours
         */
        public void showBarChart(List<Float> xAxisValues, List<List<Float>> yAxisValues, List<String> labels, List<Integer> colours) {
            BarData data = new BarData();
           // xAxis.setValueFormatter(new StringAxisValueFormatter(xAxisValues));
            for (int i = 0; i < yAxisValues.size(); i++) {
                ArrayList<BarEntry> entries = new ArrayList<>();
                for (int j = 0; j < yAxisValues.get(i).size(); j++) {
    
                    entries.add(new BarEntry(xAxisValues.get(i), yAxisValues.get(i).get(j)));
                }
                BarDataSet barDataSet = new BarDataSet(entries, labels.get(i));
    
                barDataSet.setColor(colours.get(i));
                barDataSet.setValueTextColor(colours.get(i));
                barDataSet.setValueTextSize(10f);
                barDataSet.setAxisDependency(YAxis.AxisDependency.RIGHT);
                data.addDataSet(barDataSet);
            }
            int amount = yAxisValues.size();
    
            float groupSpace = 0.12f; //柱状图组之间的间距
            float barSpace = (float) ((1 - 0.12) / amount / 10); // x4 DataSet
            float barWidth = (float) ((1 - 0.12) / amount / 10 * 9); // x4 DataSet
    
            // (0.2 + 0.02) * 4 + 0.12 = 1.00 -> 组成1个"group"的宽度
            xAxis.setLabelCount(xAxisValues.size() - 1, false);
            data.setBarWidth(barWidth);
    
    
            data.groupBars(0, groupSpace, barSpace);
            mBarChart.setData(data);
        }
    
        protected void showBarChart(List<String> xValues, List<List<Float>> yValuesList,List<String> labels){
    
            mBarChart.getXAxis().setValueFormatter(new StringAxisValueFormatter(xValues));
            BarData data = new BarData();
            for (int i = 0; i < yValuesList.size(); i++) {
                ArrayList<BarEntry> entries = new ArrayList<>();
                for (int j = 0; j < yValuesList.get(i).size(); j++) {
                    entries.add(new BarEntry(i, yValuesList.get(i).get(j)));
                }
                // y轴的数据集合
                BarDataSet barDataSet = new BarDataSet(entries, labels.get(i));
                barDataSet.setColor(colors.get(i));
                barDataSet.setValueTextColor(colors.get(i));
                barDataSet.setValueTextSize(10f);
                data.addDataSet(barDataSet);
            }
            int amount = yValuesList.size();
    
            float groupSpace = 0.12f; //柱状图组之间的间距
            float barSpace = (float) ((1 - 0.12) / amount / 10); // x4 DataSet
            float barWidth = (float) ((1 - 0.12) / amount / 10 * 9); // x4 DataSet
    
            // (0.2 + 0.02) * 4 + 0.12 = 1.00 -> interval per "group"
            mBarChart.getXAxis().setLabelCount(xValues.size()-1, false);
            data.setBarWidth(barWidth);
            xAxis.setAxisMaximum(xValues.size());
            xAxis.setAxisMinimum(0);
            data.groupBars(0, groupSpace, barSpace);
            mBarChart.setData(data);
        }
        protected BarData getBarData(List<String> xValues, List<List<Float>> yValuesList) {
            mBarChart.getXAxis().setValueFormatter(new StringAxisValueFormatter(xValues));
            BarData data = new BarData();
            for (int i = 0; i < yValuesList.size(); i++) {
                ArrayList<BarEntry> entries = new ArrayList<>();
                for (int j = 0; j < yValuesList.get(i).size(); j++) {
                    entries.add(new BarEntry(i, yValuesList.get(i).get(j)));
                }
                // y轴的数据集合
                BarDataSet barDataSet = new BarDataSet(entries, xValues.get(i));
                barDataSet.setColor(colors.get(i));
                barDataSet.setValueTextColor(colors.get(i));
                barDataSet.setValueTextSize(10f);
                data.addDataSet(barDataSet);
            }
            int amount = yValuesList.size();
    
            float groupSpace = 0.12f; //柱状图组之间的间距
            float barSpace = (float) ((1 - 0.12) / amount / 10); // x4 DataSet
            float barWidth = (float) ((1 - 0.12) / amount / 10 * 9); // x4 DataSet
    
            // (0.2 + 0.02) * 4 + 0.08 = 1.00 -> interval per "group"
            mBarChart.getXAxis().setLabelCount(xValues.size()-1, false);
            data.setBarWidth(barWidth);
    
            data.groupBars(0, groupSpace, barSpace);
            return data;
        }
        /**
         * 设置Y轴值
         *
         * @param max
         * @param min
         * @param labelCount
         */
        public void setYAxis(float max, float min, int labelCount) {
            if (max < min) {
                return;
            }
            leftAxis.setAxisMaximum(max);
            leftAxis.setAxisMinimum(min);
            leftAxis.setLabelCount(labelCount, false);
    
            rightAxis.setAxisMaximum(max);
            rightAxis.setAxisMinimum(min);
            rightAxis.setLabelCount(labelCount, false);
            mBarChart.invalidate();
        }
    
        /**
         * 设置X轴的值
         *
         * @param max
         * @param min
         * @param labelCount
         */
        public void setXAxis(float max, float min, int labelCount) {
            xAxis.setAxisMaximum(max);
            xAxis.setAxisMinimum(min);
            xAxis.setLabelCount(labelCount, false);
    
            mBarChart.invalidate();
        }
    
        /**
         * 设置高限制线
         *
         * @param high
         * @param name
         */
        public void setHightLimitLine(float high, String name, int color) {
            if (name == null) {
                name = "高限制线";
            }
            LimitLine hightLimit = new LimitLine(high, name);
            hightLimit.setLineWidth(4f);
            hightLimit.setTextSize(10f);
            hightLimit.setLineColor(color);
            hightLimit.setTextColor(color);
            leftAxis.addLimitLine(hightLimit);
            mBarChart.invalidate();
        }
    
        /**
         * 设置低限制线
         *
         * @param low
         * @param name
         */
        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);
            mBarChart.invalidate();
        }
    
        /**
         * 设置描述信息
         *
         * @param str
         */
        public void setDescription(String str) {
            Description description = new Description();
            description.setText(str);
            mBarChart.setDescription(description);
            mBarChart.invalidate();
        }
    }

自定义的X轴数据转换类

import com.github.mikephil.charting.components.AxisBase;
    import com.github.mikephil.charting.formatter.IAxisValueFormatter;
    
    import java.util.List;
    
    /*
     * Description: x轴数据转换类
     */
    
    public class StringAxisValueFormatter implements IAxisValueFormatter {
        
    
        private List<String> xValues;
    
        public StringAxisValueFormatter(List<String> xValues) {
            this.xValues = xValues;
        }
    
        @Override
        public String getFormattedValue(float v, AxisBase axisBase) {
            try{
                if (v < 0 || v > (xValues.size() - 1)){
       //使得两侧柱子完全显示
                    return "";
                }
                return xValues.get((int)v);
            }catch (Exception e){
                return "";
            }
        }
    }

Activity使用的时候：

private void testBarChart() {
            BarChartManager barChartManager1 = new BarChartManager(barChart1);
            BarChartManager barChartManager2 = new BarChartManager(barChart2);
    
            //设置x轴的数据
            ArrayList<String> xValues0 = new ArrayList<>();
            xValues0.add("早晨");
            xValues0.add("上午");
            xValues0.add("中午");
            xValues0.add("下午");
            xValues0.add("晚上");
    
            //设置x轴的数据
            ArrayList<Float> xValues = new ArrayList<>();
            for (int i = 1; i < 6; i++) {
                xValues.add((float) i);
            }
    
            //设置y轴的数据()
            List<List<Float>> yValues = new ArrayList<>();
            for (int i = 0; i < 4; i++) {
                List<Float> yValue = new ArrayList<>();
                for (int j = 0; j < 5; j++) {
                    yValue.add((float) (Math.random() * 8)+2);
                }
                yValues.add(yValue);
            }
    
            //颜色集合
            List<Integer> colors = new ArrayList<>();
            colors.add(Color.GREEN);
            colors.add(Color.BLUE);
            colors.add(Color.RED);
            colors.add(Color.CYAN);
    
            //线的名字集合
            List<String> names = new ArrayList<>();
            names.add("柱状一");
            names.add("柱状二");
            names.add("柱状三");
            names.add("柱状四");
    
            //创建多条柱状的图表
            barChartManager1.showBarChart(xValues, yValues.get(0), names.get(1), colors.get(3));
            barChartManager2.showBarChart(xValues0, yValues,names);
        }

#### **折线图** ####

效果图如下：  
![这里写图片描述][SouthEast 1]  
  
使用  
1、初始化LineChart对象，设置基础属性  
2、初始化Entry对象，添加x轴和y轴数据  
3、初始化LineDataSet对象，为其添加Entry  
4、初始化LineData对象，为其添加LineDataSet对象  
5、设置数据，显示图表LineChart.setData(lineData)

一样的，这里也封装了一个折线图管理类LineChartManager,代码如下：

import com.github.mikephil.charting.animation.Easing;
    import com.github.mikephil.charting.charts.LineChart;
    import com.github.mikephil.charting.components.Description;
    import com.github.mikephil.charting.components.Legend;
    import com.github.mikephil.charting.components.LimitLine;
    import com.github.mikephil.charting.components.XAxis;
    import com.github.mikephil.charting.components.YAxis;
    import com.github.mikephil.charting.data.Entry;
    import com.github.mikephil.charting.data.LineData;
    import com.github.mikephil.charting.data.LineDataSet;
    import com.github.mikephil.charting.interfaces.datasets.ILineDataSet;
    
    import java.util.ArrayList;
    import java.util.List;
    
    /**
     * Descriptions: 折线图管理类
     */
    
    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();
            initLineChart();
        }
    
        /**
         * 初始化LineChart
         */
        private void initLineChart() {
            lineChart.setDrawGridBackground(false);
    
            //显示边界
            lineChart.setDrawBorders(false);
    
            //设置动画效果
            lineChart.animateY(1000, Easing.EasingOption.Linear);
            lineChart.animateX(1000, Easing.EasingOption.Linear);
    
            //折线图例 标签 设置
            Legend legend = lineChart.getLegend();
            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);
            rightAxis.setAxisMinimum(0f);
            rightAxis.setEnabled(false);
    //        xAxis.setDrawGridLines(false);//不绘制x轴网线
    //        leftAxis.setDrawGridLines(false);//不绘制Y周网线
        }
    
        /**
         * 初始化曲线 每一个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.setCircleRadius(3f);
            //设置曲线值的圆点是实心还是空心
            lineDataSet.setDrawCircleHole(true);
            lineDataSet.setValueTextSize(9f);
            //设置折线图填充
            lineDataSet.setDrawFilled(mode);//填充曲线下方的区域
            lineDataSet.setFormLineWidth(1f);
            lineDataSet.setFormSize(15.f);
            //线模式为圆滑曲线（默认折线）
            lineDataSet.setMode(LineDataSet.Mode.LINEAR);
        }
    
        /**
         * 展示折线图(一条)
         *
         * @param xAxisValues
         * @param yAxisValues
         * @param label
         * @param color
         */
        public void showLineChart(List<Float> xAxisValues, List<Float> yAxisValues, String label, int color) {
            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);
            //线模式为圆滑曲线（默认折线）
            lineDataSet.setMode(LineDataSet.Mode.CUBIC_BEZIER);
            //设置圆心半径
            lineDataSet.setCircleRadius(3f);
            //设置曲线值的圆点是实心还是空心
            lineDataSet.setDrawCircleHole(false);
            initLineDataSet(lineDataSet, color, false);
    
            ArrayList<ILineDataSet> dataSets = new ArrayList<>();
            dataSets.add(lineDataSet);
            LineData data = new LineData(dataSets);
            //设置X轴的刻度数
            xAxis.setLabelCount(xAxisValues.size());
    
            lineChart.setData(data);
        }
    
        public void showLineChart(List<String> xValues,List<Float> yValues,int color){
            ArrayList<Entry> entries = new ArrayList<>();
            xAxis.setValueFormatter(new StringAxisValueFormatter(xValues));
            for (int i = 0; i < xValues.size(); i++) {
                entries.add(new Entry( i, yValues.get(i)));
            }
            // 每一个LineDataSet代表一条线
            LineDataSet lineDataSet = new LineDataSet(entries, "折线test");
            initLineDataSet(lineDataSet, color, false);
    
            ArrayList<ILineDataSet> dataSets = new ArrayList<>();
            dataSets.add(lineDataSet);
            LineData data = new LineData(dataSets);
            //设置X轴的刻度数
            xAxis.setLabelCount(xValues.size());
    
            lineChart.setData(data);
        }
    
        /**
         * 展示线性图(多条)
         *
         * @param xAxisValues
         * @param yAxisValues 多条曲线Y轴数据集合的集合
         * @param labels
         * @param colors
         */
        public void showLineChart(List<Float> xAxisValues, List<List<Float>> yAxisValues, List<String> labels, List<Integer> colors) {
            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, colors.get(i), false);
                dataSets.add(lineDataSet);
            }
            LineData data = new LineData(dataSets);
            xAxis.setLabelCount(xAxisValues.size(), true);
            lineChart.setData(data);
        }
    
        /**
         * 设置Y轴值
         *
         * @param max
         * @param min
         * @param labelCount
         */
        public void setYAxis(float max, float min, int labelCount) {
            if (max < min) {
                return;
            }
            leftAxis.setAxisMaximum(max);
            leftAxis.setAxisMinimum(min);
            leftAxis.setLabelCount(labelCount, false);
    
            rightAxis.setAxisMaximum(max);
            rightAxis.setAxisMinimum(min);
            rightAxis.setLabelCount(labelCount, false);
            lineChart.invalidate();
        }
    
        /**
         * 设置X轴的值
         *
         * @param max
         * @param min
         * @param labelCount
         */
        public void setXAxis(float max, float min, int labelCount) {
            xAxis.setAxisMaximum(max);
            xAxis.setAxisMinimum(min);
            xAxis.setLabelCount(labelCount, true);
    
            lineChart.invalidate();
        }
    
        /**
         * 设置高限制线
         *
         * @param high
         * @param name
         */
        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();
        }
    
        /**
         * 设置低限制线
         *
         * @param low
         * @param name
         */
        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();
        }
    
        /**
         * 设置描述信息
         *
         * @param str
         */
        public void setDescription(String str) {
            Description description = new Description();
            description.setText(str);
            lineChart.setDescription(description);
            lineChart.invalidate();
        }
    }

x轴数据转换类代码就不贴了，柱状图上面有。  
Activity中使用

/**
         * 测试折线图
         */
        private void testLineChart() {
            LineChartManager lineChartManager1 = new LineChartManager(lineChart1);
            LineChartManager lineChartManager2 = new LineChartManager(lineChart2);
    
            //设置x轴的数据
            ArrayList<Float> xValues = new ArrayList<>();
            for (int i = 0; i < 10; i++) {
       //10组数据
                xValues.add((float) i);
            }
    
            //设置y轴的数据()
            List<List<Float>> yValues = new ArrayList<>();
            for (int i = 0; i < 4; i++) {
                List<Float> yValue = new ArrayList<>();
                for (int j = 0; j < 10; j++) {
                    yValue.add((float) (Math.random() * 80));
                }
                yValues.add(yValue);
            }
    
            //颜色集合
            List<Integer> colors = new ArrayList<>();
            colors.add(Color.GREEN);
            colors.add(Color.BLUE);
            colors.add(Color.RED);
            colors.add(Color.CYAN);
    
            //线的名字集合
            List<String> names = new ArrayList<>();
            names.add("折线一");
            names.add("折线二");
            names.add("折线三");
            names.add("折线四");
    
            //创建单条折线的图表
            lineChartManager1.showLineChart(xValues, yValues.get(0), names.get(0), colors.get(0));
            lineChartManager1.setYAxis(100, 0, 11);
            lineChartManager1.setDescription("温度");
            // lineChartManager1.setXAxis(10,0,xValues.size());
            lineChartManager1.setHightLimitLine(70,"高温报警",Color.RED);
    
            //创建多条折线的图表
           // lineChartManager2.showLineChart(xValues, yValues, names, colors);
           // lineChartManager2.setYAxis(100, 0, 11);
            lineChartManager2.showLineChart(xValues, yValues, names, colors);
            lineChartManager2.setYAxis(100, 0, 11);
            lineChartManager2.setDescription("温度");
        }

#### **组合图** ####

组合图CombinedChart。这里主要是折线图和柱状图的组合形式  
效果图如下：  
![这里写图片描述][SouthEast 2]

xml文件

<com.github.mikephil.charting.charts.CombinedChart
                android:id="@+id/combine_chart2"
                android:layout_width="match_parent"
                android:layout_height="250dp"/>

这里也封装了一个CombinedChart工具类，CombinedChartManager代码如下：

public class CombinedChartManager {
        
    
        private CombinedChart mCombinedChart;
        private YAxis leftAxis;
        private YAxis rightAxis;
        private XAxis xAxis;
    
        public CombinedChartManager(CombinedChart combinedChart) {
            this.mCombinedChart = combinedChart;
            leftAxis = mCombinedChart.getAxisLeft();
            rightAxis = mCombinedChart.getAxisRight();
            xAxis = mCombinedChart.getXAxis();
        }
    
        /**
         * 初始化Chart
         */
        private void initChart() {
            //不显示描述内容
            mCombinedChart.getDescription().setEnabled(false);
    
            mCombinedChart.setDrawOrder(new CombinedChart.DrawOrder[]{
                    CombinedChart.DrawOrder.BAR,
                    CombinedChart.DrawOrder.LINE
            });
    
            mCombinedChart.setBackgroundColor(Color.WHITE);
            mCombinedChart.setDrawGridBackground(false);
            mCombinedChart.setDrawBarShadow(false);
            mCombinedChart.setHighlightFullBarEnabled(false);
            //显示边界
            mCombinedChart.setDrawBorders(true);
            //图例说明
            Legend legend = mCombinedChart.getLegend();
            legend.setWordWrapEnabled(true);
    
            legend.setVerticalAlignment(Legend.LegendVerticalAlignment.BOTTOM);
            legend.setHorizontalAlignment(Legend.LegendHorizontalAlignment.CENTER);
            legend.setOrientation(Legend.LegendOrientation.HORIZONTAL);
            legend.setDrawInside(false);
            //Y轴设置
            rightAxis.setDrawGridLines(false);
            rightAxis.setAxisMinimum(0f);
    
            leftAxis.setDrawGridLines(false);
            leftAxis.setAxisMinimum(0f);
    
            mCombinedChart.animateX(2000); // 立即执行的动画,x轴
        }
    
        /**
         * 设置X轴坐标值
         *
         * @param xAxisValues x轴坐标集合
         */
        public void setXAxis(final List<String> xAxisValues) {
    
            //设置X轴在底部
            XAxis xAxis = mCombinedChart.getXAxis();
            xAxis.setPosition(XAxis.XAxisPosition.BOTTOM);
            xAxis.setGranularity(1f);
    
            xAxis.setLabelCount(xAxisValues.size() - 1,false);
            xAxis.setValueFormatter(new IAxisValueFormatter() {
                @Override
                public String getFormattedValue(float value, AxisBase axis) {
                    return xAxisValues.get((int) value % xAxisValues.size());
                }
            });
            mCombinedChart.invalidate();
        }
    
        /**
         * 得到折线图(一条)
         *
         * @param lineChartY 折线Y轴值
         * @param lineName   折线图名字
         * @param lineColor  折线颜色
         * @return
         */
        private LineData getLineData(List<Float> lineChartY, String lineName, int lineColor) {
            LineData lineData = new LineData();
    
            ArrayList<Entry> yValue = new ArrayList<>();
            for (int i = 0; i < lineChartY.size(); i++) {
                yValue.add(new Entry(i, lineChartY.get(i)));
            }
            LineDataSet dataSet = new LineDataSet(yValue, lineName);
    
            dataSet.setColor(lineColor);
            dataSet.setCircleColor(lineColor);
            dataSet.setValueTextColor(lineColor);
    
            dataSet.setCircleSize(1);
            //显示值
            dataSet.setDrawValues(true);
            dataSet.setValueTextSize(10f);
            dataSet.setMode(LineDataSet.Mode.CUBIC_BEZIER);
            dataSet.setAxisDependency(YAxis.AxisDependency.LEFT);
            lineData.addDataSet(dataSet);
            return lineData;
        }
    
        /**
         * 得到折线图(多条)
         *
         * @param lineChartYs 折线Y轴值
         * @param lineNames   折线图名字
         * @param lineColors  折线颜色
         * @return
         */
        private LineData getLineData(List<List<Float>> lineChartYs, List<String> lineNames, List<Integer> lineColors) {
            LineData lineData = new LineData();
    
            for (int i = 0; i < lineChartYs.size(); i++) {
                ArrayList<Entry> yValues = new ArrayList<>();
                for (int j = 0; j < lineChartYs.get(i).size(); j++) {
                    yValues.add(new Entry(j, lineChartYs.get(i).get(j)));
                }
                LineDataSet dataSet = new LineDataSet(yValues, lineNames.get(i));
                dataSet.setColor(lineColors.get(i));
                dataSet.setCircleColor(lineColors.get(i));
                dataSet.setValueTextColor(lineColors.get(i));
    
                dataSet.setCircleSize(1);
                dataSet.setDrawValues(true);
                dataSet.setValueTextSize(10f);
                dataSet.setMode(LineDataSet.Mode.CUBIC_BEZIER);
                dataSet.setAxisDependency(YAxis.AxisDependency.LEFT);
                lineData.addDataSet(dataSet);
            }
            return lineData;
        }
    
        /**
         * 得到柱状图
         *
         * @param barChartY Y轴值
         * @param barName   柱状图名字
         * @param barColor  柱状图颜色
         * @return
         */
    
        private BarData getBarData(List<Float> barChartY, String barName, int barColor) {
            BarData barData = new BarData();
            ArrayList<BarEntry> yValues = new ArrayList<>();
            for (int i = 0; i < barChartY.size(); i++) {
                yValues.add(new BarEntry(i, barChartY.get(i)));
            }
    
            BarDataSet barDataSet = new BarDataSet(yValues, barName);
            barDataSet.setColor(barColor);
            barDataSet.setValueTextSize(10f);
            barDataSet.setValueTextColor(barColor);
            barDataSet.setAxisDependency(YAxis.AxisDependency.LEFT);
            barData.addDataSet(barDataSet);
    
            //以下是为了解决 柱状图 左右两边只显示了一半的问题 根据实际情况 而定
            xAxis.setAxisMinimum(-0.5f);
            xAxis.setAxisMaximum((float) (barChartY.size()- 0.5));
            return barData;
        }
    
        /**
         * 得到柱状图(多条)
         *
         * @param barChartYs Y轴值
         * @param barNames   柱状图名字
         * @param barColors  柱状图颜色
         * @return
         */
    
        private BarData getBarData(List<List<Float>> barChartYs, List<String> barNames, List<Integer> barColors) {
            List<IBarDataSet> lists = new ArrayList<>();
            for (int i = 0; i < barChartYs.size(); i++) {
                ArrayList<BarEntry> entries = new ArrayList<>();
    
                for (int j = 0; j < barChartYs.get(i).size(); j++) {
                    entries.add(new BarEntry(j, barChartYs.get(i).get(j)));
                }
                BarDataSet barDataSet = new BarDataSet(entries, barNames.get(i));
    
                barDataSet.setColor(barColors.get(i));
                barDataSet.setValueTextColor(barColors.get(i));
                barDataSet.setValueTextSize(10f);
                barDataSet.setAxisDependency(YAxis.AxisDependency.LEFT);
                lists.add(barDataSet);
            }
            BarData barData = new BarData(lists);
    
            int amount = barChartYs.size(); //需要显示柱状图的类别 数量
            float groupSpace = 0.12f; //柱状图组之间的间距
            float barSpace = (float) ((1 - 0.12) / amount / 10); // x4 DataSet
            float barWidth = (float) ((1 - 0.12) / amount / 10 * 9); // x4 DataSet
    
            // (0.2 + 0.02) * 4 + 0.12 = 1.00 即100% 按照百分百布局
            //柱状图宽度
            barData.setBarWidth(barWidth);
            //(起始点、柱状图组间距、柱状图之间间距)
            barData.groupBars(0, groupSpace, barSpace);
            return barData;
        }
    
        /**
         * 显示混合图(柱状图+折线图)
         *
         * @param xAxisValues X轴坐标
         * @param barChartY   柱状图Y轴值
         * @param lineChartY  折线图Y轴值
         * @param barName     柱状图名字
         * @param lineName    折线图名字
         * @param barColor    柱状图颜色
         * @param lineColor   折线图颜色
         */
    
        public void showCombinedChart(
                List<String> xAxisValues, List<Float> barChartY, List<Float> lineChartY
                , String barName, String lineName, int barColor, int lineColor) {
            initChart();
            setXAxis(xAxisValues);
    
            CombinedData combinedData = new CombinedData();
    
            combinedData.setData(getBarData(barChartY, barName, barColor));
            combinedData.setData(getLineData(lineChartY, lineName, lineColor));
            mCombinedChart.setData(combinedData);
            mCombinedChart.invalidate();
        }
    
        /**
         * 显示混合图(柱状图+折线图)
         *
         * @param xAxisValues X轴坐标
         * @param barChartYs  柱状图Y轴值
         * @param lineChartYs 折线图Y轴值
         * @param barNames    柱状图名字
         * @param lineNames   折线图名字
         * @param barColors   柱状图颜色
         * @param lineColors  折线图颜色
         */
    
        public void showCombinedChart(
                List<String> xAxisValues, List<List<Float>> barChartYs, List<List<Float>> lineChartYs,
                List<String> barNames, List<String> lineNames, List<Integer> barColors, List<Integer> lineColors) {
            initChart();
            setXAxis(xAxisValues);
    
            CombinedData combinedData = new CombinedData();
    
            combinedData.setData(getBarData(barChartYs, barNames, barColors));
            combinedData.setData(getLineData(lineChartYs, lineNames, lineColors));
    
            mCombinedChart.setData(combinedData);
            mCombinedChart.invalidate();
        }
    }

但是用到组合图的时候，遇到一个问题，就是一个组合图中柱状图可以设置group，但是对应的折线图只有一个值，这个问题github上也有人发过[相应的issues][issues]，作者PhilJay本人说在3.0的版本中已经解决，但是也没看到例子。现在我采用的是一个比较蠢的方法，用几个第一个图的效果“拼”出所需的效果，假如你有其他更好的方法，或者如果有人会用所说的新属性的话，烦请告诉我一声，不胜感激。

#### **参考资料** ####

1、[android开源图表库MPAndroidChart文档翻译（上）][android_MPAndroidChart]  
2、[Android图表控件MPAndroidChart——曲线图+柱状图 CombinedChart的使用][Android_MPAndroidChart_ CombinedChart]  
3、[Android之MPAndroidChart库使用说明（柱状图、折线图、饼图和组合图.）][Android_MPAndroidChart_.]  
4、[MPAndroidChart 教程：开始 Getting Started（一）][MPAndroidChart _ Getting Started]

[Link 1]: http://blog.csdn.net/android_cmos/article/details/76222160
[SouthEast]: /images/20220610/f4800c97556844049ec869dbbf828888.png
[SouthEast 1]: /images/20220610/89e5a4aa619a4cd0a1d5e132dcd1340f.png
[SouthEast 2]: /images/20220610/dbea9fb2372d45ea95b325f7bfc567b9.png
[issues]: https://github.com/PhilJay/MPAndroidChart/issues/449
[android_MPAndroidChart]: http://blog.csdn.net/robertcpp/article/details/51618495
[Android_MPAndroidChart_ CombinedChart]: http://blog.csdn.net/ww897532167/article/details/74178449
[Android_MPAndroidChart_.]: http://blog.csdn.net/wjk343977868/article/details/53316981
[MPAndroidChart _ Getting Started]: http://blog.csdn.net/u014136472/article/details/50293767