饼状图(PieChart)与柱形图(BarChart)的使用
2016-06-16 17:21
811 查看
饼状图(PieChart)与柱形图(BarChart)的使用
标签:PieChart饼状图图表柱状图BarChart
2016-06-16 17:21
3771人阅读 评论(0)
收藏
举报
分类:
学习笔记(19)
作者同类文章X
版权声明:本文为博主原创文章,未经博主允许不得转载。
最近在工作中需要用到饼状图的功能,网上查了一下MPAndroidChart开源图表库是一个很好的东西,并下载了MPAndroidChart项目运行。于是自己写了一个简单的例子,使用PieChart(饼图)的方法如下:
源码下载地址:https://github.com/PhilJay/MPAndroidChart
(一)将其导入到工程中(更多方法在github中有介绍)
这里我使用的是Android Studio,只需在Module中的build.grade文件中添加如下代码
repositories { maven { url "https://jitpack.io" } } dependencies { compile 'com.github.PhilJay:MPAndroidChart:v2.2.5' }1
2
3
4
5
6
7
1
2
3
4
5
6
7
添加后编译成功即可使用
(二)在要使用的布局文件中添加PieChart
<com.github.mikephil.charting.charts.PieChart android:id="@+id/pieChart" android:layout_width="match_parent" android:layout_height="match_parent"> </com.github.mikephil.charting.charts.PieChart>1
2
3
4
5
6
1
2
3
4
5
6
(三)在代码中使用PieChart
private void initChart() { // 设置饼图是否接收点击事件,默认为true pieChart.setTouchEnabled(true); //设置饼图是否使用百分比 pieChart.setUsePercentValues(true); //设置饼图右下角的文字描述 pieChart.setDescription("测试"); //设置饼图右下角的文字大小 pieChart.setDescriptionTextSize(16); //是否显示圆盘中间文字,默认显示 pieChart.setDrawCenterText(true); //设置圆盘中间文字 pieChart.setCenterText("我在中间"); //设置圆盘中间文字的大小 pieChart.setCenterTextSize(20); //设置圆盘中间文字的颜色 pieChart.setCenterTextColor(Color.WHITE); //设置圆盘中间文字的字体 pieChart.setCenterTextTypeface(Typeface.DEFAULT); //设置中间圆盘的颜色 pieChart.setHoleColor(Color.GREEN); //设置中间圆盘的半径,值为所占饼图的百分比 pieChart.setHoleRadius(20); //设置中间透明圈的半径,值为所占饼图的百分比 pieChart.setTransparentCircleRadius(40); //是否显示饼图中间空白区域,默认显示 pieChart.setDrawHoleEnabled(true); //设置圆盘是否转动,默认转动 pieChart.setRotationEnabled(true); //设置初始旋转角度 pieChart.setRotationAngle(0); //设置比例图 Legend mLegend = pieChart.getLegend(); //设置比例图显示在饼图的哪个位置 mLegend.setPosition(Legend.LegendPosition.RIGHT_OF_CHART); //设置比例图的形状,默认是方形,可为方形、圆形、线性 mLegend.setForm(Legend.LegendForm.CIRCLE); // mLegend.setXEntrySpace(7f); // mLegend.setYEntrySpace(5f); //设置X轴动画 pieChart.animateX(1800); // //设置y轴动画 // pieChart.animateY(1800); // //设置xy轴一起的动画 // pieChart.animateXY(1800, 1800); //绑定数据 bindData(3); // 设置一个选中区域监听 pieChart.setOnChartValueSelectedListener(new OnChartValueSelectedListener() { @Override public void onValueSelected(Entry e, int dataSetIndex, Highlight h) { Toast.makeText(MainActivity.this,dataSetIndex+""+e.toString(),Toast.LENGTH_SHORT).show(); } @Override public void onNothingSelected() { } }); } /** * * @param count 分成几部分 */ private void bindData(int count) { /** * nameList用来表示每个饼块上的文字内容 * 如:部分一,部分二,部分三 */ ArrayList<String> nameList = new ArrayList<String>(); for (int i = 0; i < count; i++) { nameList.add("部分" + (i + 1)); } /** * valueList将一个饼形图分成三部分,各个区域的百分比的值 * Entry构造函数中 * 第一个值代表所占比例, * 第二个值代表区域位置 * (可以有第三个参数,表示携带的数据object)这里没用到 */ ArrayList<Entry> valueList = new ArrayList<Entry>(); valueList.add(new Entry(20, 0)); valueList.add(new Entry(30, 1)); valueList.add(new Entry(50, 2)); //显示在比例图上 PieDataSet dataSet = new PieDataSet(valueList, "不同颜色代表的含义"); //设置个饼状图之间的距离 dataSet.setSliceSpace(3f); // 部分区域被选中时多出的长度 dataSet.setSelectionShift(5f); // 设置饼图各个区域颜色 ArrayList<Integer> colors = new ArrayList<Integer>(); colors.add(Color.RED); colors.add(Color.GREEN); colors.add(Color.BLUE); dataSet.setColors(colors); PieData data = new PieData(nameList, dataSet); //设置以百分比显示 data.setValueFormatter(new PercentFormatter()); //区域文字的大小 data.setValueTextSize(11f); //设置区域文字的颜色 data.setValueTextColor(Color.WHITE); //设置区域文字的字体 data.setValueTypeface(Typeface.DEFAULT); pieChart.setData(data); //设置是否显示区域文字内容 pieChart.setDrawSliceText(pieChart.isDrawSliceTextEnabled()); //设置是否显示区域百分比的值 for (IDataSet<?> set : pieChart.getData().getDataSets()){ set.setDrawValues(!set.isDrawValuesEnabled()); } // undo all highlights pieChart.highlightValues(null); pieChart.invalidate(); }1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
柱形图使用:
private void initBarChart() { //设置矩形阴影是否显示 barChart.setDrawBarShadow(false); //设置值是否在矩形的上方显示 barChart.setDrawValueAboveBar(true); //设置右下角描述 barChart.setDescription("测试"); //没用数据时显示 barChart.setNoDataText("没有数据"); // if more than 60 entries are displayed in the chart, no values will be // drawn barChart.setMaxVisibleValueCount(60); // 设置是否可以触摸 barChart.setTouchEnabled(true); // 是否可以拖拽 barChart.setDragEnabled(true); // 是否可以缩放 barChart.setScaleEnabled(true); // 集双指缩放 barChart.setPinchZoom(false); // 设置是否显示表格颜色,矩形之间的空隙 barChart.setDrawGridBackground(false); // 设置表格的的颜色,矩形之间的空隙颜色 barChart.setGridBackgroundColor(Color.GRAY); //设置比例显示 Legend l = barChart.getLegend(); //设置比例显示在柱形图哪个位置 l.setPosition(Legend.LegendPosition.BELOW_CHART_LEFT); //设置比例显示形状,方形,圆形,线性 l.setForm(Legend.LegendForm.SQUARE); //设置比例显示形状的大小 l.setFormSize(15f); //设置比例显示文字的大小 l.setTextSize(15f); l.setXEntrySpace(4f); //设置X轴方向上的属性 XAxis xAxis = barChart.getXAxis(); //设置标签显示在柱形图的上方还是下方 xAxis.setPosition(XAxis.XAxisPosition.TOP); xAxis.setTypeface(Typeface.DEFAULT); //设置是否绘制表格 xAxis.setDrawGridLines(false); //设置x标签的间隙 xAxis.setSpaceBetweenLabels(2); //设置柱形图左边y轴方向上的属性 YAxis leftAxis = barChart.getAxisLeft(); leftAxis.setTypeface(Typeface.DEFAULT); //设置y轴上的标签数,boolean值为true代表必须8个 leftAxis.setLabelCount(8, false); leftAxis.setValueFormatter(new DefaultYAxisValueFormatter(0)); //设置标签在柱形图的哪个位置 leftAxis.setPosition(YAxis.YAxisLabelPosition.OUTSIDE_CHART); //设置y轴标签之间的间距 leftAxis.setSpaceTop(15f); leftAxis.setAxisMinValue(0f); // this replaces setStartAtZero(true) //设置柱形图右边y轴方向上的属性,属性含义与上面相同 YAxis rightAxis = barChart.getAxisRight(); rightAxis.setDrawGridLines(false); rightAxis.setTypeface(Typeface.DEFAULT); rightAxis.setLabelCount(5, true); rightAxis.setValueFormatter(new DefaultYAxisValueFormatter(0)); rightAxis.setSpaceTop(15f); rightAxis.setAxisMinValue(0f); // this replaces setStartAtZero(true) // 隐藏右边的坐标轴 // barChart.getAxisRight().setEnabled(false); // 隐藏左边的坐标轴(同上) // barChart.getAxisLeft().setEnabled(false); setData(15); }1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
/** * 绑定数据 * @param count x轴上的标签数 */ private void setData(int count) { //设置x轴方向上的标签数据 ArrayList<String> xVals = new ArrayList<String>(); for (int i = 0; i < count; i++) { xVals.add(i+""); } //设置每个矩形在y轴上的值 ArrayList<BarEntry> yVals1 = new ArrayList<BarEntry>(); for (int i = 0; i < count; i++) { yVals1.add(new BarEntry(20*i, i)); } //第一个参数是各个矩形在y轴方向上的值得集合,第二个参数为比例的文字说明 BarDataSet set1 = new BarDataSet(yVals1, "不同颜色代表不同的值"); //设置矩形之间的间距,参数为百分数,可控制矩形的宽度 set1.setBarSpacePercent(10f); //设置矩形的颜色 int colors[]={0xffff0000,0xff00ff00,0xff0000ff}; set1.setColors(colors); ArrayList<IBarDataSet> dataSets = new ArrayList<IBarDataSet>(); dataSets.add(set1); //设置柱形图的数据 BarData data = new BarData(xVals, dataSets); data.setValueTextSize(10f); data.setValueTypeface(Typeface.DEFAULT); barChart.setData(data); }1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
柱形图更多属性设置查看地址http://www.ithao123.cn/content-10519924.html
顶 0 踩 0
上一篇MenuDrawer的简单使用
下一篇打开第三方应用选择并过滤掉不想被打开的应用
相关文章推荐
•
MPchart使用详解及详细属性(一)
•
MPAndroidChart使用(BarChart为例)
•
<Android 应用 之路> MPAndroidChart~BarChart
•
MPAndroidChart使用之Bar chart
•
MPAndroidChart 教程:概述
•
iOS使用Charts框架绘制—柱形图
•
danielgindi/Charts柱形图barChartView使用
•
JfreeChart(3)-------BarChart的简单使用
•
Android图表控件MPAndroidChart——柱状图BarChart的使用(多条柱状图)
•
Android MPAndroidChart之PieChart和数据结构以及模型【5】
相关文章推荐
- 使用C++实现JNI接口需要注意的事项
- Android IPC进程间通讯机制
- Android Manifest 用法
- [转载]Activity中ConfigChanges属性的用法
- Android之获取手机上的图片和视频缩略图thumbnails
- Android之使用Http协议实现文件上传功能
- Android学习笔记(二九):嵌入浏览器
- android string.xml文件中的整型和string型代替
- i-jetty环境搭配与编译
- android之定时器AlarmManager
- android wifi 无线调试
- Android Native 绘图方法
- Android java 与 javascript互访(相互调用)的方法例子
- android 代码实现控件之间的间距
- android FragmentPagerAdapter的“标准”配置
- Android"解决"onTouch和onClick的冲突问题
- android:installLocation简析
- android searchView的关闭事件
- SourceProvider.getJniDirectories