Highcharts包装过程线图上的数据不绘制正确的数据点

Question

我的目标是在折线图的Y轴上有一个新选项，允许在常规Y数据系列之间切换（例如[1,2,3] ）或原始数据系列的积累（[1,3,6]）。

我开始通过包装processData方法如下

(function (H) { 

    H.wrap(H.seriesTypes.line.prototype, 'processData', function(force) { 
    var yData = this.yData; 

    for (var i = 1; i < yData.length; i++) { 
     yData[i] = yData[i] + yData[i-1]; 
    }; 

    //alert(this.yData); 

    force.apply(this, Array.prototype.slice.call(arguments, 1)); 
    }); 


} (Highcharts)); 

的this.yData，我可以获得正确的数据，其余是非常简单的。当绘制时，我确实看到Y轴限制的变化与预期的一样，但数据点仍按照其原始值绘制（这里是小提琴：http://jsfiddle.net/oL3LfrLr/）

我怀疑这可能是一些范围问题，但我没有真的看到上面的错误。有小费吗？

为什么要包装processData？

不确定是否诚实。我对JavaScript和HighCharts相当陌生，这是我的第一个扩展。我看了一下Waterfall Series这是做我想要的一部分，并从我的猜测来看，它可能是translate或processData方法。后者听起来最有前途，所以我开始在那里。

Answer 1

事实上，你需要包装两种方法，就像瀑布系列一样。 processData对于y轴极端是必需的，translate负责将点的值转换为x-y坐标。我想用generatePoints而不是translate。事情是这样的：

(function (H) { 

    H.wrap(H.seriesTypes.line.prototype, 'processData', function (proceed) { 
      var yData = this.yData, 
      points = this.points; 

    if(!this.afterCalc) { 
     for (var i = 1; i < yData.length; i++) { 
     yData[i] = yData[i] + yData[i-1]; 
     }; 
    } 
    proceed.apply(this, Array.prototype.slice.call(arguments, 1)); 
    }); 

    H.wrap(H.seriesTypes.line.prototype, 'generatePoints', function (proceed) { 
    proceed.apply(this, Array.prototype.slice.call(arguments, 1)); 
      var yData = this.yData, 
      points = this.data; 
    if(!this.afterCalc) { 
     for (var i = 1; i < yData.length; i++) { 
     points[i].y = yData[i]; 
     }; 
     this.afterCalc = true; // calculate this only once 
    } 
    }); 


} (Highcharts)); 

和演示：http://jsfiddle.net/oL3LfrLr/2/