├── README.md
└── mpandroid.mkd
/README.md:
--------------------------------------------------------------------------------
1 | 由于最近进行android图表的开发,需要学习图表的使用,顺便翻译了一下mpandroidchart这个开源库的wiki,在此感谢作者。
2 | 参考资料:
3 | https://github.com/PhilJay/MPAndroidChart
4 | https://github.com/PhilJay/MPAndroidChart/wiki
5 | http://blog.csdn.net/guijiaoba/article/details/41444697
6 |
--------------------------------------------------------------------------------
/mpandroid.mkd:
--------------------------------------------------------------------------------
1 | ###开始
2 | ####安装
3 | 为了使用 LineChart, BarChart, ScatterChart, CandleStickChart, PieChart or RadarChart,像下面一样定义它在 .xml中:
4 |
5 |
9 |
10 | 然后通过下面的方式从你的Activity, Fragment诸如此类的东西中检索它:
11 |
12 | LineChart chart = (LineChart) findViewById(R.id.chart);
13 |
14 | 或者创建它在代码中(然后增加它到一个布局中):
15 |
16 | LineChart chart = new LineChart(Context);
17 |
18 | RelativeLayout rl = (RelativeLayout) findViewById(R.id.relativeLayout);
19 | rl.add(chart);
20 |
21 | ####更新
22 |
23 | * invalidate():在图表图表项目中调用这个方法将重新刷新屏幕。
24 |
25 | ####数据记录
26 |
27 | * setLogEnabled(boolean enabled):设置这个为真将激活图表项目中的logcat输出
28 |
29 | ####通用图表项目样式
30 |
31 | 下面是一些你能直接使用在图表项目中的通用的样式方法。
32 |
33 | * setBackgroundColor(int color):设置背景颜色这将覆盖整个图表项目视图。另外,一个背景颜色能被设置在.xml的布局文件中
34 | * setDescription(String desc):设置一个描述文本出现在图表的右下角。
35 | * setDescriptionColor(int color): 设置描述文本的颜色。
36 | * setDescriptionPosition(float x, float y): 设置一个自定义坐标用于定位描述文本在屏幕上的像素。
37 | * setDescriptionTypeface(Typeface t): 设置采用Typeface来绘制买描述文本。
38 | * setDescriptionTextSize(float size): 设置描述文本的像素尺寸,最小6f,最大16f。
39 | * setNoDataTextDescription(String desc): 设置图表为空时出现的文本。
40 | * setDrawGridBackground(boolean enabled): 如果打开,背景矩形将出现在已经画好的绘图区域的后边。
41 | * setGridBackgroundColor(int color): 设置网格背景颜色。
42 | * setDrawBorders(boolean enabled):打开或关闭绘制的图表边框。(环绕图表的线)
43 | * setBorderColor(int color):设置图表边框线的颜色。
44 | * setBorderWidth(float width): 设置图表边框线的宽度。
45 | * setMaxVisibleValueCount(int count): 设置一个数字用于图表中显示绘制的值标签。这仅作用于当setDrawValues()允许时。
46 |
47 | ###与图表交互
48 |
49 | 这个库允许你完全自定义与图表视图触摸交互的各种情况以及对交互其作用的回调方法。
50 |
51 | ####打开/关闭交互
52 |
53 | * setTouchEnabled(boolean enabled): 允许你打开或者关闭与图表的所有触摸交互的情况。
54 | * setDragEnabled(boolean enabled): 打开或关闭对图表的拖动。
55 | * setScaleEnabled(boolean enabled):打开或关闭对图表所有轴的的缩放。
56 | * setScaleXEnabled(boolean enabled): 打开或关闭x轴的缩放
57 | * setScaleYEnabled(boolean enabled): 打开或关闭y轴的缩放。
58 | * setPinchZoom(boolean enabled): 如果设置为true,挤压缩放被打开。如果设置为false,x和y轴可以被单独挤压缩放。
59 | * setHighlightEnabled(boolean enabled): 如果设置为true,在图表中通过触屏高亮或选择值是可能的。
60 | * setHighlightPerDragEnabled(boolean enabled): 设置为true时允许高亮显示拖动结束的对象在缩放到最下时。默认:true
61 | * setHighlightIndicatorEnabled(boolean enabled): 如果设置为true, 指标线(或杆)将展示被选择的线的绘制的值。
62 |
63 | ####通过编程自动高亮
64 |
65 | * highlightValues(Highlight[] highs): 突出显示给定索引处的值在被给定的数据集中。提供null或空的数组将取消所有的高亮。
66 | * highlightValues(Highlight[] highs): 突出显示给定xIndex为索引在被给定的数据集中。提供-1时将去取消所有的高亮
67 | * getHighlighted():返回一个Highlight[]的数组包含关于所有高亮入口的信息,它们的x-索引和数据集的索引。
68 |
69 | 编程自动高亮将不产生OnChartValueSelectedListener回调
70 |
71 | ####选择回调
72 |
73 | 这个库提供了大量的监听回调在交互后。其中一个是OnChartValueSelectedListener,在触屏高亮值的时候进行回调。
74 |
75 | public interface OnChartValueSelectedListener {
76 | /**
77 | * Called when a value has been selected inside the chart.
78 | *
79 | * @param e The selected Entry.
80 | * @param dataSetIndex The index in the datasets array of the data object
81 | * the Entrys DataSet is in.
82 | * @param h the corresponding highlight object that contains information
83 | * about the highlighted position
84 | */
85 | public void onValueSelected(Entry e, int dataSetIndex, Highlight h);
86 | /**
87 | * Called when nothing has been selected or an "un-select" has been made.
88 | */
89 | public void onNothingSelected();
90 | }
91 |
92 | 让你的类接收回调实现这个接口并设置它作为图表的一个listener
93 |
94 | chart.setOnChartValueSelectedListener(this);
95 |
96 | ####手势回调
97 |
98 | OnChartGestureListener将允许你对图表上的手势作出反应:
99 |
100 | public interface OnChartGestureListener {
101 |
102 | /**
103 | * Callbacks when the chart is longpressed.
104 | *
105 | * @param me
106 | */
107 | public void onChartLongPressed(MotionEvent me);
108 |
109 | /**
110 | * Callbacks when the chart is double-tapped.
111 | *
112 | * @param me
113 | */
114 | public void onChartDoubleTapped(MotionEvent me);
115 |
116 | /**
117 | * Callbacks when the chart is single-tapped.
118 | *
119 | * @param me
120 | */
121 | public void onChartSingleTapped(MotionEvent me);
122 |
123 | /**
124 | * Callbacks then a fling gesture is made on the chart.
125 | *
126 | * @param me1
127 | * @param me2
128 | * @param velocityX
129 | * @param velocityY
130 | */
131 | public void onChartFling(MotionEvent me1, MotionEvent me2, float velocityX, float velocityY);
132 | }
133 |
134 | 让你的类接收回调实现这个接口并设置它作为图表的一个listener
135 |
136 | chart.setOnChartGestureListener(this);
137 |
138 | ###The Axis(AxisBase)
139 | 此页关注AxisBase类,他是XAxis和YAxis的基类。
140 |
141 | 下面提及的方法在两个轴上都能使用。
142 |
143 | 这个轴类允许对下面的组件或部分指定具体的样式:
144 |
145 | * 标签(绘制时垂直对齐),包括轴的描述值。
146 | * 坐标轴,它直接被绘制平行于标签旁边。
147 | * 网格线,每个来自水平方向的标签轴。
148 | * LimitLines,允许呈现具体的信息,像边框或者限制。
149 |
150 | ####控制轴的哪部分应该被绘制
151 |
152 | * setEnabled(boolean enabled):设置轴的打开或者关闭。如果关闭,坐标轴不会被绘制。
153 | * setDrawAxisLine(boolean enabled): 设置为true,如果线在轴的侧面应该被画,否则不。
154 | * setDrawGridLines(boolean enabled): 设置为true打开绘制网格线对于轴来说。
155 | * setDrawLabels(boolean enabled):设置为true打开绘制轴的标签。
156 |
157 | ####修改轴线样式
158 |
159 | * setTextColor(int color): 设置轴标签的颜色。
160 | * setTextSize(float size):设置轴标签的字体大小以dp为单位。
161 | * setTypeface(Typeface tf):设置轴标签的自定义Typeface
162 | * setGridColor(int color): 设置这个轴的网格线颜色。
163 | * setGridLineWidth(float width):设置轴的网格线宽度。
164 | * setAxisLineColor(int color):设置此轴的坐标轴的颜色。
165 | * setAxisLineWidth(float width): 设置此轴的坐标轴的宽度。
166 | * enableGridDashedLine(float lineLength, float spaceLength, float phase): 激活网格线虚线模式,有点像"- - - - - -"。"lineLength"控制短线条的长度,"spaceLength"控制两段线之间的间隔长度,"phase"控制开始的点。
167 |
168 | ####限制线
169 |
170 | 两个轴支持LimitLines的调用允许呈现专用信息,像边界或者约束。LimitLines添加到YAxis会在水平方向绘制,垂直方向绘制需要添加到XAxis。下面是你如何增加和移除LimitLines从YAxis:
171 |
172 | * addLimitLine(LimitLine l): 添加一个新的LimitLine到轴上。
173 | * removeLimitLine(LimitLine l): 从轴上移除一个指定的LimitLine。
174 | 多个方法也适用于添加或者移除。
175 | * setDrawLimitLinesBehindData(boolean enabled): 允许控制Z轴顺序在LimitLines和真实数据之间。如果设置true,LimitLines绘制在真实数据后面,否则在上面,默认:false
176 |
177 | 限制线(类 LimitLine)(也称为指示线)是明确和简单的线能给使用者提供额外的信息。
178 |
179 | 这是一个例子,你的图表可以展示已经用应用登录的用户的多种形式的血压测量结果。为了通知用户心动血压超过140mmhg被考虑会有健康风险,你可以增加一个LimitLine在140处来提供那条信息。
180 |
181 | 例子:
182 | YAxis leftAxis = chart.getAxisLeft();
183 |
184 | LimitLine ll = new LimitLine(140f, "Critical Blood Pressure");
185 | ll.setLineColor(Color.RED);
186 | ll.setLineWidth(4f);
187 | ll.setTextColor(Color.BLACK);
188 | ll.setTextSize(12f);
189 | // .. and more styling options
190 |
191 | leftAxis.addLimitLine(ll);
192 |
193 | ###XAxis (XLabels)
194 |
195 | 这个XAxis是AxisBase的子类
196 |
197 | XAxis类(在2.0.0之前是XLabels),是一切与水平轴相关的数据和信息的容器。每个 Line-, Bar-, Scatter CandleStickChart和 RadarChart 都有一个XAxis对象,XAxis将显为一个ArrayList 或者 String[]和交给ChartData对象的是什么。
198 | XAxis类允许对下面的组件或部分指定具体的样式:
199 |
200 | * 标签(绘制时水平对齐),包括轴的描述值,这些包括提供的数据对象你为图表设置的(x轴的值)
201 | * 坐标轴,它直接被绘制平行于标签旁边。
202 | * 网格线,每个来自垂直方向的标签轴。
203 |
204 | 为了取得XAxis类的实例,调用下面的方法:
205 |
206 | XAxis xAxis = chart.getXAxis();
207 |
208 | ####自定义轴线的值
209 |
210 | * setAdjustXLabels(boolean enabled):如果被设置为true,x轴条目将依赖于它自己在进行缩放的时候。如果设置为false,x轴条目将总是保持相同。
211 | * setAvoidFirstLastClipping(boolean enabled):如果设置为true,图表将避免第一个和最后一个标签条目被减掉在图表或屏幕的边缘。
212 | * setSpaceBetweenLabels(int characters): 设置x轴标签之间的空间字符数,默认是4个。
213 | * setPosition(XAxisPosition pos):设置XAxis应该出现的位置。可以选择TOP,BOTTOM,BOTH_SIDED,TOP_INSIDE或者BOTTOM_INSIDE。
214 |
215 | 例子:
216 |
217 | XAxis xAxis = chart.getXAxis();
218 | xAxis.setPosition(XAxisPosition.BOTTOM);
219 | xAxis.setTextSize(10f);
220 | xAxis.setTextColor(Color.RED);
221 | xAxis.setDrawAxisLine(true);
222 | xAxis.setDrawGridLines(false);
223 | // and more...
224 |
225 |
226 | ###YAxis(YLabels)
227 |
228 | YAxis类(在2.0.0之前是Ylabels),是一切与垂直轴相关的数据和信息的容器。每个 Line-, Bar-, Scatter or CandleStickChart都有一个左和一个右的YAxis对象,分别负责左边或者右边。RadarChart只有一个YAxis。默认,图表的所有轴在被绘制的时候都被绘制。
229 | YAxis类允许对下面的组件或部分指定具体的样式:
230 |
231 | * 标签(绘制时垂直对齐),包括轴的描述值。
232 | * 坐标轴,它直接被绘制平行于标签旁边。
233 | * 网格线,每个来自水平方向的标签轴。
234 | * LimitLines,允许呈现具体的信息,像边框或者限制。
235 |
236 | 为了取得YAxis类的实例,调用下面的方法:
237 |
238 | YAxis leftAxis = chart.getAxisLeft();
239 | YAxis rightAxis = chart.getAxisRight();
240 |
241 | YAxis leftAxis = chart.getAxis(AxisDependency.LEFT);
242 |
243 | YAxis yAxis = radarChart.getYAxis(); // this method radarchart only
244 |
245 | 在运行时刻,使用 public AxisDependency getAxisDependency()来确定图表轴呈现的边。
246 |
247 | ####自定义轴线的值
248 |
249 | * setStartAtZero(boolean enabled):如果这个打开,轴线总是有最小值0,无论什么类型的图表被展示。
250 | * setAxisMaxValue(float max):设置一个自定义的最大值为这条轴,如果设置了,这个值将不会依赖于提供的数据自动计算。
251 | * resetAxisMaxValue(): 调用这个将撤销以前设置的最大值。这意味着,你将再次允许轴自动计算它的最大值。
252 | * setAxisMinValue(float min): 设置一个自定义的最小值。如果设置了,这个值将不会依赖于你提供的数据进行自动计算。
253 | * resetAxisMinValue():调用这个方法撤销以前设置的最小值。这意味着,你将再次允许轴自动计算他的最小值。
254 | * setInverted(boolean enabled): 如果设置为true,这个轴将被反向,那意味着最高出的将到底部,最低部的到顶端。
255 | * setSpaceTop(float percent):设置在图表上最高处的值相比轴上最高值的顶端空间(总轴范围的百分比)
256 | * setSpaceBottom(float percent): 设置在图表上最低处的值相比轴上最低处值的底部空间(总轴范围的百分比)
257 | * setShowOnlyMinMax(boolean enabled): 如果打开了,这个轴将展示出它的最小值和最大值。这将忽略或者覆盖定义过的label-count。
258 | * setPosition(YAxisLabelPosition pos):设置轴标签应该被绘制的位置。INSIDE_CHART或者OUTSIDE_CHART中的一个。
259 | 自定义影响轴的数值范围应该在图表被设置数据之前应用。
260 |
261 | 代码例子:
262 |
263 | YAxis yAxis = mChart.getAxisLeft();
264 | yAxis .setTypeface(...); // set a different font
265 | yAxis .setTextSize(12f); // set the textsize
266 | yAxis.setValueFormatter(new MyValueFormatter());
267 | //... and more
268 |
269 | ###设置数据
270 |
271 | 如果你想增加值(数据)到图表中,它必须用下面这个方法。
272 |
273 | public void setData(ChartData data) { ... }
274 |
275 | 基类ChartData类封装了所有的数据和信息那是在图表绘制期间需要的。对于每种类型的图表,ChartData的不同的子类(例如LineData)存在应该被用来为图表设置数据。在构造函数中,你能移交数据到ArrayList模板,并且作为值来显示,另外字符串的ArrayList将描述在x轴的标签。例如类LineData(继承自ChartData),用来增加数据到LineChart:
276 |
277 | // this is just one of many constructors
278 | public LineData(ArrayList xVals, ArrayList sets) { ... }
279 |
280 | 因此,什么是DataSet为什么需要它?那实际上相当简单。在图表内互相在一起的数据集对象表示一组条目(数据条目类型)。它被设计用来区分在图表中逻辑上不同组的值。对于每种类型的图表,扩展数据集 (例如 LineDataSet) 的不同对象存在允许特定的样式。
281 | 作为一个例子,你可能想用LineChart展示两个不同公司的季度收入在一年中的。在这种情况下,建议你创建两个不同的LineDataSet对象,每个包含四个值(每个代表一个季度)。用ArrayList来描述x轴上的标签,你可以简单的提供四个字符串“1.Q”,“2.Q”,“3.Q”,“4.Q"
282 | 当然,你只提供一个包含两个公司8个值的LineDataSet对象也是可以的。
283 |
284 | 那么怎么设置一个LinDataSet对象呢?
285 |
286 | public LineDataSet(ArrayList yVals, String label) { ... }
287 |
288 | 在查找构造函数时(不同的构造函数可用),它是可见的,LinedataSet需要一个ArrayList条目类型和一个字符串用来描述LineDataSet以及用于图表标签。更进一步这个标签能被用来寻找在LineData对象中除LineDataSet对象外的其他LineDataSet。
289 | ArrayList条目类型封装了图表的所有值。一个Entry对象除了封装它周围的值还保存了它自己的值,它的位置在x轴(在LineData对象的字符串类型的ArrayList里面值的索引被映射):
290 |
291 | public Entry(float val, int xIndex) { ... }
292 |
293 | 把它们放在一起(例如两个公司 一年里的季度收入):
294 | 首先,创建Entry的类型的列表保存你的值:
295 |
296 | ArrayList valsComp1 = new ArrayList();
297 | ArrayList valsComp2 = new ArrayList();
298 |
299 | 然后,填充列表用Entry对象。确保entry对象包含正确的x轴的索引(当然,一个循环能在这儿被使用,在这种情况下,循环计数器可以为x轴的索引)。
300 |
301 | Entry c1e1 = new Entry(100.000f, 0); // 0 == quarter 1
302 | valsComp1.add(c1e1);
303 | Entry c1e2 = new Entry(50.000f, 1); // 1 == quarter 2 ...
304 | valsComp1.add(c1e2);
305 | // and so on ...
306 |
307 | Entry c2e1 = new Entry(120.000f, 0); // 0 == quarter 1
308 | valsComp2.add(c2e1);
309 | Entry c2e2 = new Entry(110.000f, 1); // 1 == quarter 2 ...
310 | valsComp2.add(c2e2);
311 | //...
312 |
313 | 现在我们有了Entry对象的列表,LineDataSet对象可以被创建:
314 |
315 | LineDataSet setComp1 = new LineDataSet(valsComp1, "Company 1");
316 | LineDataSet setComp2 = new LineDataSet(valsComp2, "Company 2");
317 |
318 | 但是还没完,我们创建一个DataSets的列表和一个x轴条目的列表并且构建我们的ChartData对象:
319 |
320 | ArrayList dataSets = new ArrayList();
321 | dataSets.add(setComp1);
322 | dataSets.add(setComp2);
323 |
324 | ArrayList xVals = new ArrayList();
325 | xVals.add("1.Q"); xVals.add("2.Q"); xVals.add("3.Q"); xVals.add("4.Q");
326 |
327 | LineData data = new LineData(xVals, dataSets);
328 | mLineChart.setData(data);
329 | mLineChart.invalidate(); // refresh
330 |
331 | 在调用了invalidate()之后图表被刷新并且提供的数据被绘制。
332 |
333 | ###设置颜色
334 |
335 | 自从发布1.4.0之后,在以前版本中负责颜色设置的ColorTemplate对象不在需要。然而它依然保存了所有与定义的颜色数组(例如ColorTemplate.VORDIPLOM_COLORS)并且提供了方便的方法为了从资源(资源整数)转换颜色到真正的颜色。
336 | 取代了ColorTemplate,颜色现在能被直接指定在DataSet对象中,那将允许区分每种DataSet样式。
337 |
338 | 在这个简短的例子中,我们有两个不同的LineDataSet对象来代表两家公司的季度收入(在前面设置数据指南中提到的),我们现在想设置不同的颜色。
339 |
340 | 我们想做如下:
341 |
342 | * 公司1的值应该通过四个红色的不同的变量来呈现。
343 | * 公司2的值应该通过四个绿色的不同的变量来呈现。
344 |
345 | 代码看上去像下面:
346 |
347 | LineDataSet setComp1 = new LineDataSet(valsComp1, "Company 1");
348 | // sets colors for the dataset, resolution of the resource name to a "real" color is done internally
349 | setComp1.setColors(new int[] { R.color.red1, R.color.red2, R.color.red3, R.color.red4 }, Context);
350 |
351 | LineDataSet setComp2 = new LineDataSet(valsComp2, "Company 2");
352 | setComp2.setColors(new int[] { R.color.green1, R.color.green2, R.color.green3, R.color.green4 }, Context);
353 |
354 | 除了以上,有许多其他的方法来给数据集设置颜色。下面是完整的文档:
355 |
356 | * setColors(int [] colors, Context c): 设置颜色应该被用在数据集前面,只要数据集表示的i项数大于颜色数组的大小,颜色将被重用。你能使用"new int[] { R.color.red, R.color.green, ... }" 来给这个方法提供颜色。在内部,颜色通过使用getResources().getColor(...)来获取。
357 | * setColors(int [] colors): 设置颜色应该被用在数据集之前,只要数据集表示的i项数大于颜色数组的大小,颜色将被重用。确保颜色应经被准备好(通过调用getResources().getColor(...))在增加它们到数据集之前。
358 | * setColors(ArrayList colors): 设置颜色应该被用在数据集之前,只要数据集表示的i项数大于颜色数组的大小,颜色将被重用。确保颜色应经被准备好(通过调用getResources().getColor(...))在增加它们到数据集之前。
359 | * setColor(int color): 设置一种或者唯一一种颜色应该被用于这个数据集之前。在内部,这将重新创建颜色数组并添加指定的颜色。
360 |
361 | ColorTemplate例子:
362 |
363 | LineDataSet set = new LineDataSet(...);
364 | set.setColors(ColorTemplate.VORDIPLOM_COLORS);
365 |
366 | 如果没有颜色被设置对于数据集,默认颜色被使用
367 |
368 | ###数据格式化
369 | 这个ValueFormatter接口可以用来创建定制格式化程序类允许格式化图标中的数据或这Y轴上的数据。
370 |
371 | 使用ValueFormatter仅需要创建一个新的类和实现他的接口并且从getFormattedValue(float value)返回任何你想要显示的文本。
372 |
373 | 自定义格式化的例子:
374 |
375 | public class MyValueFormatter implements ValueFormatter {
376 |
377 | private DecimalFormat mFormat;
378 |
379 | public MyValueFormatter() {
380 | mFormat = new DecimalFormat("###,###,##0.0"); // use one decimal
381 | }
382 |
383 | @Override
384 | public String getFormattedValue(float value) {
385 | return mFormat.format(value) + " $"; // append a dollar-sign
386 | }
387 | }
388 |
389 | 然后设置你需要格式化的YAxis, ChartData或者DataSet对象:
390 |
391 | // usage on axis
392 | yAxis.setValueFormatter(new MyValueFormatter());
393 |
394 | // usage on whole data object
395 | lineData.setValueFormatter(new MyValueFormatter());
396 |
397 | // usage on individual dataset object
398 | lineDataSet.setValueFormatter(new MyValueFormatter());
399 |
400 | ###特殊图表设置
401 |
402 | 在章节1的通用图标设置和样式函数适用于所有之前提及的图表类型。这个章节关注特殊设置用于独特的图标类型。
403 |
404 | ####饼图
405 |
406 | * setDrawSliceText(boolean enabled): 设置这个为true是绘制x轴的值文本在饼图切片上。
407 | * setUsePercentValues(boolean enabled): 如果设置为true,图标显示数据的百分比而不是他们的原始数据。数据提供了ValueFormatter情况下会格式化百分比数据。
408 |
409 | ###图例
410 |
411 | 默认,所有的图表类型支持图例并且将自动生成绘制出图例在为图表设置数据之后。图例通常包含多种条目每个标签代表一个形状。
412 | 自动生成的图例包含的项数取决于不同的颜色 (在所有数据集对象中) 以及数据集标签数目。图例标签依赖于在图表中使用的数据集对象设置的标签。在数据集对象中如果没有标签被制定,图表将自动生成它们。如果多种颜色被用在一个数据集中,这些颜色分组并且只被一个标签描述。
413 | 对于自定义的图例,你能从图表中检索图例对象使用getLegend()方法:
414 |
415 | Legend legend = chart.getLegend();
416 |
417 | ####控制图例是否被绘制
418 |
419 | * setEnabled(boolean enabled): 设置图例打开或者关闭,如果关闭,图例将不会被绘制。
420 |
421 | ####修改图例样式
422 |
423 | * setTextColor(int color): 设置图例标签的颜色
424 | * setTextSize(float size): 设置图例标签字体大小以dp为单位
425 | * setTypeface(Typeface tf): 设置自定义的Typeface对于图例标签
426 |
427 | ####自定义图例
428 |
429 | * setPosition(LegendPosition pos): 设置LegendPosition将定义图例在哪里出现。可以选择RIGHT_OF_CHART, RIGHT_OF_CHART_CENTER, RIGHT_OF_CHART_INSIDE, BELOW_CHART_LEFT, BELOW_CHART_RIGHT, BELOW_CHART_CENTER 或者 PIECHART_CENTER(PieChart独有),...等等。
430 | * setForm(LegendForm shape):设置LegendForm应该被使用。这是旁边带有颜色的图例项表示的数据集的图例标签绘制的形状。可以选择SQUARE, CIRCLE或者LINE.
431 | * setFormSize(float size): 设置图例形式大小以dp为单位
432 | * setXEntrySpace(float space): 在水平轴上的图例项之间的间距设置。
433 | * setYEntrySpace(float space):垂直轴上的图例项之间的间距设置。
434 | * setFormToTextSpacefloat space): 设置图例标签和相应的图例窗体之间的空间。
435 |
436 | 例子:
437 |
438 | Legend l = chart.getLegend();
439 | l.setFormSize(10f); // set the size of the legend forms/shapes
440 | l.setForm(LegendForm.CIRCLE); // set what type of form/shape should be used
441 | l.setPosition(LegendPosition.BELOW_CHART_LEFT);
442 | l.setTypeface(...);
443 | l.setTextSize(12f);
444 | l.setTextColor(Color.BLACK);
445 | l.setXEntrySpace(5f); // set the space between the legend entries on the x-axis
446 | l.setYEntrySpace(5f); // set the space between the legend entries on the y-axis
447 | // and many more...
448 |
449 | ###动态和实时数据
450 |
451 | 为了动态增加或者移除数据到图表,有多种方法允许你增加或者移除条目对象到一个存在的数据集或者从数据集对象到一个存在的ChartData对象。
452 |
453 | ####类DataSet(和所有的子类):
454 |
455 | * addEntry(Entry e): 增加给出的条目对象到DataSet
456 |
457 | ####类ChartData(和所有的子类)
458 |
459 | * addEntry(Entry e, int dataSetIndex): 增加给的条目到数据集,指定了数据集索引。
460 | * addDataSet(DataSet d): 增加给的DataSet对象到ChartData对象
461 |
462 | 另外也有几个方法来动态的移除数据。
463 |
464 | ####类DataSet(和所有的子类):
465 |
466 | * public boolean removeEntry(Entry e):移除给定的条目对象从数据集中。如果成功返回true
467 | * public boolean removeEntry(int xIndex): 移除给定的x索引处的条目从数据集中,如果成功返回true
468 |
469 | ####类ChartData(和所有的子类):
470 |
471 | * public boolean removeEntry(Entry e, int dataSetIndex):移除给定的条目对象从数据集中,指定了数据集索引。如果成功返回true。
472 | * public boolean removeEntry(int xIndex, int dataSetIndex):从给定的数据集索引数据集中移除给定的 x 索引处的项.如果成功返回true。
473 | * public boolean removeDataSet(DataSet d):移除给定的数据集对象从ChartData对象中。如果成功返回true。
474 | * public boolean removeDataSet(int index): 移除给定索引处的数据集从ChartData对象中。如果成功返回true。
475 |
476 | ###修改Viewport
477 |
478 | 这个库包含各种方法修改视口,请注意这些方法仅适用于LineChart, BarChart, ScatterChart and CandleStickChart。
479 |
480 | 请注意所有修改视口方法调需要在图标设置数据之后。
481 |
482 | ####约束显示什么
483 |
484 | * setVisibleXRange(float xRange): 设置区域的大小(范围在x轴)。例如设置了10,没有超过10的值在x轴上可查看不需要滚动
485 | * setVisibleYRange(float yRange, AxisDependency axis): 设置区域的大小(范围在y轴)。你同样需要提供轴此约束应适用于。
486 | * setViewPortOffsets(float left, float top, float right, float bottom):设定对当前视口的自定义便宜(对于图标窗口边的实际偏移),设置这个将防止图表自动计算他的偏移。使用resetViewPortOffsets()取消这个设置。
487 | resetViewPortOffsets():重置通过setViewPortOffsets(...)设置的自定义偏移。允许图标再次自动计算所有偏移。
488 |
489 | ####移动视图
490 |
491 | * fitScreen(): 重置所有的缩放和拖动使图表完全适合它的边界。
492 | * moveViewToX(float xIndex): 移动当前视口的左侧(边缘)到指定的x索引
493 | * moveViewToY(float yValue, AxisDependency axis): 中心视口提供的y轴上指定的y值(左侧或右侧)。
494 | * moveViewTo(float xIndex, float yValue, AxisDependency axis): 这将移动当前视口的左侧(边缘)到指定的x索引在x轴上,并且中心视口提供的y轴上指定的y值(相当于结合了setVisibleXRange(...)和setVisibleYRange(...))
495 | * centerViewTo(int xIndex, float yValue, AxisDependency axis): 这会将当前视区的中心移动到指定的x指数和y值(相当于结合了setVisibleXRange(...)和 setVisibleYRange(...))
496 |
497 | 完整例子:
498 | chart.setData(...); // first set data
499 |
500 | // now modify viewport
501 | chart.setVisibleXRange(20); // allow 20 values to be displayed on the x-axis
502 | chart.moveViewToX(10); // set the left edge of the chart to x-index 10
503 |
504 | // refresh
505 | chart.invalidate();
506 |
507 | ###动画
508 |
509 | 注意:动画只能工作在API级别11(Android 3.0.x)或更高
510 |
511 | 在低版本Android使用,动画将不执行(但是也不崩溃)
512 |
513 | 所有的图表类型都支持动画,那能被用来创建图表以一种很酷的方式。有三种类型的动画方法存在通过x轴,y轴或者两个轴来区分:
514 | * animateX(int durationMillis):动画的图表值在水平轴,意味着图标将在指定的时间从左到右建立。
515 | * animateY(int durationMillis):动画图表值在y轴,意味着图表将在指定的时间内从下到上构建。
516 | * animateXY(int xDuration, int yDuration):动画显示于水平和垂直的轴上,结果为左右上下都可以构建。
517 |
518 | mChart.animateX(3000); // animate horizontal 3000 milliseconds
519 | // or:
520 | mChart.animateY(3000); // animate vertical 3000 milliseconds
521 | // or:
522 | mChart.animateXY(3000, 3000); // animate horizontal and vertical 3000 milliseconds
523 |
524 | 如果animate(...)(任何类)被调用,不用再调用invalidate()来刷新图表。
525 |
526 | ####动画缓冲
527 |
528 | 这个库允许你为你的动画使用好的缓冲函数。你能选着下面预定义的静态Easing.EasingOption
529 |
530 | public enum EasingOption {
531 | Linear,
532 | EaseInQuad,
533 | EaseOutQuad,
534 | EaseInOutQuad,
535 | EaseInCubic,
536 | EaseOutCubic,
537 | EaseInOutCubic,
538 | EaseInQuart,
539 | EaseOutQuart,
540 | EaseInOutQuart,
541 | EaseInSine,
542 | EaseOutSine,
543 | EaseInOutSine,
544 | EaseInExpo,
545 | EaseOutExpo,
546 | EaseInOutExpo,
547 | EaseInCirc,
548 | EaseOutCirc,
549 | EaseInOutCirc,
550 | EaseInElastic,
551 | EaseOutElastic,
552 | EaseInOutElastic,
553 | EaseInBack,
554 | EaseOutBack,
555 | EaseInOutBack,
556 | EaseInBounce,
557 | EaseOutBounce,
558 | EaseInOutBounce,
559 | }
560 |
561 | 基本上有两种缓冲动画:
562 |
563 | 1、预定义缓冲动画:(这些代码可以运行在任何安卓版本)
564 |
565 | public void animateY(int durationmillis, Easing.EasingOption option);
566 |
567 | 使用预定义缓冲选项调用任何动画方法
568 |
569 | // animate both axes with easing
570 | mChart.animateY(3000, Easing.EasingOption.EaseOutBack);
571 |
572 | 在安卓3.0(API Level 11)以下版本总是使用Easing.EasingOption为预定义缓冲动画。
573 |
574 | 2、自定义缓冲函数:(自定义缓冲函数在安卓3.0以下会崩溃)
575 |
576 | public void animateY(int durationmillis, EasingFunction function);
577 |
578 | 创建自定义缓冲动画通过创建你自己的缓冲函数和实现EasingFunction接口:
579 |
580 | /**
581 | * Interface for creating custom made easing functions.
582 | */
583 | public interface EasingFunction {
584 | /**
585 | * Called everytime the animation is updated.
586 | * @param input - the time passed since the animation started (value between 0 and 1)
587 | */
588 | public float getInterpolation(float input);
589 | }
590 |
591 | 下面是调用这个的方法(注意,这个运行在安卓3.0以下会奔溃)
592 |
593 | // animate both axes with easing
594 | mChart.animateY(3000, new MyEasingFunction());
595 |
596 | ###MarkerView
597 |
598 | MakerView类能被任何用户创建的类扩展为了展示自定义的(弹窗)View无论何时要在图表中高亮一个值。
599 |
600 | ####设置或者得到marker
601 |
602 | * setMarkerView(MarkerView mv): 为图表设置一个MarkerView为了展示被选择的值在哪里。
603 | * getMarkerView(): 返回在图表中被设置的MarkerView,没有就返回null
604 |
605 | ####自定义实现
606 |
607 | 下面是一个看上去比较想MarkerView自定义实现的例子。比较重要的是你可以根据以下方法实现它:
608 |
609 | * refreshContent(Entry e, int dataSetIndex):每次这个方法被调用MarkerView被重新绘制,给你机会来更新它显示的内容(例如为TexView设置文本)
610 | * getXOffset():返回标记被绘制位置在x轴上的偏移。默认的,标记将被绘制在条目位置的左上边缘。
611 | * getYOffset(): 返回标记被绘制位置在y轴上的偏移。默认的,标记将被绘制在条目位置的左上边缘。
612 |
613 |
614 | public class CustomMarkerView extends MarkerView {
615 |
616 | private TextView tvContent;
617 |
618 | public CustomMarkerView (Context context, int layoutResource) {
619 | super(context, layoutResource);
620 | // this markerview only displays a textview
621 | tvContent = (TextView) findViewById(R.id.tvContent);
622 | }
623 |
624 | // callbacks everytime the MarkerView is redrawn, can be used to update the
625 | // content (user-interface)
626 | @Override
627 | public void refreshContent(Entry e, int dataSetIndex) {
628 | tvContent.setText("" + e.getVal()); // set the entry-value as the display text
629 | }
630 |
631 | @Override
632 | public int getXOffset() {
633 | // this will center the marker-view horizontally
634 | return -(getWidth() / 2);
635 | }
636 |
637 | @Override
638 | public int getYOffset() {
639 | // this will cause the marker-view to be above the selected value
640 | return -getHeight();
641 | }
642 | }
643 |
644 | 在设置了自定义的标记类之后,创建一个.xml的布局来呈现你的标记。在这个例子中布局包含一个带背景图片的相对布局还包含一个TextView。当然你可以创建任何你想到的布局在这里。
645 |
646 |
647 |
651 |
652 |
666 |
667 |
668 |
669 | 最后,在你创建了你自己的MarkerView之后,在图表中设置它。在创建你的MarkerView的时候,确保你提供了布局资源在你创建的.xml中。
670 |
671 | CustomMarkerView mv = new CustomMarkerView (Context, R.layout.custom_marker_view_layout);
672 |
673 | // set the marker to the chart
674 | chart.setMarkerView(mv);
675 |
676 | ###ChartData类
677 |
678 | 这个维基条目旨在更好地洞察 MPAndroidChart 背后的数据模型。
679 | ChartData类是所有数据类的基类(子类),像LineData,BarData,...等等。它被用来为Chart提供数据像图表中的setData()方法。
680 |
681 | public class LineData extends ChartData { ...
682 |
683 | 下面提到的方法被实现在ChartData类中,因此也能被用在所有子类中。
684 |
685 | ####数据样式
686 |
687 | * setValueTextColor(int color):设置文本值(值标签被绘制的颜色)的颜色为这个数据对象包含的所有数据集。
688 | * setValueTextSize(float size): 设置文本值(以dp为单位)的字体大小为此数据对象所包含的所有数据集。
689 | * setValueTypeface(Typeface tf): 设置值标签的字体样式为此数据对象所包含的所有数据集。
690 | * setValueFormatter(ValueFormatter f): 设置自定义的ValueFormatter为此数据对象所包含的所有数据集。
691 | * setDrawValues(boolean enabled):打开或者关闭绘制的值(文本值)为此数据对象所包含的所有数据集。
692 |
693 | ####Getters/Convenience
694 |
695 | * getDataSetByIndex(int index):返回在数据对象DataSet列表中给出的索引的数据集对象。
696 | * contains(Entry entry):检查数据对象是否包含指定的条目。如果是返回true,否则返回false。注意:在这一点上性能并不好,不要过度使用在性能要求高的的地方。
697 | * contains(T dataSet):如果数据对象包含提供的DataSet返回true,否则返回false
698 |
699 | ####clearing
700 |
701 | * clearValues(): 清除所有DataSet对象的数据对象因而包括所有条目。不会删除提供的x值。
702 |
703 | ###Data类详情
704 |
705 | 这个wiki条目集中于ChartData类的子类。此处未提到的ChartData的所有其他子类不提供任何具体的增强功能。
706 |
707 | ####BarData(类 BarData)
708 |
709 | * setGroupSpace(float percent): 设置不同的数据集对象的bars之间的空间占一个bar的宽度的百分比。100正好是一个bar的宽度,默认:80.
710 | * isGrouped(): 如果数据对象被分组返回true(包括超过一个数据集),否则返回false。
711 |
712 | ####ScatterData(类 ScatterData)
713 |
714 | * getGreatestShapeSize(): 返回所有ScatterDataSets这个数据对象包含的最大的外形尺寸。
715 |
716 | ####PieData(类 PieData)
717 |
718 | * getDataSet(): 返回为这个数据对象设置的PieDataSet对象。PieData对象不能包含多个PieDataSets。
719 | * setDataSet(PieDataSet set): 设置PieDataSet这个数据对象应该被呈现。
720 |
721 | ####CombinedData(类 CombinedData)
722 |
723 | 这个数据对象被设计用来包含所有其他数据对象的实例。使用setData()方法来为这个对象提供数据。这只能被CombinedChart使用。
724 | 里面看上去像下面这样:
725 |
726 | public class CombinedData extends ChartData {
727 |
728 | // ...
729 |
730 | public CombinedData(List xVals) { ... }
731 |
732 | public CombinedData(String[] xVals) { ... }
733 |
734 | public void setData(LineData data) { ... }
735 |
736 | public void setData(BarData data) { ... }
737 |
738 | public void setData(ScatterData data) { ... }
739 |
740 | public void setData(CandleData data) { ... }
741 |
742 | // ...
743 | }
744 |
745 | ###DataSet类
746 |
747 | DataSet类是所有data-set类(子类)的基类,像LineDataSet,BarDataSet,...等等。
748 |
749 | public class DataSet extends LineDataSet { ...
750 |
751 | DataSet类代表一组或者一种类型的条目中关系比较近的图表。它被设计用来区分在图表中逻辑上不同组的值(例如在LineChart中的具体行的值,或者在BarChart中的具体组的值)。
752 | 下面提到的方法被实现在DataSet类中因此也能被用在其所有的子类中。
753 |
754 | ####数据样式
755 |
756 | * setValueTextColor(int color):设置文本值(值标签被绘制的颜色)的颜色为这个数据对象包含的所有数据集。
757 | * setValueTextSize(float size): 设置文本值(以dp为单位)的字体大小为此数据对象所包含的所有数据集。
758 | * setValueTypeface(Typeface tf): 设置值标签的字体样式为此数据对象所包含的所有数据集。
759 | * setValueFormatter(ValueFormatter f): 设置自定义的ValueFormatter为此数据对象所包含的所有数据集。
760 | * setDrawValues(boolean enabled):打开或者关闭绘制的值(文本值)为此数据对象所包含的所有数据集。
761 |
762 | 如果在整个数据对象(不是data-set)中有相同的颜色,你可以只调用上述之一提到的ChartData对象。
763 |
764 | ####Getters/Convenience
765 |
766 | * contains(Entry entry):检查数据对象是否包含指定的条目。如果是返回true,否则返回false。注意:在这一点上性能并不好,不要过度使用在性能要求高的的地方。
767 |
768 | ###DataSet类详细说明
769 |
770 | 这个wiki条目集中于DataSet类的子类。此处未提到的ChartData的所有其他子类不提供任何具体的增强功能。
771 |
772 | ####Line-, Bar-, Scatter- & CandleDataSet (下面提到的方法能被用在任何提到的DataSet类中)
773 |
774 | * setHighLightColor(int color): 设置用来高亮显示的颜色。不要忘记使用getResources().getColor(...) 或者Color.rgb(...) (或者简单的 Color.BLACK)来获取颜色。
775 |
776 | ####Line- & RadarDataSet(只适用于LineDataSet 和 RadarDataSet的方法)
777 |
778 | * setFillColor(int color): 设置用来填充线表面的颜色。
779 | * setFillAlpha(int alpha): 设置阿尔法值(透明度)用来填充线表面(0-255),默认:85, 255代表完全不透明,0代表完全透明。
780 | * setDrawFilled(boolean filled): 设置为true,如果数据集应该被绘制填充(表面,区域),并不只是作为线,急用这将会得到极大的性能提升!默认:false
781 | * setLineWidth(float width):设置线宽为数据集(最小值0.2f,最大值10f);默认1f 注意:细线可以带来更好的性能,出线会有比较差的性能。
782 | 下面提到的方法只应用于具体提到的DataSet子类。
783 |
784 | ####LineDataSet(类LineDataSet)
785 |
786 | * setCircleSize(float size): 设置圆形指标线的大小(半径),默认大小为4f
787 | * setDrawCircles(boolean enabled):设置为true为打开绘制圆为LineDataSet,默认true
788 | * setDrawCubic(boolean enabled):如果设置为true,linechart线被绘制在立方体中,代替linear。这对性能有负面影响! 默认:false
789 | * setCubicIntensity(float intensity):为立方线设置强度(如果打开的话)。最大值1f代表高立方效果,最小值0.05f代表低立方效果。默认:0.2f
790 | * setCircleColor(int color): 为这个数据集应该有的所有圆设置颜色。
791 | * setCircleColors(List colors): 为这个数据集的圆外设置颜色。也有各种各样的其他方法为设置愿的颜色。
792 | * setCircleColorHole(int color): 设置圆内的颜色(洞内)
793 | * setDrawCircleHole(boolean enabled):设置这个为true允许在这个数据集的每个圆内绘制一个洞。如果设置为false,圆将被绘制填满(没有洞)
794 | * enableDashedLine(float lineLength, float spaceLength, float phase): 在虚线模式下打开线被绘制。例如像这“----------”“lineLength”是部分线的长度。“spaceLength”是两个部分之间的空间。“phase”是偏移,以度为单位(正常情况下,使用0)
795 |
796 | ####BarDataSet(类 BarDataSet)
797 |
798 | * setBarSpacePercent(float percent):设置bars之间的空间占bar总宽度的百分比。
799 | * setBarShadowColor(int color): 设置用来绘制的bar影子的颜色。bar的影子在表面代表在bar后面指示的最大值。不要忘记使用getResources().getColor(...) 或者Color.rgb(...) (或者简单的 Color.BLACK)来获取颜色。
800 | * setHighLightAlpha(int alpha): 设置被用来绘制高亮指示的bar阿尔法值(透明度)。255代表完全不透明,0代表完全透明。
801 | * setStackLabels(String[] labels): 设置标签为bar-stacks的不同的值,在这种情况下有一个。
802 |
803 | ####ScatterDataSet(类 ScatterDataSet)
804 |
805 | * setScatterShapeSize(float size): 设置将要绘制的scattershape的像素的大小,这仅适用于非自定义的形状。
806 | * setScatterShape(ScatterShape shape):设置图形被绘制的位置在值出现的地方。
807 |
808 | ####CandleDataSet(类 CandleDataSet)
809 |
810 | * setBodySpace(float space): 在每个柱状的左侧和右侧设置空间,默认0.1f(10%),最大值0.45f, 最小值0f
811 | * setShadowWidth(float width):设置candle-shadow-line的宽度以dp为单位。默认3f。
812 |
813 | ####PieDataSet(类 PieDataSet)
814 |
815 | * setSliceSpace(float degrees): 设置piechart-slices左侧之间的空间。默认:0’-->没有空间,最大值45,最小值0(没有空间)。
816 | * setSelectionShift(float shift):设置距离图表中心的数据集的高亮部分的饼图的距离,默认12f
817 |
818 | ###其他项
819 |
820 | ####图表内容
821 |
822 | * clear(): 清除图表的所有数据(通过设置数据对象为null)。调用invalidate()来刷新图表。
823 | * clearValues():清除所有数据集对象的图表包括所有条目。不会删除提供的x值。调用invalidate()来刷新图表。
824 | * isEmpty(): 如果图表数据为null返回true,或者如果它没有条目。
825 |
826 | ####有用的getter方法
827 |
828 | * getData():返回你为图表设置的数据对象。
829 | * getViewPortHandler():返回图表的ViewPortHandler对象,它包含一些关于图表大小和边界的信息(偏移,内容区域)。
830 | * getRenderer(): 返回负责绘制图表数据的主要的DataRenderer
831 | * getCenter():返回整个图表视图的中心点。
832 | * getCenterOffsets():返回图表绘图区的中心点。
833 | * getAverage(): 返回图表包含的所有值的平均值。
834 | * getPercentOfTotal(float value):返回所提供的值在图表内占总和的百分比。
835 | * getValueCount(): 返回图表拥有数据的总数。
836 | * getValueSum(): 返回在图表内所有值的和。
837 | * getYMin(): 返回图表数据的最小值。
838 | * getYMax(): 返回图表数据的最大值。
839 |
840 | ####一些更多的方法(Chart类的)
841 |
842 | * saveToGallery(String title):保存当前数据状态作为一张图片到图库。
843 | * saveToPath(String title, String pathOnSD):保存当前图表状态作为一张图片到指定路径。
844 | * getChartBitmap():返回bitmap对象来呈现图表,这个Bitmap总是包含最新的图表的绘制状态。
845 | * setHardwareAccelerationEnabled(boolean enabled): 允许打开或者关闭硬件加速为图表,只支持API11以上。
846 |
--------------------------------------------------------------------------------