手把手教你使用MPAndroidChart实现柱状图，饼状图和线

Android程序员面试宝典

本文配套视频：

http://www.toutiao.com/i6431290280183333378/
http://www.toutiao.com/i6431289872253714945/

项目总地址：https://github.com/open-android/Android

• 一个非常强大的用于数据统计展示的View,支持多样的折线图，柱状图，饼状图，网状图，点状图等等，基本上可以满足我们所有的需求。

• github地址：https://github.com/PhilJay/MPAndroidChart

• 原理(该类库太庞大，只进行简单分析)：

• 有很多实现类，如LineChart(线状图),BarChart(柱状图),PieChart(饼状图)等，他们都重写了onDraw方法，并按照如下步骤绘制出内容：

//1.绘制背景
drawGridBackground(canvas);
//2.绘制X，y轴线
mXAxisRenderer.renderAxisLine(canvas);
mAxisRendererLeft.renderAxisLine(canvas);
mAxisRendererRight.renderAxisLine(canvas);
//3.绘制网格线
mXAxisRenderer.renderGridLines(canvas);
mAxisRendererLeft.renderGridLines(canvas);
mAxisRendererRight.renderGridLines(canvas);
//4.绘制图形数据,如绘制线，绘制柱形，绘制饼状
mRenderer.drawData(canvas);
//5.绘制单位标签
mXAxisRenderer.renderAxisLabels(canvas);
mAxisRendererLeft.renderAxisLabels(canvas);
mAxisRendererRight.renderAxisLabels(canvas)
//6.绘制图形的数值
mRenderer.drawValues(canvas);
//7.绘制mark标记
drawMarkers(canvas);
//8.绘制表格描述说明
drawDescription(canvas);

用法如下(只拿线状图，柱状图，饼状图举例)：

如何使用线状图:

mChart = (LineChart) findViewById(R.id.line_chart);
//设置没有数据时候展示的文本
mChart.setNoDataText("目前木有数据哦");
//1.给Chart设置数据
mChart.setData(getLineData());
//2.设置y轴的取值范围
YAxis axisLeft = mChart.getAxisLeft();
//设置y轴最小值
axisLeft.setAxisMinValue(0);
//设置y轴最大值
axisLeft.setAxisMaxValue(50);
//3.设置去掉右边的y轴线
YAxis axisRight = mChart.getAxisRight();
axisRight.setEnabled(false);
//4.设置是否启用x轴线
XAxis xAxis = mChart.getXAxis();
xAxis.setEnabled(true);//显示x轴线
//5.设置表格描述信息
mChart.setDescription("表格描述");
//6.设置是否绘制表格背景
mChart.setDrawGridBackground(true);
//设置表格网格背景的颜色
//mChart.setGridBackgroundColor(Color.BLUE);
//7.设置绘制动画的时间
mChart.animateXY(3000,3000);

给线状图准备数据，需要构造LineDataSet,每一条线的数据就是一个LineDataSet对象, 该对象可以设置线的颜色，线条的标签，粗细等

public LineData getLineData() {
    int maxX = 10;
    List<Entry> entryList = new ArrayList<>();
    List<Entry> entryList2 = new ArrayList<>();
    for (int i=0;i<maxX; i++){
        //每个entry相当于线条上面的一个点
        Entry entry = new BarEntry(i*5,i);
        entryList.add(entry);
        Entry entry2 = new BarEntry(i*6+5,i);
        entryList2.add(entry2);
    }
    //创建LineDataSet对象，表示一条线的数据
    LineDataSet dataSet = new LineDataSet(entryList,"Line1");
    LineDataSet dataSet2 = new LineDataSet(entryList2,"Line2");
    //设置线条颜色和宽度
    dataSet.setLineWidth(4);
    dataSet.setColor(Color.RED);
    //dataSet.setDrawCircleHole(false);//是否绘制空心圆
    //是否绘制圆形
    dataSet.setDrawCircles(false);//不绘制线条上面的圆
    //创建集合，存储所有线条数据对象
    List<ILineDataSet> list = new ArrayList<>();
    //存放一条线的数据
    list.add(dataSet);
    list.add(dataSet2);
    //生成x轴的数据
    List<String> xVals = ChartData.generateXVals(0, maxX);
    LineData lineData = new LineData(xVals,list);
    return lineData;
}

如何使用柱状图：

 //创建条形数据对象
BarChart barChart = new BarChart(this);
setContentView(barChart);
//设置条形数据
barChart.setData(getBarData());
//设置描述
barChart.setDescription("2016行业薪资比较");
//设置绘制bar的阴影
barChart.setDrawBarShadow(true);
//设置绘制的动画时间
barChart.animateXY(3000,3000);

如何给柱状图设置数据,主要是构造BarDataSet对象，它需要一个装有BarEntry的集合， 每一个柱形都是一个BarEntry:

public BarData getBarData() {
int maxX = 10;
//创建集合，存放每个柱子的数据
List<BarEntry> list = new ArrayList<>();
List<BarEntry> list2 = new ArrayList<>();
for (int i=0;i<maxX;i++){
    //一个BarEntry就是一个柱子的数据对象
    BarEntry barEntry = new BarEntry(i+5,i);
    list.add(barEntry);
    BarEntry barEntry2 = new BarEntry(i+3,i);
    list2.add(barEntry2);
}
//创建BarDateSet对象，其实就是一组柱形数据
BarDataSet barSet = new BarDataSet(list,"Android");
BarDataSet barSet2 = new BarDataSet(list2,"iOS");
//设置柱形的颜色
barSet.setColor(Color.BLUE);
//设置是否显示柱子上面的数值
barSet.setDrawValues(false);
//设置柱子阴影颜色
barSet.setBarShadowColor(Color.GRAY);
//创建集合，存放所有组的柱形数据
List<IBarDataSet> dataSets = new ArrayList<>();
dataSets.add(barSet);
dataSets.add(barSet2);
BarData barData = new BarData(ChartData.generateXVals(0,maxX),dataSets);
return barData;

如何使用饼状图:

PieChart pieChart = new PieChart(this);
setContentView(pieChart);

//设置饼状图数据
pieChart.setData(getPieData());

//设置描述
pieChart.setDescription("胡萝卜维生素成分比例");
pieChart.setDescriptionTextSize(20);

//设置中心说明文字
pieChart.setCenterText("中心说明文字");
pieChart.setCenterTextSize(20);
pieChart.setCenterTextColor(Color.RED);

pieChart.animateXY(3000,3000);

如何给饼状图设置数据,主要构造PieData对象，它需要一个PieDataSet对象，set对象是装满Entry的集合，封装的是饼状百分比和位置的映射：

public PieData getPieData() {
    ArrayList<Entry> list = new ArrayList<>();
    for (int i=0;i<3;i++){
        //一个Entry就是一个饼块
        Entry entry = new Entry(i+2,i);
        list.add(entry);
    }

    //创建一组饼块的数据
    PieDataSet pieDataSet = new PieDataSet(list,"标签");

    //设置饼块的间距
    pieDataSet.setSliceSpace(4);
    //设置饼快颜色
    pieDataSet.setColors(new int[]{Color.RED,Color.GREEN,Color.BLUE});

    //创建x轴
    ArrayList<String> xList = new ArrayList<>();
    xList.add("维生素A");
    xList.add("维生素B");
    xList.add("维生素C");

    PieData pieData = new PieData(xList,pieDataSet);
    return pieData;
}

• 欢迎关注微信公众号、长期为您推荐优秀博文、开源项目、视频

• 微信公众号名称：Android干货程序员

•