擴大xAxis的範圍以顯示實時數據的特定點數

我想修改顯示實時數據的高點示例。它目前顯示約20分，然後在添加新的點時從視圖中推出/丟棄最老的點。擴大xAxis的範圍以顯示實時數據的特定點數

什麼控制點數顯示？或者，如何擴展軸以顯示最早點之前的最小點數？

（也張貼代碼，但這只是因爲棧需要我們....）

$(function() { 
$(document).ready(function() { 
    Highcharts.setOptions({ 
     global: { 
      useUTC: false 
     } 
    }); 

    $('#container').highcharts({ 
     chart: { 
      type: 'spline', 
      animation: Highcharts.svg, // don't animate in old IE 
      marginRight: 10, 
      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); 
        }, 2000); 
       } 
      } 
     }, 
     title: { 
      text: 'Live random data' 
     }, 
     xAxis: { 
      type: 'datetime', 
      tickPixelInterval: 150, 

     }, 
     yAxis: { 
      title: { 
       text: 'Value' 
      }, 
      plotLines: [{ 
       value: 0, 
       width: 1, 
       color: '#808080' 
      }], 

     }, 
     tooltip: { 
      formatter: function() { 
       return '<b>' + this.series.name + '</b><br/>' + 
        Highcharts.dateFormat('%Y-%m-%d %H:%M:%S', this.x) + '<br/>' + 
        Highcharts.numberFormat(this.y, 2); 
      } 
     }, 
     legend: { 
      enabled: false 
     }, 
     exporting: { 
      enabled: false 
     }, 
     series: [{ 
      name: 'Random data', 
      data: (function() { 
       // generate an array of random data 
       var data = [], 
        time = (new Date()).getTime(), 
        i; 

       for (i = -19; i <= 0; i += 1) { 
        data.push({ 
         x: time + i * 1000, 
         y: Math.random() 
        }); 
       } 
       return data; 
      }()) 
     }] 
    }); 
});

}）;

來源

2014-10-30 Roger

我試圖更新x軸的最大性能，但它似乎只將範圍設置爲1. minRange似乎沒有影響。 http://api.highcharts.com/highcharts#xAxis – Roger 2014-10-30 16:12:04

此行是添加和刪除點：

series.addPoint([x, y], true, true);

正如你可以看到docs，第三PARAM代表shift，在添加新的刪除最後一個點。您可以通過設置有虛假器中取出點：

series.addPoint([x, y], true, false);

所以，沒有什麼神奇的，在演示20points - 只是點的最初數量爲20

來源

2014-10-31 09:35:37

是的，工作：http://jsfiddle.net/wjnoeo69/3/謝謝 – Roger 2014-10-31 14:08:37

擴大xAxis的範圍以顯示實時數據的特定點數

回答

相關問題