更新樣條圖兩條線在彼此的頂部

Question

我在單個圖中顯示了兩行，每一行都用一個保存到全局變量（均具有不同全局變量）的值更新它們。代碼示例可在此處找到：jsFiddle example。

正如您所看到的，兩條線彼此重疊，即使在將ymin和ymax添加到線條中（您可以在控制檯中看到它們）時它們具有不同的值。

原因似乎是在第一個addPoint調用中（第118行）。如果第一個布爾值設置爲true（如第二個addPoint調用），則行顯示正確，但動畫不正確：jsFiddle example。

有誰知道爲什麼這些線條在彼此的頂部，而他們的價值顯然是不同的？更重要的是：如何在保持流暢動畫的同時解決這個問題？

上一個（可能有關）的問題：Chart not moving fluently when adding value to two lines on interval。

Answer 1

問題在於兩個系列使用相同的變量emptyarray。這是Highcharts的問題（在github上發佈），Highcharts會覆蓋傳遞給圖表的一些選項。可能的解決方案是使用函數將返回空數組，例如：

function generateArray(){ 
     var emptyarray = [], 
      time = (new Date()).getTime(), 
      i; 

     for (i = -50; i <= 0; i++) { 
      emptyarray.push({ 
       x: time + i * 1000, 
       y: 230 
      }); 
     } 
     return emptyarray; 
    } 

    chartinfo.series = [{ 
     name: 'Minimum Voltage', 
     data: generateArray(), 
     color: '#FFFFDD' 
    }, { 
     name: 'Maximum Voltage', 
     data: generateArray(), 
     color: '#B72E8D' 
    }]; 

工作的jsfiddle：http://jsfiddle.net/XAHa4/2/

Answer 2

看起來怪你setInerval功能，因爲縮小的例子http://jsfiddle.net/DxqUj/正常工作。