Advertisement
Guest User

Highcharts AJAX

a guest
Jun 19th, 2012
52
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. $(document).ready(function() {
  2.     Highcharts.setOptions({
  3.         global: {
  4.             useUTC: false
  5.         }
  6.     });
  7.  
  8.     var chart;
  9.     chart = new Highcharts.Chart({
  10.         chart: {
  11.             renderTo: 'container',
  12.             type: 'spline',
  13.             marginRight: 10,
  14.             events: {
  15.                 load: function() {
  16.  
  17.                     // set up the updating of the chart each second
  18.                     var series = this.series[0];
  19.                     setInterval(function() {
  20.                         // AJAX Call to get data point
  21.                         $.getJSON('nextPoint.php', function(data) {
  22.                             series.addPoint([data[0], data[1]], true, true);
  23.                         });
  24.                     }, 1000);
  25.                 }
  26.             }
  27.         },
  28.         title: {
  29.             text: 'Live random data'
  30.         },
  31.         xAxis: {
  32.             type: 'datetime',
  33.             tickPixelInterval: 150
  34.         },
  35.         yAxis: {
  36.             title: {
  37.                 text: 'Value'
  38.             },
  39.             plotLines: [{
  40.                 value: 0,
  41.                 width: 1,
  42.                 color: '#808080'
  43.             }]
  44.         },
  45.         tooltip: {
  46.             formatter: function() {
  47.                     return '<b>'+ this.series.name +'</b><br/>'+
  48.                     Highcharts.dateFormat('%Y-%m-%d %H:%M:%S', this.x) +'<br/>'+
  49.                     Highcharts.numberFormat(this.y, 2);
  50.             }
  51.         },
  52.         legend: {
  53.             enabled: false
  54.         },
  55.         exporting: {
  56.             enabled: false
  57.         },
  58.         series: [{
  59.             name: 'Random data',
  60.             data: (function() {
  61.                 // generate an array of random data
  62.                 var data = [],
  63.                     time = (new Date()).getTime(),
  64.                     i;
  65.  
  66.                 for (i = -19; i <= 0; i++) {
  67.                     data.push({
  68.                         x: time + i * 1000,
  69.                         y: Math.random()
  70.                     });
  71.                 }
  72.                 return data;
  73.             })()
  74.         }]
  75.     });
  76. });
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement