MpAndroidChart各种图表我都用了一遍，并且已经熟练掌握。总结我的Demo

来源：互联网发布：ubuntu chrome 下载源编辑：程序博客网时间：2024/04/29 15:53

首先从作者那里下载 MpAndroidChart.jar : https://github.com/PhilJay/MPAndroidChart

怎么导入项目我就不罗嗦了，来不及解释了，看图看代码

import com.github.mikephil.charting.charts.BarChart;import com.github.mikephil.charting.data.BarData;import android.app.Activity;import android.os.Bundle;import android.view.Window;public class MainActivity extends Activity {private BarChart mBarChart,mBarChart2,mBarChart3,mBarChart4,mBarChart5,mBarChart6,mBarChart7,mBarChart8,mBarChart9;    private BarData mBarData;    private BarCharts mBarCharts;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);requestWindowFeature(Window.FEATURE_NO_TITLE);setContentView(R.layout.activity_main);mBarCharts = new BarCharts();// 创建多张图表mBarChart = (BarChart) findViewById(R.id.spreadBarChart);mBarChart2 = (BarChart) findViewById(R.id.spreadBarChart2);mBarChart3 = (BarChart) findViewById(R.id.spreadBarChart3);mBarChart4 = (BarChart) findViewById(R.id.spreadBarChart4);mBarChart5 = (BarChart) findViewById(R.id.spreadBarChart5);mBarChart6 = (BarChart) findViewById(R.id.spreadBarChart6);mBarChart7 = (BarChart) findViewById(R.id.spreadBarChart7);mBarChart8 = (BarChart) findViewById(R.id.spreadBarChart8);mBarChart9 = (BarChart) findViewById(R.id.spreadBarChart9);        mBarData = mBarCharts.getBarData(14, 500);        mBarCharts.showBarChart(mBarChart, mBarData);                mBarData = mBarCharts.getBarData(14, 900);        mBarCharts.showBarChart(mBarChart2, mBarData);                mBarData = mBarCharts.getBarData(14, 100);        mBarCharts.showBarChart(mBarChart3, mBarData);                mBarData = mBarCharts.getBarData(14, 100);        mBarCharts.showBarChart(mBarChart4, mBarData);                mBarData = mBarCharts.getBarData(14, 100);        mBarCharts.showBarChart(mBarChart5, mBarData);                mBarData = mBarCharts.getBarData(14, 100);        mBarCharts.showBarChart(mBarChart6, mBarData);                mBarData = mBarCharts.getBarData(14, 100);        mBarCharts.showBarChart(mBarChart7, mBarData);                mBarData = mBarCharts.getBarData(14, 100);          mBarCharts.showBarChart(mBarChart8, mBarData);                mBarData = mBarCharts.getBarData(14, 100);        mBarCharts.showBarChart(mBarChart9, mBarData);}}

然后再设置图表属性：

