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/radar.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": "radar",
30 
        "theme": "light",
31 
        "dataProvider": generateChartData(),
32 
        "graphs": [{
33 
          "bullet": "round",
34 
          "bulletSizeField": "bullet1",
35 
          "lineThickness": 2,
36 
          "valueField": "value",
37 
          "type": "line",
38 
          "alphaField": "alpha1",
39 
          "dashLengthField": "dash1"
40 
        }, {
41 
          "bullet": "round",
42 
          "bulletSizeField": "bullet2",
43 
          "lineThickness": 2,
44 
          "valueField": "value2",
45 
          "type": "line",
46 
          "alphaField": "alpha2",
47 
          "dashLengthField": "dash2"
48 
        }],
49 
        "valueAxes": [{
50 
          "minimum": 0,
51 
          "maximum": 100
52 
        }],
53 
        "categoryField": "category"
54 
      });
55 
 
56 
 
57 
      function generateChartData() {
58 
        var chartData = [];
59 
 
60 
        for ( var i = 0; i < 25; i++ ) {
61 
          var a = Math.floor( Math.random() * 100 );
62 
          var b = Math.floor( Math.random() * 100 );
63 
 
64 
          chartData.push( {
65 
            category: "" + i,
66 
            value: a,
67 
            value2: b,
68 
            bullet1: Math.floor(Math.random() * 10),
69 
            bullet2: Math.floor(Math.random() * 10),
70 
            alpha1: (Math.random() < 0.5 ? 0 : 1),
71 
            alpha2: (Math.random() < 0.5 ? 0 : 1),
72 
            dash1: Math.floor(Math.random() * 20),
73 
            dash2: Math.floor(Math.random() * 20)
74 
          } );
75 
        }
76 
 
77 
        return chartData;
78 
      }
79 
 
80 
 
81 
      function loop() {
82 
        var data = generateChartData();
83 
 
84 
        chart.animateData(data, {
85 
          duration: 1000,
86 
          complete: function () {
87 
            setTimeout(loop, 2000);
88 
          }
89 
        });
90 
      }
91 
 
92 
      chart.addListener("init", function () {
93 
        setTimeout(loop, 1000);
94 
      });
95 
    </script>
96 
  </body>
97 
</html>