2013-05-07 2 views
0

Mon objectif est de créer des graphiques dynamiques en utilisant l'API: http://api.highcharts.com/highcharts#SeriesCréation graphique dynamique

Méthode: setData (Array<Mixed> data, [Boolean redraw])

Cependant, j'ai des problèmes de mise à jour du graphique:

   series: [{ 
          name: 'Lunch', 
          data: [49.9, 71.5, 106.4, 129.2, 144.0, 

              176.0, 135.6] 

         }, { 
          name: 'Dinner', 
          data: [83.6, 78.8, 98.5, 93.4, 106.0, 84.5, 

               105.0] 

         }] 
        }); 
       }); 

        // the button action 
       $('#button').click(function() { 
        var chart = $('#container').highcharts(); 
        chart.series[0].setData([129.2, 144.0, 176.0, 

           135.6, 148.5, 216.4, 194.1]); 
       }); 

        </script> 
      </head> 
      <body> 
       <script src="js/highcharts.js"></script> 
       <script src="js/modules/exporting.js"></script> 

       <div id="container" 
        style="min-width: 400px; height: 400px; 



           margin: 0 auto"></div> 
       <button id="button">Update the data</button> 
      </body> 
      </html> 

S'il vous plaît conseiller ce qui est le moyen approprié d'utiliser la méthode setData (Array<Mixed> data, [Boolean redraw])?

Répondre

0

Cochez cette case jsFiddle pour voir comment les graphiques dynamiques doivent être implémentés. Vous devez utiliser la fonction load pour charger les données dynamiquement. Exemple:

events: { 
       load: function() { 

        // set up the updating of the chart each second 
        var series = this.series[0]; 
        setInterval(function() { 
         var x = (new Date()).getTime(), // current time 
          y = Math.random(); 
         series.addPoint([x, y], true, true); 
        }, 1000); 
       } 
      }