个人中心
文章发布
退出
作者热门文章
- ubuntu12.04环境下使用kvm ioctl接口实现最简单的虚拟机
- Ubuntu 通过无线网络安装Ubuntu Server启动系统后连接无线网络的方法
- 在Ubuntu上搭建网桥的方法
- ubuntu 虚拟机上网方式及相关配置详解
27
4
CFSDN坚持开源创造价值，我们致力于搭建一个资源共享平台，让每一个IT人在这里找到属于你的精彩世界.
这篇CFSDN的博客文章Android中使用Canvas绘制南丁格尔玫瑰图(Nightingale rose diagram)由作者收集整理，如果你对这篇文章有兴趣，记得点赞哟.
南丁格尔玫瑰图 在常规图表中实在很惊艳，但我初看没看懂，一查原来南丁格尔这么伟大，确实值得尊敬.
再仔细研究了下这种图的构成，发现原来就是把柱形图的柱形换成了扇形图的半径来表示，当然，变种有好多，我这只是说我理解的这种.
知道了其构成方式后就好实现了，依传入参数个数决定其扇形角度，依百分比决定其扇形的半径长度，然后就一切都水到渠成了.
漂亮的美图献上
附上实现代码
|
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
|
package
com.xcl.chart;
/**
* canvas练习
* 自已画南丁格尔玫瑰图(nightingale rose diagram)
*
* author:xiongchuanliang
* date:2014-4-12
*/
import
android.content.context;
import
android.graphics.canvas;
import
android.graphics.color;
import
android.graphics.paint;
import
android.graphics.paint.style;
import
android.graphics.rectf;
import
android.util.displaymetrics;
import
android.view.view;
public
class
panelrosechart
extends
view{
private
int
scrwidth,scrheight;
//演示用的百分比例,实际使用中，即为外部传入的比例参数
private
final
float
arrper[] =
new
float
[]{40f,50f,60f,35f,70f,80f,90f};
//演示用标签
private
final
string arrperlabel[] =
new
string[]{
"postgresql"
,
"sybase"
,
"db2"
,
"国产及其它"
,
"mysql"
,
"ms sql"
,
"oracle"
};
//rgb颜色数组
private
final
int
arrcolorrgb[][] = { {
77
,
83
,
97
},
{
148
,
159
,
181
},
{
253
,
180
,
90
},
{
52
,
194
,
188
},
{
39
,
51
,
72
},
{
255
,
135
,
195
},
{
215
,
124
,
124
}} ;
public
panelrosechart(context context) {
super
(context);
// todo auto-generated constructor stub
//屏幕信息
displaymetrics dm = getresources().getdisplaymetrics();
scrheight = dm.heightpixels;
scrwidth = dm.widthpixels;
}
public
void
ondraw(canvas canvas){
//画布背景
canvas.drawcolor(color.black);
float
cirx = scrwidth /
2
;
float
ciry = scrheight /
3
;
float
radius = scrheight /
5
;
//150;
float
arcleft = cirx - radius;
float
arctop = ciry - radius ;
float
arcright = cirx + radius ;
float
arcbottom = ciry + radius ;
rectf arcrf0 =
new
rectf(arcleft ,arctop,arcright,arcbottom);
//画笔初始化
paint paintarc =
new
paint();
paint paintlabel =
new
paint();
paintlabel.setcolor(color.white);
paintlabel.settextsize(
16
);
paintlabel.setantialias(
true
);
paintarc.setantialias(
true
);
//位置计算类
xchartcalc xcalc =
new
xchartcalc();
float
percentage =
0
.0f;
float
currper =
0
.0f;
float
newraidus =
0
.0f;
int
i=
0
;
//将百分比转换为扇形半径长度
percentage =
360
/ arrper.length;
percentage = (
float
)(math.round(percentage *
100
))/
100
;
for
(i=
0
; i<arrper.length; i++)
{
//将百分比转换为新扇区的半径
newraidus = radius * (arrper[i]/
100
);
newraidus = (
float
)(math.round(newraidus *
100
))/
100
;
float
newarcleft = cirx - newraidus;
float
newarctop = ciry - newraidus ;
float
newarcright = cirx + newraidus ;
float
newarcbottom = ciry + newraidus ;
rectf newarcrf =
new
rectf(newarcleft ,newarctop,newarcright,newarcbottom);
//分配颜色
paintarc.setargb(
255
,arrcolorrgb[i][
0
], arrcolorrgb[i][
1
], arrcolorrgb[i][
2
]);
//在饼图中显示所占比例
canvas.drawarc(newarcrf, currper, percentage,
true
, paintarc);
//计算百分比标签
xcalc.calcarcendpointxy(cirx, ciry, radius - radius/
2
/
2
, currper + percentage/
2
);
//标识
canvas.drawtext(arrperlabel[i],xcalc.getposx(), xcalc.getposy() ,paintlabel);
//下次的起始角度
currper += percentage;
}
//外环
paintlabel.setstyle(style.stroke);
paintlabel.setcolor(color.green);
canvas.drawcircle(cirx,ciry,radius,paintlabel);
canvas.drawtext(
"author:xiongchuanliang"
,
10
, scrheight -
200
, paintlabel);
}
}
|
。
代码实现起来很容易，但这种图的设计创意确实非常好。 叹服.
一定要附上南丁格尔维基百科的链接: http://zh.wikipedia.org/wiki/%e5%bc%97%e7%be%85%e5%80%ab%e6%96%af%c2%b7%e5%8d%97%e4%b8%81%e6%a0%bc%e7%88%be 。
感兴趣的可以看看.
最后此篇关于Android中使用Canvas绘制南丁格尔玫瑰图(Nightingale rose diagram)的文章就讲到这里了,如果你想了解更多关于Android中使用Canvas绘制南丁格尔玫瑰图(Nightingale rose diagram)的内容请搜索CFSDN的文章或继续浏览相关文章，希望大家以后支持我的博客！ 。
27
4
0
我是一名优秀的程序员,十分优秀！