Highcharts繪圖標記移動到樣條圖動畫的後面

Question

我剛剛寫了一個簡單的圖。在這個圖表中，線條在標記之前移動，這對我來說似乎很奇怪。我很確定這是關於動畫屬性，但我沒發現是什麼原因造成問題。

您可以檢查我的代碼here

我設置的值用下面的代碼

function() { 

    // set up the updating of the chart each second 
    var series1 = this.series[0]; 
    var series2 = this.series[1]; 
    var series3 = this.series[2]; 

    setInterval(function() { 
     var x = (new Date()).getTime(), // current time 
      y = Math.random(); 
     series1.addPoint([x, y], true, true); 

     var x = (new Date()).getTime(), // current time 
      y = Math.random(); 
     series2.addPoint([x, y], true, true); 

     var x = (new Date()).getTime(), // current time 
      y = Math.random(); 
     series3.addPoint([x, y], true, true); 

    }, 1000); 

} 

Answer 1

它是由addPoint造成重繪的所有圖表3倍。所以我建議不要重新繪製1/2點的圖表，只能用於最後。

http://jsfiddle.net/md7hW/4/

setInterval(function() { 
          var x = (new Date()).getTime(), // current time 
            y = Math.random(); 
          series1.addPoint([x, y], false, true); 

          var x = (new Date()).getTime(), // current time 
            y = Math.random(); 
          series2.addPoint([x, y], false, true); 

          var x = (new Date()).getTime(), // current time 
            y = Math.random(); 
          series3.addPoint([x, y], true, true); 

         }, 1000); 

http://api.highcharts.com/highcharts#Series.addPoint()

Answer 2

@sebastian，謝謝你指着我在正確的方向。我遇到了類似的問題，但處理動態數據。我發現在添加我的點時爲重繪參數傳遞false，然後在圖表對象上重新繪製以適合我的情況。

var chart, REFRESH_DELAY = 1000; 
function requestData(){ 
    $.ajax({ 
     url: "/reports/realtime", 
     format:"json", 
     cache: false, 
     success: function (data) { 
      for (var i = 0 ; i < data.length && i < chart.series.length; i++) { 
       var series = chart.series[i], 
        shift = series.data.length > 20, 
        point = data[i]; 
       series.addPoint(point, false, shift); 
      } 
      chart.redraw(); 
      setTimeout(requestData, REFRESH_DELAY); 
     } 
    }); 
}