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