更新样条图两条线在彼此的顶部

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/正常工作。