Subversion Repositories php-qbpwcf

Rev

Rev 23 | Details | Compare with Previous | Last modification | View Log | RSS feed

Rev Author Line No. Line
23 liveuser 1 
<html>
2 
	<div id="donut" style="width:300px;height:300px;">
3 
	</div>
4 
</html>
5 
 
6 
<script src="../amcharts/amcharts.js" type="text/javascript"></script>
7 
<script src="../amcharts/pie.js" type="text/javascript"></script>
8 
 
9 
<script>
10 
 
11 
/*
12 
global donut var
13 
*/
14 
var donut;
15 
 
16 
/*
17 
 * change total issued label
18 
 */
19 
function changeLabel(chart)
20 
{
21 
	title=chart.dataItem.title;
22 
	value=chart.dataItem.value;
23 
	donut.clearLabels();
24 
	donut.addLabel(0,117,value,"center","34","#000000",0,1.0,false);
25 
	donut.addLabel(0,160,title,"center","11","#000000",0,1.0,true);
26 
}
27 
 
28 
/*
29 
 * restore total issued label
30 
 */
31 
function restoreLabel(chart)
32 
{
33 
	triggerBy=chart.type;
34 
	title='restore label';
35 
	value='restore Value';
36 
	donut.clearLabels();
37 
	donut.addLabel(0,117,value,"center","34","#000000",0,1.0,false);
38 
	donut.addLabel(0,160,title,"center","11","#000000",0,1.0,true);
39 
}
40 
 
41 
//donut data
42 
donutData=
43 
[
44 
	{
45 
	"title":"current",
46 
	"value":100
47 
	},
48 
	{
49 
	"title":"online",
50 
	"value":50
51 
	},
52 
	{
53 
	"title":"email",
54 
	"value":40
55 
	}
56 
]
57 
 
58 
//make & show donut
59 
donut=AmCharts.makeChart("donut",
60 
{
61 
	"type": "pie",
62 
	"theme": "none",
63 
	"addClassNames": true,
64 
	"balloonText": "<div style='font-size:36px;text-align:center'>[[percents]]%</div><div style='font-size:16px;'>[[title]]: <b>[[value]]</b></div>",
65 
	"balloon":
66 
	{
67 
		"fillAlpha": 1,
68 
		"showBullet": true,
69 
		"fixedPosition": false
70 
	},
71 
	"colors":
72 
	[
73 
		"#CCCCCC",
74 
		"#9FCD61",
75 
		"#4FB7E3"
76 
	],
77 
	"allLabels":
78 
	[
79 
		{
80 
			"text": 100,
81 
			"align": "center",
82 
			"bold":false,
83 
			"x": -3,
84 
			"y": 117,
85 
			"size": 34
86 
		},
87 
		{
88 
			"text": "total issued",
89 
			"align": "center",
90 
			"bold": true,
91 
			"y": 160,
92 
			"size": 11
93 
		}
94 
	],
95 
	"dataProvider":donutData,
96 
	"titleField": "title",
97 
	"valueField": "value",
98 
	"labelRadius": -120,
99 
	"radius": "42%",
100 
	"innerRadius": "55%",
101 
	"labelText": "",
102 
	"creditsPosition": "bottom-left"
103 
});
104 
donut.addListener("rollOverSlice",changeLabel);
105 
donut.addListener("rollOutSlice",restoreLabel);
106 
 
107 
</script>