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>
2 
<html>
3 
  <head>
4 
    <meta charset="utf-8" />
5 
 
6 
    <style>
7 
      html, body {
8 
        width: 100%;
9 
        height: 100%;
10 
        margin: 0px;
11 
      }
12 
 
13 
      #chartdiv {
14 
        width: 100%;
15 
        height: 100%;
16 
      }
17 
    </style>
18 
  </head>
19 
  <body>
20 
    <script src="http://www.amcharts.com/lib/3/amcharts.js"></script>
21 
    <script src="http://www.amcharts.com/lib/3/funnel.js"></script>
22 
    <script src="http://www.amcharts.com/lib/3/themes/light.js"></script>
23 
    <script src="../animate.min.js"></script>
24 
 
25 
    <div id="chartdiv"></div>
26 
 
27 
    <script>
28 
      var chart = AmCharts.makeChart("chartdiv", {
29 
        "type": "funnel",
30 
        "theme": "light",
31 
        "dataProvider": generateChartData(),
32 
        "valueField": "value",
33 
        "titleField": "category",
34 
        "alphaField": "alpha",
35 
        "startDuration": 0,
36 
        "precision": 2,
37 
        "neckHeight": 150,
38 
        "neckWidth": 200
39 
      });
40 
 
41 
 
42 
      function generateChartData() {
43 
        var chartData = [];
44 
 
45 
        for ( var i = 0; i < 10; i++ ) {
46 
          var value = Math.floor(Math.random() * 100);
47 
          var labelRadius = Math.floor(Math.random() * 100);
48 
          var alpha = Math.random();
49 
 
50 
          chartData.push( {
51 
            category: "" + i,
52 
            value: value,
53 
            labelRadius: labelRadius,
54 
            alpha: alpha
55 
          } );
56 
        }
57 
 
58 
        return chartData;
59 
      }
60 
 
61 
 
62 
      function loop() {
63 
        var data = generateChartData();
64 
 
65 
        chart.animateData(data, {
66 
          duration: 1000,
67 
          complete: function () {
68 
            setTimeout(loop, 2000);
69 
          }
70 
        });
71 
      }
72 
 
73 
      chart.addListener("init", function () {
74 
        setTimeout(loop, 1000);
75 
      });
76 
    </script>
77 
  </body>
78 
</html>