package com.mpadnroidchart.barchartdemo;import java.util.ArrayList;import android.graphics.Color;import com.github.mikephil.charting.charts.BarChart;import com.github.mikephil.charting.components.Legend;import com.github.mikephil.charting.components.Legend.LegendForm;import com.github.mikephil.charting.components.XAxis;import com.github.mikephil.charting.components.XAxis.XAxisPosition;import com.github.mikephil.charting.data.BarData;import com.github.mikephil.charting.data.BarDataSet;import com.github.mikephil.charting.data.BarEntry;/** * @author 正月 | ZhouDaDo */public class BarCharts {private String[] color = {"#C4FF8E","#FFF88D","#FFD38C","#8CEBFF","#FF8F9D","#6BF3AD","#C4FF8E","#FFF88D","#FFD38C","#8CEBFF","#FF8F9D","#6BF3AD","#C4FF8E","#FFF88D","#FFD38C","#8CEBFF","#FF8F9D","#6BF3AD","#C4FF8E","#FFF88D","#FFD38C","#8CEBFF","#FF8F9D","#6BF3AD","#C4FF8E","#FFF88D","#FFD38C","#8CEBFF","#FF8F9D","#6BF3AD","#C4FF8E","#FFF88D","#FFD38C","#8CEBFF","#FF8F9D","#6BF3AD","#C4FF8E","#FFF88D","#FFD38C","#8CEBFF","#FF8F9D","#6BF3AD","#C4FF8E","#FFF88D","#FFD38C","#8CEBFF","#FF8F9D","#6BF3AD","#C4FF8E","#FFF88D","#FFD38C","#8CEBFF","#FF8F9D","#6BF3AD","#C4FF8E","#FFF88D","#FFD38C","#8CEBFF","#FF8F9D","#6BF3AD","#C4FF8E","#FFF88D","#FFD38C","#8CEBFF","#FF8F9D","#6BF3AD"};public void showBarChart(BarChart barChart, BarData barData) {// 数据描述              barChart.setDescription("");        // 如果没有数据的时候，会显示这个，类似ListView的EmptyView        barChart.setNoDataTextDescription("You need to provide data for the chart.");        // 是否显示表格颜色          barChart.setDrawGridBackground(false);          // 设置是否可以触摸        barChart.setTouchEnabled(true);         // 是否可以拖拽        barChart.setDragEnabled(false);             // 是否可以缩放        barChart.setScaleEnabled(false);        // 集双指缩放        barChart.setPinchZoom(false);        // 设置背景        barChart.setBackgroundColor(Color.parseColor("#01000000"));        // 如果打开，背景矩形将出现在已经画好的绘图区域的后边。        barChart.setDrawGridBackground(false);        // 集拉杆阴影        barChart.setDrawBarShadow(false);        // 图例        barChart.getLegend().setEnabled(false);        // 设置数据        barChart.setData(barData);                 // 隐藏右边的坐标轴 (就是右边的0 - 100 - 200 - 300 ... 和图表中横线)        barChart.getAxisRight().setEnabled(false); // 隐藏左边的左边轴 (同上)//        barChart.getAxisLeft().setEnabled(false);                // 网格背景颜色        barChart.setGridBackgroundColor(Color.parseColor("#00000000"));        // 是否显示表格颜色        barChart.setDrawGridBackground(false);        // 设置边框颜色        barChart.setBorderColor(Color.parseColor("#00000000"));        // 说明颜色        barChart.setDescriptionColor(Color.parseColor("#00000000"));        // 拉杆阴影        barChart.setDrawBarShadow(false);        // 打开或关闭绘制的图表边框。（环绕图表的线）        barChart.setDrawBorders(false);                        Legend mLegend = barChart.getLegend(); // 设置比例图标示        // 设置窗体样式        mLegend.setForm(LegendForm.CIRCLE);        // 字体        mLegend.setFormSize(4f);        // 字体颜色        mLegend.setTextColor(Color.parseColor("#00000000"));                        XAxis xAxis = barChart.getXAxis();xAxis.setPosition(XAxisPosition.BOTTOM);xAxis.setDrawGridLines(false);xAxis.setSpaceBetweenLabels(2);                barChart.animateY(1000); // 立即执行的动画,Y轴    }    public BarData getBarData(int count, float range) {        ArrayList<String> xValues = new ArrayList<String>();        for (int i = 0; i < count; i++) {            xValues.add(""+(i+1)+"周");// 设置每个壮图的文字描述        }        ArrayList<BarEntry> yValues = new ArrayList<BarEntry>();        for (int i = 0; i < count; i++) {            float value = (float) (Math.random() * range/*100以内的随机数*/) + 3;            yValues.add(new BarEntry(value, i));        }        // y轴的数据集合              BarDataSet barDataSet = new BarDataSet(yValues, "测试饼状图");        ArrayList<Integer> colors = new ArrayList<Integer>();        for(int i = 0;i < count ;i++){        colors.add(Color.parseColor(color[i]));        }        barDataSet.setColors(colors);        // 设置栏阴影颜色        barDataSet.setBarShadowColor(Color.parseColor("#01000000"));        ArrayList<BarDataSet> barDataSets = new ArrayList<BarDataSet>();        barDataSets.add(barDataSet);        barDataSet.setValueTextColor(Color.parseColor("#FF8F9D"));        // 绘制值        barDataSet.setDrawValues(true);        BarData barData = new BarData(xValues, barDataSets);        return barData;    }}

点击下载柱状图Demo

有的小伙伴觉得柱状图不过瘾，需要多个柱状图在一起来表示一种信息：像这样的

来不及解释了，上代码。

package com.barchart.barchart3sdemo;import android.app.Activity;import android.os.Bundle;import android.view.Window;import com.github.mikephil.charting.charts.BarChart;import com.github.mikephil.charting.data.BarData;public class MainActivity extends Activity {private BarChart3s mBarChart3s;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);requestWindowFeature(Window.FEATURE_NO_TITLE);setContentView(R.layout.activity_main);BarChart chart = (BarChart) findViewById(R.id.chart);mBarChart3s = new BarChart3s(chart);        BarData data = new BarData(mBarChart3s.getXAxisValues(), mBarChart3s.getDataSet());        // 设置数据        chart.setData(data);        }}

package com.barchart.barchart3sdemo;import java.util.ArrayList;import android.graphics.Color;import com.github.mikephil.charting.charts.BarChart;import com.github.mikephil.charting.components.Legend;import com.github.mikephil.charting.components.Legend.LegendForm;import com.github.mikephil.charting.components.XAxis;import com.github.mikephil.charting.components.XAxis.XAxisPosition;import com.github.mikephil.charting.data.BarDataSet;import com.github.mikephil.charting.data.BarEntry;public class BarChart3s {public BarChart3s(BarChart chart) {// 数据描述          chart.setDescription("");        // 动画        chart.animateY(1000);        // 设置是否可以触摸        chart.setTouchEnabled(true);        // 是否可以拖拽        chart.setDragEnabled(false);             // 是否可以缩放        chart.setScaleEnabled(false);        // 集双指缩放        chart.setPinchZoom(false);        // 隐藏右边的坐标轴        chart.getAxisRight().setEnabled(false); // 隐藏左边的左边轴        chart.getAxisLeft().setEnabled(false);                Legend mLegend = chart.getLegend(); // 设置比例图标示        // 设置窗体样式        mLegend.setForm(LegendForm.SQUARE);        // 字体        mLegend.setFormSize(4f);        // 字体颜色        mLegend.setTextColor(Color.parseColor("#7e7e7e"));                        XAxis xAxis = chart.getXAxis();xAxis.setPosition(XAxisPosition.BOTTOM);xAxis.setDrawGridLines(false);xAxis.setSpaceBetweenLabels(2);        chart.invalidate();}public ArrayList<BarDataSet> getDataSet() {        ArrayList<BarDataSet> dataSets = null;        ArrayList<BarEntry> valueSet1 = new ArrayList<BarEntry>();        BarEntry v1e1 = new BarEntry(110.000f, 0); // Jan        valueSet1.add(v1e1);        BarEntry v1e2 = new BarEntry(40.000f, 1); // Feb        valueSet1.add(v1e2);        BarEntry v1e3 = new BarEntry(60.000f, 2); // Mar        valueSet1.add(v1e3);        BarEntry v1e4 = new BarEntry(30.000f, 3); // Apr        valueSet1.add(v1e4);        BarEntry v1e5 = new BarEntry(90.000f, 4); // May        valueSet1.add(v1e5);        BarEntry v1e6 = new BarEntry(100.000f, 5); // Jun        valueSet1.add(v1e6);         ArrayList<BarEntry> valueSet2 = new ArrayList<BarEntry>();        BarEntry v2e1 = new BarEntry(150.000f, 0); // Jan        valueSet2.add(v2e1);        BarEntry v2e2 = new BarEntry(90.000f, 1); // Feb        valueSet2.add(v2e2);        BarEntry v2e3 = new BarEntry(120.000f, 2); // Mar        valueSet2.add(v2e3);        BarEntry v2e4 = new BarEntry(60.000f, 3); // Apr        valueSet2.add(v2e4);        BarEntry v2e5 = new BarEntry(20.000f, 4); // May        valueSet2.add(v2e5);        BarEntry v2e6 = new BarEntry(80.000f, 5); // Jun        valueSet2.add(v2e6);                ArrayList<BarEntry> valueSet3 = new ArrayList<BarEntry>();        BarEntry v3e1 = new BarEntry(20.000f, 0); // Jan        valueSet3.add(v3e1);        BarEntry v3e2 = new BarEntry(60.000f, 1); // Feb        valueSet3.add(v3e2);        BarEntry v3e3 = new BarEntry(90.000f, 2); // Mar        valueSet3.add(v3e3);        BarEntry v3e4 = new BarEntry(150.000f, 3); // Apr        valueSet3.add(v3e4);        BarEntry v3e5 = new BarEntry(120.000f, 4); // May        valueSet3.add(v3e5);        BarEntry v3e6 = new BarEntry(40.000f, 5); // Jun        valueSet3.add(v3e6);         BarDataSet barDataSet1 = new BarDataSet(valueSet1, "数据1注解");        barDataSet1.setColor(Color.parseColor("#F26077"));        barDataSet1.setBarShadowColor(Color.parseColor("#01000000"));                BarDataSet barDataSet2 = new BarDataSet(valueSet2, "数据2注解");        barDataSet2.setColor(Color.parseColor("#00C0BF"));        barDataSet2.setBarShadowColor(Color.parseColor("#01000000"));                BarDataSet barDataSet3 = new BarDataSet(valueSet3, "数据3注解");        barDataSet3.setColor(Color.parseColor("#DEAD26"));        barDataSet3.setBarShadowColor(Color.parseColor("#01000000"));                dataSets = new ArrayList<BarDataSet>();        dataSets.add(barDataSet1);        dataSets.add(barDataSet2);        dataSets.add(barDataSet3);                return dataSets;    }    public ArrayList<String> getXAxisValues() {        ArrayList<String> xAxis = new ArrayList<String>();        xAxis.add("星期一");        xAxis.add("星期二");        xAxis.add("星期三");        xAxis.add("星期四");        xAxis.add("星期五");        xAxis.add("星期六");        return xAxis;    }}

点击下载BarChart3sDemo

但是我们有时需求希望可以在柱状图上再来个折线图。或者来一条线代表柱状图的平均值。像这样

来不及解释了，看代码：

package com.mpchart.barchartcombined;import java.util.ArrayList;import java.util.List;import java.util.Map;import android.graphics.Color;import com.github.mikephil.charting.charts.CombinedChart;import com.github.mikephil.charting.charts.CombinedChart.DrawOrder;import com.github.mikephil.charting.components.Legend;import com.github.mikephil.charting.components.Legend.LegendForm;import com.github.mikephil.charting.components.XAxis;import com.github.mikephil.charting.components.XAxis.XAxisPosition;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.data.BubbleData;import com.github.mikephil.charting.data.BubbleDataSet;import com.github.mikephil.charting.data.BubbleEntry;import com.github.mikephil.charting.data.CandleData;import com.github.mikephil.charting.data.CandleDataSet;import com.github.mikephil.charting.data.CandleEntry;import com.github.mikephil.charting.data.CombinedData;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.data.ScatterData;import com.github.mikephil.charting.data.ScatterDataSet;import com.github.mikephil.charting.utils.ColorTemplate;public class BarChartCombined {private final int itemcount = 12;protected String[] mMonths = new String[] {"Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Okt", "Nov", "Dec"};protected String[] colors = {"#C4FF8E","#FFF88D","#FFD38C","#8CEBFF","#FF8F9D","#6BF3AD","#C4FF8E","#FFF88D","#FFD38C","#8CEBFF","#FF8F9D","#6BF3AD","#C4FF8E","#FFF88D","#FFD38C","#8CEBFF","#FF8F9D","#6BF3AD","#C4FF8E","#FFF88D","#FFD38C","#8CEBFF","#FF8F9D","#6BF3AD","#C4FF8E","#FFF88D","#FFD38C","#8CEBFF","#FF8F9D","#6BF3AD","#C4FF8E","#FFF88D","#FFD38C","#8CEBFF","#FF8F9D","#6BF3AD","#C4FF8E","#FFF88D","#FFD38C","#8CEBFF","#FF8F9D","#6BF3AD","#C4FF8E","#FFF88D","#FFD38C","#8CEBFF","#FF8F9D","#6BF3AD","#C4FF8E","#FFF88D","#FFD38C","#8CEBFF","#FF8F9D","#6BF3AD","#C4FF8E","#FFF88D","#FFD38C","#8CEBFF","#FF8F9D","#6BF3AD","#C4FF8E","#FFF88D","#FFD38C","#8CEBFF","#FF8F9D","#6BF3AD"};// 设置图表样式public BarChartCombined(CombinedChart mChart) {mChart.setDescription("");        mChart.setDrawGridBackground(false);        mChart.setDrawBarShadow(false);        // 设置是否可以触摸        mChart.setTouchEnabled(true);        // 是否可以拖拽        mChart.setDragEnabled(false);        // 是否可以缩放        mChart.setScaleEnabled(false);        // 集双指缩放        mChart.setPinchZoom(false);        // 下面的图例图例        mChart.getLegend().setEnabled(false);        // 设置背景透明        mChart.setBackgroundColor(Color.parseColor("#00000000"));                // draw bars behind lines        mChart.setDrawOrder(new DrawOrder[] {DrawOrder.BAR, DrawOrder.BUBBLE, DrawOrder.CANDLE, DrawOrder.LINE, DrawOrder.SCATTER});        // 下面标记解释设置        Legend mLegend = mChart.getLegend(); // 设置比例图标示        // 设置窗体样式        mLegend.setForm(LegendForm.CIRCLE);        // 字体        mLegend.setFormSize(4f);        // 字体颜色        mLegend.setTextColor(Color.parseColor("#000000"));                /*YAxis rightAxis = mChart.getAxisRight();        rightAxis.setDrawGridLines(false);*/        /*YAxis leftAxis = mChart.getAxisLeft();        leftAxis.setDrawGridLines(false);*/        XAxis xAxis = mChart.getXAxis();        xAxis.setPosition(XAxisPosition.BOTTOM);        xAxis.setDrawGridLines(false);        xAxis.setSpaceBetweenLabels(2);        CombinedData data = new CombinedData(mMonths);        data.setData(generateLineData());        data.setData(generateBarData());//data.setData(generateBubbleData());//data.setData(generateScatterData());//data.setData(generateCandleData());        // 隐藏右边的坐标轴        mChart.getAxisRight().setEnabled(false); // 隐藏左边的左边轴        mChart.getAxisLeft().setEnabled(false);                mChart.setData(data);        // 立即执行的动画,Y轴        mChart.animateY(1000);         // 刷新图表//      mChart.invalidate();}// 柱状图上面的折线图public LineData generateLineData() {        LineData d = new LineData();                ArrayList<Entry> entries1 = new ArrayList<Entry>();        for (int index = 0; index < itemcount; index++)            entries1.add(new Entry(45, index));        LineDataSet set1 = new LineDataSet(entries1, "50对比线");        // 设置颜色        set1.setColor(Color.parseColor("#00A918"));        // 线宽        set1.setLineWidth(1.0f);        // 圈颜色        set1.setCircleColor(Color.parseColor("#00A918"));        // 圆的大小        set1.setCircleSize(0f);        // 填充颜色        set1.setFillColor(Color.parseColor("#00A918"));        // 绘制立方        set1.setDrawCubic(true);        // 绘制数据        set1.setDrawValues(true);        // 字体大小        set1.setValueTextSize(10f);        // 字体颜色        set1.setValueTextColor(Color.parseColor("#00000000"));        // 轴依赖        set1.setAxisDependency(YAxis.AxisDependency.LEFT);                ArrayList<Entry> entries2 = new ArrayList<Entry>();        for (int index = 0; index < itemcount; index++)            entries2.add(new Entry(30, index));        LineDataSet set2 = new LineDataSet(entries2, "50对比线");        // 设置颜色        set2.setColor(Color.parseColor("#A12200"));        // 线宽        set2.setLineWidth(1.0f);        // 圈颜色        set2.setCircleColor(Color.parseColor("#A12200"));        // 圆的大小        set2.setCircleSize(0f);        // 填充颜色        set2.setFillColor(Color.parseColor("#A12200"));        // 绘制立方        set2.setDrawCubic(true);        // 绘制数据        set2.setDrawValues(true);        // 字体大小        set2.setValueTextSize(10f);        // 字体颜色        set2.setValueTextColor(Color.parseColor("#00000000"));        // 轴依赖        set2.setAxisDependency(YAxis.AxisDependency.LEFT);                d.addDataSet(set1);        d.addDataSet(set2);        return d;    }public BarData generateBarData() {        BarData d = new BarData();        ArrayList<BarEntry> entries = new ArrayList<BarEntry>();        for (int index = 0; index < itemcount; index++)            entries.add(new BarEntry(getRandom(100, 3), index));        BarDataSet set = new BarDataSet(entries, "Bar DataSet");        // 设置颜色        List<Integer> colorlist = new ArrayList<Integer>();        for(int i=0;i < itemcount;i++){        colorlist.add(Color.parseColor(colors[i]));        }        set.setColors(colorlist);        // 字体颜色        set.setValueTextColor(Color.parseColor("#FF8F9D"));        // 字体大小        set.setValueTextSize(10f);        d.addDataSet(set);        set.setAxisDependency(YAxis.AxisDependency.LEFT);        return d;    }public ScatterData generateScatterData() {        ScatterData d = new ScatterData();        ArrayList<Entry> entries = new ArrayList<Entry>();        for (int index = 0; index < itemcount; index++)            entries.add(new Entry(getRandom(20, 15), index));        ScatterDataSet set = new ScatterDataSet(entries, "Scatter DataSet");        set.setColor(Color.GREEN);        set.setScatterShapeSize(7.5f);        set.setDrawValues(false);        set.setValueTextSize(10f);        d.addDataSet(set);        return d;    }public CandleData generateCandleData() {        CandleData d = new CandleData();        ArrayList<CandleEntry> entries = new ArrayList<CandleEntry>();        for (int index = 0; index < itemcount; index++)            entries.add(new CandleEntry(index, 20f, 10f, 13f, 17f));        CandleDataSet set = new CandleDataSet(entries, "Candle DataSet");        set.setColor(Color.rgb(80, 80, 80));        set.setBodySpace(0.3f);        set.setValueTextSize(10f);        set.setDrawValues(false);        d.addDataSet(set);        return d;    }    public BubbleData generateBubbleData() {        BubbleData bd = new BubbleData();        ArrayList<BubbleEntry> entries = new ArrayList<BubbleEntry>();        for (int index = 0; index < itemcount; index++) {            float rnd = getRandom(20, 30);            entries.add(new BubbleEntry(index, rnd, rnd));        }        BubbleDataSet set = new BubbleDataSet(entries, "Bubble DataSet");        set.setColors(ColorTemplate.VORDIPLOM_COLORS);        set.setValueTextSize(10f);        set.setValueTextColor(Color.WHITE);        set.setHighlightCircleWidth(1.5f);        set.setDrawValues(true);        bd.addDataSet(set);        return bd;    }    private float getRandom(float range, float startsfrom) {        return (float) (Math.random() * range) + startsfrom;    }}

点击下载BarChartCombined

好了，今天写柱状图。等会写饼图和折线图！

1 1