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 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
2 
<html>
3 
 
4 
    <head>
5 
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
6 
        <title>amCharts examples</title>
7 
        <link rel="stylesheet" href="style.css" type="text/css">
8 
        <script src="../amcharts/amcharts.js" type="text/javascript"></script>
9 
        <script src="../amcharts/gauge.js" type="text/javascript"></script>
10 
 
11 
        <script>
12 
			var chart;
13 
			var arrow;
14 
			var axisKM;
15 
			var axisMiles;
16 
 
17 
			AmCharts.ready(function () {
18 
 
19 
				// create angular gauge
20 
				chart = new AmCharts.AmAngularGauge();
21 
				chart.radius = "45%";
22 
 
23 
				// kilometers axis
24 
				axisKM = new AmCharts.GaugeAxis();
25 
				axisKM.startValue = 0;
26 
				axisKM.endValue = 240;
27 
				axisKM.radius = "100%";
28 
				axisKM.inside = false;
29 
				axisKM.gridInside = false;
30 
				axisKM.axisColor = "#94dca0";
31 
				axisKM.tickColor = "#94dca0";
32 
				axisKM.axisThickness = 3;
33 
				axisKM.valueInterval = 20;
34 
				chart.addAxis(axisKM);
35 
 
36 
				// miles axis
37 
				axisMiles = new AmCharts.GaugeAxis();
38 
				axisMiles.startValue = 0;
39 
				axisMiles.endValue = 160;
40 
				axisMiles.radius = "80%";
41 
				axisMiles.axisColor = "#bebd61";
42 
				axisMiles.tickColor = "#bebd61";
43 
				axisMiles.axisThickness = 3;
44 
				axisMiles.valueInterval = 20;
45 
				chart.addAxis(axisMiles);
46 
 
47 
				// arrow
48 
				arrow = new AmCharts.GaugeArrow();
49 
				arrow.radius = "85%";
50 
				arrow.color = "#8ec487";
51 
				arrow.innerRadius = 50;
52 
				arrow.nailRadius = 0;
53 
				chart.addArrow(arrow);
54 
 
55 
				chart.write("chartdiv");
56 
				// update value every 2 seconds
57 
				setInterval(randomValue, 2000);
58 
			});
59 
 
60 
			// set random value
61 
			function randomValue() {
62 
				var value = Math.round(Math.random() * 240);
63 
				arrow.setValue(value);
64 
			}
65 
 
66 
 
67 
        </script>
68 
    </head>
69 
 
70 
    <body>
71 
        <div id="chartdiv" style="width:400px; height:400px;"></div>
72 
    </body>
73 
 
74 
</html>