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/pie.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    AmCharts.makeChart("chartdiv", {
20      "type": "pie",
21      "titles": [{
22        "text": "Visitors countries",
23        "size": 16
24      }],
25      "dataProvider": [{
26        "country": "United States",
27        "visits": 7252
28      }, {
29        "country": "China",
30        "visits": 3882
31      }, {
32        "country": "Japan",
33        "visits": 1809
34      }, {
35        "country": "Germany",
36        "visits": 1322
37      }, {
38        "country": "United Kingdom",
39        "visits": 1122
40      }, {
41        "country": "France",
42        "visits": 414
43      }, {
44        "country": "India",
45        "visits": 384
46      }, {
47        "country": "Spain",
48        "visits": 211
49      }],
50      "valueField": "visits",
51      "titleField": "country",
52      "startEffect": "elastic",
53      "startDuration": 2,
54      "labelRadius": 15,
55      "innerRadius": "50%",
56      "depth3D": 10,
57      "balloonText": "[[title]]<br><span style='font-size:14px'><b>[[value]]</b> ([[percents]]%)</span>",
58      "angle": 15,
59      "legend": {
60        "position": "right"
61      },
62      "responsive": {
63        "enabled": true
64      }
65    });
66  </script>
67</head>
68
69<body>
70  <div id="chartdiv" style="width: 100%; height: 100%;"></div>
71</body>
72
73</html>