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		<script src="http://www.amcharts.com/lib/3/amcharts.js"></script>
8		<script src="http://www.amcharts.com/lib/3/gauge.js"></script>
9
10		<!-- Export plugin includes and styles -->
11		<script src="../export.js"></script>
12		<link  type="text/css" href="../export.css" rel="stylesheet">
13
14		<style>
15		body, html {
16			height: 100%;
17			padding: 0;
18			margin: 0;
19			overflow: hidden;
20			font-size: 11px;
21			font-family: Verdana;
22		}
23		#chartdiv {
24			width: 100%;
25			height: 100%;
26		}
27		</style>
28
29		<script type="text/javascript">
30			var chart = AmCharts.makeChart( "chartdiv", {
31				"type": "gauge",
32				"titles": [ {
33					"text": "Speedometer",
34					"size": 15
35				} ],
36				"axes": [ {
37					"startValue": 0,
38					"axisThickness": 1,
39					"endValue": 220,
40					"valueInterval": 10,
41					"bottomTextYOffset": -20,
42					"bottomText": "0 km/h",
43					"bands": [ {
44						"startValue": 0,
45						"endValue": 90,
46						"color": "#00CC00"
47					}, {
48						"startValue": 90,
49						"endValue": 130,
50						"color": "#ffac29"
51					}, {
52						"startValue": 130,
53						"endValue": 220,
54						"color": "#ea3838",
55						"innerRadius": "95%"
56					} ]
57				} ],
58				"arrows": [ {} ],
59				"export": {
60					"enabled": true
61				}
62			} );
63
64			setInterval( randomValue, 2000 );
65
66			// set random value
67			function randomValue() {
68				var value = Math.round( Math.random() * 200 );
69				chart.arrows[ 0 ].setValue( value );
70				chart.axes[ 0 ].setBottomText( value + " km/h" );
71			}
72		</script>
73	</head>
74	<body>
75		<div id="chartdiv"></div>
76	</body>
77</html>