最近因为项目需要,要用到图表制作。特此研究了mpchart,总结一下其用法。
首先使用的时候直接导入JAR包,然后定义xml文件即可,其次就是各种调用绘制了
MPChart框架的优点:
1.简单易用,所有的图标都可以当做一个普通的View在我们的布局文件中定义,与在布局中定义一个TextView没有任何的区别,使用也基本一样,通过fandViewById()即可,然后向chart中添加数据即可。
2.完善的事件冲突处理,在使用achartenginee时,发现图表一旦放在ScrollView中,则会产生事件冲突,导致ScrollView滑动不灵敏,而MPChart在事件处理上堪称完美,不仅在ScrollView中不会引起任何事件冲突,而且图表还可以夸张的放在LIstView,ViewPager中。不要太强大啊。
3.强大的可定制性,只要是你能看到的,就可以修改为你想要的样式,这一点是我选择它的主要优点。
4.一句话就可实现的动画效果,但有点小bug.但作者还在不停的更新。
很强大,必须学会使用。
下面讲一下对其代码结构的理解:
1.源码charts包中定义了所有可以绘制的图标类型,包括曲线图,饼状图,柱状图,散点图,以及混合图。chart主要处理图表的交互事件,动画,组件的绘制等。
2.源码components包中定义了图表中所有的组件,包括x轴(XAxis),y轴(YAxis),表头(Lenged),标识(MarkerView).
3.源码data包中则是不同类型的图表需要不同的数据类型。
4.源码listener包中定义了所有的事件类型。
这几个包是我们需要知道的,通过chart包中的任意一个实例,可以进行我们需要的任何定制。例如:想要定制X轴的数据或者样式,
XAxis xAxis = mChart.getXAxis();
xAxis.setPosition(); //定制X轴是在图表上方还是下方。
xAxis.setLabelsToSkip(); //定制X轴Label间隔。
xAxis.setAvoidFirstLastClipping(); //定制X轴起点和终点Label不能超出屏幕。
Y轴的操作类似。
Lenged l = mChart.getLenged();
l.setEnabled(); //定制表头是否显示。
l.setForm(); //定制表头样式,是circle,square,还是line
等等,只要是你能看到的样式,都可以定制,你没看到的也可以定制。下面列贴出第一个我定制的图的源码:
lineView = new LineChart(this);lineView.setDescription("");lineView.setScaleEnabled(false);lineView.getAxisRight().setEnabled(true);lineView.setDrawGridBackground(false);lineView.setTouchEnabled(false); //设置图表滑动是否可用lineView.getLegend().setEnabled(false); //设置表头不可用lineView.setHardwareAccelerationEnabled(true);ArrayList<Entry> yRawData = new ArrayList<Entry>();ArrayList<String> xRawDatas = new ArrayList<String>();int index = 0;for (int i = array.length() - 1; i >= 0; i--){if (array.get(i) != null){JSONObject jsonObj = (JSONObject) array.get(i);yRawData.add(new Entry(Float.parseFloat(jsonObj.optString("profitRate")), index));xRawDatas.add(DateFormatHelp.formatDateToNeededFormat(jsonObj.optString("dt").concat("000"),DateFormat.DATE_1));index++;initMaxMin(Float.parseFloat(jsonObj.optString("profitRate")));}}/** * x轴样式设置 */XAxis xAxis = lineView.getXAxis();xAxis.setPosition(XAxisPosition.BOTTOM);// 设置x轴在底部显示xAxis.setAvoidFirstLastClipping(true);xAxis.setSpaceBetweenLabels(0); // x轴间距xAxis.setTextColor(resource.getColor(R.color.grey_low_txt));xAxis.setAxisLineColor(resource.getColor(R.color.color_dddddd));xAxis.setDrawGridLines(true);//设置是否显示横轴表格xAxis.setGridColor(resource.getColor(R.color.color_dddddd));//设置x轴表格颜色/** * y轴样式设置 */YAxis leftAxis = lineView.getAxisLeft();leftAxis.setStartAtZero(false);leftAxis.setLabelCount(yAxislabelNum, true);//设置Y轴Label数量leftAxis.setDrawLimitLinesBehindData(true);leftAxis.setTextColor(resource.getColor(R.color.grey_low_txt)); //设置左侧Y轴Label颜色leftAxis.setAxisLineColor(resource.getColor(R.color.color_dddddd)); //设置左侧Y轴颜色leftAxis.setDrawGridLines(true); //设置显示Y轴表格线leftAxis.setGridColor(resource.getColor(R.color.color_dddddd)); //设置Y轴表格线颜色
leftAxis.setAxisMaxValue(yAxisMax + yAxisGap); // 设置Y轴最大值leftAxis.setAxisMinValue(yAxisMin - yAxisGap);// 设置Y轴最小值YAxis rightAxis = lineView.getAxisRight();rightAxis.setDrawLabels(false); //设置右侧Y轴是否显示 LabelrightAxis.setDrawGridLines(false);rightAxis.setAxisLineColor(resource.getColor(R.color.color_dddddd));/** * 曲线样式设置 */LineDataSet set = new LineDataSet(yRawData, "");set.setDrawCubic(true);//设置曲线样式为cubieset.setCubicIntensity(0.2f);//置曲线顺滑度set.setLineWidth(Util.dip2px(this, 1.0f)); //射置曲线widthset.setColor(resource.getColor(R.color.color_fd4634));//射置曲线颜色set.setCircleSize(Util.dip2px(this, 2.0f));//射置曲线上圆点大小set.setCircleColor(resource.getColor(R.color.color_fd4634));//射置曲线上圆点颜色set.setFillColor(resource.getColor(R.color.color_fd4634));//射置曲线填充颜色set.setFillAlpha(128);//射置曲线填充颜色透明度set.setDrawFilled(true);//设置曲线填冲是否启用set.setDrawValues(false);//设置是否显示点值LineData data = new LineData(xRawDatas, set);lineView.setData(data);//绑定数据到图表lineView.invalidate();LayoutParams params = new LayoutParams(LayoutParams.MATCH_PARENT, Util.dip2px(this, 150));contentLayout.addView(lineView, params);
学会使用这个图表框架后,效率可以大大的提高,普通的图表需求也不用在担心了。