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 
		<head>
3 
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
4 
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
5 
		<meta http-equiv="X-UA-Compatible" content="IE=edge" />
6 
 
7 
		<!-- AmCharts includes -->
8 
		<script src="http://www.amcharts.com/lib/3/amcharts.js"></script>
9 
		<script src="http://www.amcharts.com/lib/3/serial.js"></script>
10 
 
11 
		<!-- Export plugin includes and styles -->
12 
		<script src="../export.js"></script>
13 
		<link  type="text/css" href="../export.css" rel="stylesheet">
14 
 
15 
		<script src="export.config.default.js"></script>
16 
 
17 
		<style>
18 
		body, html {
19 
			height: 100%;
20 
			padding: 0;
21 
			margin: 0;
22 
			overflow: hidden;
23 
			font-size: 11px;
24 
			font-family: Verdana;
25 
		}
26 
		#chartdiv {
27 
			width: 100%;
28 
			height: 100%;
29 
		}
30 
		</style>
31 
 
32 
		<script type="text/javascript">
33 
			var chartData = [ {
34 
				"year": 2000,
35 
				"cars": 1587,
36 
				"motorcycles": 650,
37 
				"bicycles": 121
38 
			}, {
39 
				"year": 1995,
40 
				"cars": 1567,
41 
				"motorcycles": 683,
42 
				"bicycles": 146
43 
			}, {
44 
				"year": 1996,
45 
				"cars": 1617,
46 
				"motorcycles": 691,
47 
				"bicycles": 138
48 
			}, {
49 
				"year": 1997,
50 
				"cars": 1630,
51 
				"motorcycles": 642,
52 
				"bicycles": 127
53 
			}, {
54 
				"year": 1998,
55 
				"cars": 1660,
56 
				"motorcycles": 699,
57 
				"bicycles": 105
58 
			}, {
59 
				"year": 1999,
60 
				"cars": 1683,
61 
				"motorcycles": 721,
62 
				"bicycles": 109
63 
			}, {
64 
				"year": 2000,
65 
				"cars": 1691,
66 
				"motorcycles": 737,
67 
				"bicycles": 112
68 
			}, {
69 
				"year": 2001,
70 
				"cars": 1298,
71 
				"motorcycles": 680,
72 
				"bicycles": 101
73 
			}, {
74 
				"year": 2002,
75 
				"cars": 1275,
76 
				"motorcycles": 664,
77 
				"bicycles": 97
78 
			}, {
79 
				"year": 2003,
80 
				"cars": 1246,
81 
				"motorcycles": 648,
82 
				"bicycles": 93
83 
			}, {
84 
				"year": 2004,
85 
				"cars": 1218,
86 
				"motorcycles": 637,
87 
				"bicycles": 101
88 
			}, {
89 
				"year": 2005,
90 
				"cars": 1213,
91 
				"motorcycles": 633,
92 
				"bicycles": 87
93 
			}, {
94 
				"year": 2006,
95 
				"cars": 1199,
96 
				"motorcycles": 621,
97 
				"bicycles": 79
98 
			}, {
99 
				"year": 2007,
100 
				"cars": 1110,
101 
				"motorcycles": 210,
102 
				"bicycles": 81
103 
			}, {
104 
				"year": 2008,
105 
				"cars": 1165,
106 
				"motorcycles": 232,
107 
				"bicycles": 75
108 
			}, {
109 
				"year": 2009,
110 
				"cars": 1145,
111 
				"motorcycles": 219,
112 
				"bicycles": 88
113 
			}, {
114 
				"year": 2010,
115 
				"cars": 1163,
116 
				"motorcycles": 201,
117 
				"bicycles": 82
118 
			}, {
119 
				"year": 2011,
120 
				"cars": 1180,
121 
				"motorcycles": 285,
122 
				"bicycles": 87
123 
			}, {
124 
				"year": 2012,
125 
				"cars": 1159,
126 
				"motorcycles": 277,
127 
				"bicycles": 71
128 
			} ];
129 
 
130 
			var chart = AmCharts.makeChart( "chartdiv", {
131 
				"type": "serial",
132 
				"dataProvider": chartData,
133 
				"rotate": false,
134 
				"marginTop": 10,
135 
				"marginRight": 70,
136 
				"categoryField": "year",
137 
				"categoryAxis": {
138 
					"gridAlpha": 0.07,
139 
					"axisColor": "#DADADA",
140 
					"startOnAxis": false,
141 
					"title": "Year",
142 
					"guides": [ {
143 
						"category": "2001",
144 
						"lineColor": "#CC0000",
145 
						"lineAlpha": 1,
146 
						"dashLength": 2,
147 
						"inside": true,
148 
						"labelRotation": 90,
149 
						"label": "fines for speeding increased"
150 
					}, {
151 
						"category": "2007",
152 
						"lineColor": "#CC0000",
153 
						"lineAlpha": 1,
154 
						"dashLength": 2,
155 
						"inside": true,
156 
						"labelRotation": 90,
157 
						"label": "motorcycle maintenance fee introduced"
158 
					} ]
159 
				},
160 
				"valueAxes": [ {
161 
					"stackType": "regular",
162 
					"gridAlpha": 0.07,
163 
					"title": "Traffic incidents"
164 
				} ],
165 
				"graphs": [ {
166 
					"id": "g1",
167 
					"type": "column",
168 
					"title": "Cars",
169 
					"valueField": "cars",
170 
					"bullet": "round",
171 
					"lineAlpha": 0,
172 
					"fillAlphas": 0.6,
173 
					"balloonText": "<img src='images/car.png' style='vertical-align:bottom; margin-right: 10px; width:28px; height:21px;'><span style='font-size:14px; color:#000000;'><b>[[value]]</b></span>"
174 
				}, {
175 
					"id": "g2",
176 
					"type": "column",
177 
					"title": "Motorcycles",
178 
					"valueField": "motorcycles",
179 
					"lineAlpha": 0,
180 
					"fillAlphas": 0.6,
181 
					"balloonText": "<img src='images/motorcycle.png' style='vertical-align:bottom; margin-right: 10px; width:28px; height:21px;'><span style='font-size:14px; color:#000000;'><b>[[value]]</b></span>"
182 
				}, {
183 
					"id": "g3",
184 
					"type": "column",
185 
					"title": "Bicycles",
186 
					"valueField": "bicycles",
187 
					"lineAlpha": 0,
188 
					"fillAlphas": 0.6,
189 
					"balloonText": "<img src='images/bicycle.png' style='vertical-align:bottom; margin-right: 10px; width:28px; height:21px;'><span style='font-size:14px; color:#000000;'><b>[[value]]</b></span>"
190 
				} ],
191 
				"legend": {
192 
					"position": "bottom",
193 
					"valueText": "[[value]]",
194 
					"valueWidth": 100,
195 
					"valueAlign": "left",
196 
					"equalWidths": false,
197 
					"periodValueText": "total: [[value.sum]]"
198 
				},
199 
				"chartCursor": {
200 
					"cursorAlpha": 0
201 
				},
202 
				"chartScrollbar": {
203 
					"color": "FFFFFF"
204 
				},
205 
				// this shows how externally included config file can be used
206 
				"export": AmCharts.exportCFG
207 
			} );
208 
		</script>
209 
	</head>
210 
	<body>
211 
		<div id="chartdiv"></div>
212 
	</body>
213 
</html>