最近项目中需要集成折线图、饼状图、柱状图等各类图表，于是就去网上搜寻了一下三方的框架，看到大家用的比较多的就是MPAndroidChart（github上星赞第一）、HelloChart（github上星赞第二），还有就是百度官方推出的Echarts，但是Echarts在Android中植入有些特殊，需要用到WebView结合html进行展示，我们留着下篇文章里介绍，今天我们来谈谈HelloCharts，为什么当时在选择的时候没有选择星赞排行第一的MPAndroidChart呢？原因很简单，就是在对比二者图表的样式时，我觉得HelloCharts更加好看，不过后来因为项目的需求越来越多，HelloCharts已不能满足诸如码表、横向柱状图、复杂标签饼状图的需求，所以又不得不在项目中引入了Echarts，但HelloCharts作为简单图标的展示还是值得推荐的，因为使用简单、加载迅速、看着舒服。。。
先贴出github上的地址吧：点击打开链接，两种引入方式，compile和jar包，根据个人喜好引入就行
今天我们就说一下常用的三种图表的使用方法：折线图、饼状图和柱状图
折线图：LineChartView，使用很简单，直接在对应的xml文件中引入就行：
<lecho.lib.hellocharts.view.LineChartView android:id="@+id/line_chart" android:layout_width="match_parent" android:padding="20dp" android:layout_height="200dp"/>
接着我们给出一段json数据来模拟网络请求回来的数据，绘制出我们的折线图：
这里我们想要绘制出一个以时间为x轴，订单数为y轴的折线图，用来观察某一时间段内订单数量的变化。。。拿到json数据后我们就要开始解析，这里我们用到Gson来解析：
LineData使我们定义的bean类，用来存放属性time和orders，然后用mDataList接收解析返回的数据，接着就是用我们拿到的数据来绘制折线图就可以了
private void initLineChartView() { getChartData(); //订单数（y轴数据） List<PointValue> pointValues = new ArrayList<>(); for (int i = 0; i < mDataList.size(); i++) { pointValues.add(new PointValue(mDataList.get(i).getTime(), mDataList.get(i).getOrders())); } List<Line> lines = new ArrayList<>(); //初始化一条折线 Line line = new Line(pointValues); line.setColor(Color.RED);//设置折线颜色 line.setShape(ValueShape.CIRCLE);//折线图上每个数据点的形状（一共有三种） line.setStrokeWidth(2);//设定折线的粗细 line.setPointRadius(4);//折线图上数据点的半径 lines.add(line); LineChartData data = new LineChartData(); data.setLines(lines); //x轴 Axis axisX = new Axis(); axisX.setTextSize(10);//x轴字体大小 axisX.setTextColor(Color.GRAY);//字体颜色 data.setAxisXBottom(axisX);//设定x轴在底部 //y轴 Axis axisY = new Axis(); axisX.setTextSize(10);//x轴字体大小 axisX.setTextColor(Color.GRAY);//字体颜色 data.setAxisYLeft(axisY);//设定y轴在左侧 mLineChartView.setLineChartData(data); mLineChartView.setOnValueTouchListener(this); }PointValue可以将获取的坐标轴数据进行封装，构造函数分别为x轴，y轴两个参数，可以看到我们需要一条折线的话就直接new一个Line对象，然后添加到List<Line>中，所以我们需要几条折线就直接new几个Line对象就行，然后分别对不同的Line对象设置不同的属性，关于属性，我们这里只是做了几个简单的设定，具体的有很多，没有必要全部都设置上去，大家感兴趣的话可以自己研究下。。。运行以后的效果图：
接下来再来看看饼状图吧，鉴于折线图的数据来源已经使用过json了，那饼状图和柱状图的数据就直接本地设置随机数了，毕竟手写一个json数据还是挺麻烦的，哈哈。。。
饼状图：PieChartView，同样的直接在我们的xml中引入就行：
<lecho.lib.hellocharts.view.PieChartView android:id="@+id/pie_chart" android:layout_width="300dp" android:layout_height="300dp" android:padding="25dp"/>
然后在我们的代码中进行初始化：
private void initPieChartView() { int numValues = 6;//六个栏目，分成六块 List<SliceValue> values = new ArrayList<>(); for (int i = 0; i < numValues; i++) { SliceValue sliceValue = new SliceValue((float) Math.random() * 30 + 15, ChartUtils .pickColor()); values.add(sliceValue); } PieChartData pieChartData=new PieChartData(values); pieChartData.setHasLabels(true);//显示标签，默认是不显示的 pieChartData.setHasLabelsOutside(false);//标签位置在外面 pieChartData.setHasCenterCircle(false);//是否显示圆环形饼状图 mPieChartView.setPieChartData(pieChartData); }饼状图的属性就少了很多了，毕竟它不像折线图那样有坐标轴，也不支持缩放，所以为了更好的显示，我们一般都设定它的宽高相等，SliceValue为饼状图中占比扇形的数据模型，PieChartData为饼状图的数据模型，可以设置相关属性来控制饼状图是否显示标签、标签位置、是否显示圆环形等等（详细的大家自己下去可以研究研究），不过这个地方的标签样式及文字好像法自定义，反正我没有找到可以改变标签样式的方法，如果有人知道了还请在下方留言告知，这也就是为什么后来我又引入了Echarts来实现比较复杂的饼状图了。。。运行以后的效果图：
当然作为简单的饼状图实现还是个不错的选择的。。。
柱状图：ColumnChartView，首先是xml：
<lecho.lib.hellocharts.view.ColumnChartView android:id="@+id/column_chart" android:layout_width="match_parent" android:layout_height="300dp" android:padding="15dp"/>
然后是代码：
private String[] columnNames={"栏目1","栏目2","栏目3","栏目4","栏目5","栏目6"} private void initColumnChartView() { int numColumns = 6;//列数 int numSubcolumns = 1;//每一列柱状图的个数 List<Column> columns = new ArrayList<>(); List<SubcolumnValue> subcolumnValues; List<AxisValue> axisValues = new ArrayList<>(); for (int i = 0; i < numColumns; i++) { subcolumnValues = new ArrayList<>(); for (int j = 0; j < numSubcolumns; j++) { subcolumnValues.add(new SubcolumnValue((float) Math.random() * 30 + 15, ChartUtils.pickColor())); } Column column = new Column(subcolumnValues); column.setHasLabels(true);//是否显示标注 column.setHasLabelsOnlyForSelected(false);//是否点击圆柱才能显示数据标注 columns.add(column); //给x轴坐标设置描述 axisValues.add(new AxisValue(i).setLabel(columnNames[i])); } ColumnChartData columnChartData=new ColumnChartData(columns); //x轴 Axis axisX=new Axis(); axisX.hasLines(); axisX.setTextColor(Color.GRAY); axisX.setValues(axisValues); axisX.setHasTiltedLabels(true);//标题是否倾斜着显示 //y轴 Axis axisY=new Axis(); axisY.hasLines(); axisY.setTextColor(Color.GRAY); axisY.setName("栏目分析"); axisY.setHasLines(true); columnChartData.setFillRatio(0.8f);//设置组与组之间的间隔比率，取值范围0-1,1表示不留任何间隔 columnChartData.setValueLabelTextSize(8);//标签文字大小 columnChartData.setAxisXBottom(axisX); columnChartData.setAxisYLeft(axisY); mColumnChartView.setColumnChartData(columnChartData); }柱状图的底部文字可以设置倾斜状态来减小文字过长产生的影响，运行效果图：
至此，三种常见的图表样式和用法就介绍完了，其实用法很简单，毕竟HelloCharts已经帮我们封装得很好了，还有气泡图（BubbleChartView）、联合折线和柱状图的图表（ComboLineColumnChartView）等，大家有兴趣可以自己研究一下，下一篇我会介绍一个更加强大的图表工具Echarts，敬请期待！
附上Demo下载地址：HelloChartDemo下载