Highcharts實時圖表不斷變化

我初始化圖表爲空值，因爲我沒有有意義的初始值。在通過ajax獲取數據後，我使用addPoint添加了點數問題在於圖表連續移動，而不僅僅是在時間範圍的末尾。

我使用的代碼：

generateInitialData = function() { 
     var initialData = []; 
     var time = (new Date()).getTime(); 
     var i; 
     for (i = -99; i <= 0; i++) { 
      initialData.push([time + i * 3000,null]); 
     } 
     return initialData; 
    } 

addPoint = function(){ 
    var max = 1000; 
    var min = 300; 
    var value = Math.floor(Math.random() * (max - min + 1)) + min; 
    chart.series[0].addPoint([(new Date()).getTime(), value], true, true); 
} 

$('#container').highcharts({ 
     chart: { 
       type: 'line', 
      }, 
      xAxis: { 
       type: 'datetime', 
       minRange:1000 * 60 * 5, 
       maxRange:1000 * 60 * 5 
      } 
}); 

var chart = $('#container').highcharts(); 

chart.addSeries({"name": "example","data":generateInitialData()}); 

setInterval(addPoint,3000);

請參閱發行的jsfiddle演示：

http://jsfiddle.net/wXmLQ/7/

請幫

大里

來源

2013-08-26 user353969

的addPoint和addSeries方法有重新繪製參數，默認爲真實的。把這個參數設置爲false，只要你撥打的更新方法

chart.series[0].addPoint([(new Date()).getTime(), value], false); 
chart.addSeries({"name": "example","data":generateInitialData()}, false);

然後，一旦你做了所有的更新，明確重新繪製圖表

chart.redraw();

來源

2013-08-26 16:18:19 Sualkcin

但我需要更新爲每個addPoint是可見的（這是我做的每3秒）我只是不想要移位 – user353969

addPoint的第三個參數是shift的布爾值，默認值是false，所以要麼保持關閉狀態，要麼顯式傳遞「false」。現在你傳遞的是真實的。 – Sualkcin

我需要轉變。我只想顯示5分鐘。我用5分鐘的所有積分初始化了圖表。如果我將錯誤的移動圖表x軸時間範圍將增長，圖形將更加「濃縮」。 – user353969

你不需要從一開始就設置空數據，而不是說你可以ADDD一個空的點，只是檢查，如果你想改變或沒有，請參閱：http://jsfiddle.net/Fusher/wXmLQ/8/

addPoint = function(){ 
    var max = 1000; 
    var min = 300; 
    var value = Math.floor(Math.random() * (max - min + 1)) + min; 
    var len = chart.series[0].data.length; 
    chart.series[0].addPoint([(new Date()).getTime(), value], len < 99); 
} 

$('#container').highcharts({ 
    chart: { 
      type: 'line', 
     }, 
     xAxis: { 
      type: 'datetime', 
      minTickInterval: 1000 * 60, //one minute 
      minRange:1000 * 60 * 5, 
      maxRange:1000 * 60 * 5 
     } 
}); 

var chart = $('#container').highcharts(); 

chart.addSeries({"name": "example","data":[[+new Date(), null]]}); 

setInterval(addPoint,3000);

來源

2013-08-27 10:50:43

Highcharts實時圖表不斷變化

回答

相關問題