rapid, real-time data updates in high volume line charts using boost - Javascript highcharts

Javascript examples for highcharts:Chart Data

  1. HOME
  2. Javascript
  3. highcharts
  4. Chart Data

Description

rapid, real-time data updates in high volume line charts using boost

Demo Code

ResultView the demo in separate window 

<html>
   <head> 
      <title>Highcharts Demo</title> 
      <meta name="viewport" content="width=device-width, initial-scale=1"> 
   </head> 
   <body> 
      <script src="https://code.highcharts.com/highcharts.src.js"></script> 
      <div id="container"></div> 
      <script type="text/javascript">
console.log()
var chart = Highcharts.chart('container', {
  series: [{/*from w  w w  .  j  ava2s  . c  o m*/
    data: generateData(5000)
  }]
});
function generateData(amount) {
   var data = [];
  for(var i = 0; i < amount; i++) {
     data.push(Math.random());
  }
  return data;
}
setInterval(function() {
   console.time('time without boost');
   chart.series[0].setData(generateData(5000), true, false, false);
  console.timeEnd('time without boost');
}, 2000);

      </script>  
   </body>
</html>

Related Tutorials