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 
  <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 
  .chartdiv {
18 
    width: 50%;
19 
    height: 100%;
20 
    float: left;
21 
  }
22 
  </style>
23 
  <script>
24 
    AmCharts.makeChart( "chart1", {
25 
      "type": "pie",
26 
      "titles": [ {
27 
        "text": "Visits",
28 
        "size": 16
29 
      } ],
30 
      "dataProvider": [ {
31 
        "country": "United States",
32 
        "visits": 7252
33 
      }, {
34 
        "country": "China",
35 
        "visits": 3882
36 
      }, {
37 
        "country": "Japan",
38 
        "visits": 1809
39 
      }, {
40 
        "country": "Germany",
41 
        "visits": 1322
42 
      }, {
43 
        "country": "United Kingdom",
44 
        "visits": 1122
45 
      } ],
46 
      "valueField": "visits",
47 
      "titleField": "country",
48 
      "startEffect": "elastic",
49 
      "startDuration": 2,
50 
      "labelRadius": 15,
51 
      "innerRadius": "50%",
52 
      "depth3D": 10,
53 
      "balloonText": "[[title]]<br><span style='font-size:14px'><b>[[value]]</b> ([[percents]]%)</span>",
54 
      "angle": 15,
55 
      "legend": {},
56 
      "responsive": {
57 
        "enabled": true
58 
      }
59 
    } );
60 
 
61 
    AmCharts.makeChart( "chart2", {
62 
      "type": "pie",
63 
      "theme": "none",
64 
      "titles": [ {
65 
        "text": "Views",
66 
        "size": 16
67 
      } ],
68 
      "dataProvider": [ {
69 
        "country": "United States",
70 
        "visits": 10616
71 
      }, {
72 
        "country": "China",
73 
        "visits": 9845
74 
      }, {
75 
        "country": "Japan",
76 
        "visits": 3111
77 
      }, {
78 
        "country": "Germany",
79 
        "visits": 2874
80 
      }, {
81 
        "country": "United Kingdom",
82 
        "visits": 2110
83 
      } ],
84 
      "valueField": "visits",
85 
      "titleField": "country",
86 
      "startEffect": "elastic",
87 
      "startDuration": 2,
88 
      "labelRadius": 15,
89 
      "innerRadius": "50%",
90 
      "depth3D": 10,
91 
      "balloonText": "[[title]]<br><span style='font-size:14px'><b>[[value]]</b> ([[percents]]%)</span>",
92 
      "angle": 15,
93 
      "legend": {},
94 
      "responsive": {
95 
        "enabled": true
96 
      }
97 
    } );
98 
  </script>
99 
</head>
100 
 
101 
<body>
102 
  <div id="chart1" class="chartdiv"></div>
103 
  <div id="chart2" class="chartdiv"></div>
104 
</body>
105 
 
106 
</html>