highcharts 3 addPoint Point order

在Highcharts 2中，很容易使用series.addPoint(p)添加一个点，其中该点的x值落在两个现有点的x值之间。highcharts 3 addPoint Point order

例子：比方说，你想创建一个图表包含两个点一个系列：通过去

var p1 = {x: 100, y: 50}; 
var p2 = {x: 200, y: 40}; 

var data = []; 
data.push(p1); 
data.push(p1); 

var c = new Highcharts.Chart({ 
    ...//code omitted 
    type: 'line', 
    data: data, 
    ...//code omitted 

});

二版本中，你可以调用添加这两个之间的一个点：

var p3 = {x: 150, y: 60}; 

c.series[0].addPoint(p3, true);

对于'直线'图表，高位图2会自动确定p3的x值落在p1和p2的x值之间，因此该直线将按以下顺序绘制：p1，p3，p2。

我们发现，在高位图3中，该线通过点p1，p2，p3的点进行绘制 - 这意味着它会“自转”。

我已经制备了下列的jsfiddle实施例，其加50个指向与随机的x和y值。：

Highcharts 2.1.9现有系列：http://jsfiddle.net/HdNh2/4/

Highcharts 3.0.0：http://jsfiddle.net/HdNh2/5/

这是可以修复的东西，还是我们需要尝试绕过这个问题？

在此先感谢...

来源

2013-04-10 Herman

由于xAxis的Highcharts 2.2.x数据必须按升序排序。 – 2013-04-10 14:24:11

谢谢帕维尔。这有点可惜，因为2.2.x之前版本的功能对我们的一个场景特别有用，但我们应该能够对它进行整理。 – Herman 2013-04-10 16:05:52

所以才关闭这个问题：Highcharts已经确认，因为2.2.x中的逻辑改变

在我们的案例中，仅仅重新渲染整个图表就足够简单了，但我怀疑series.setData()也是一个选项。

来源

2013-04-11 09:11:39 Herman

这是一种解决方法。这将手动添加它们的x值的点。这事件对象是在图表对象选项块。

events: { 
    click: function(e) { 
     // find the clicked values and the series 
     var series = this.series[DIA.currentSeriesIndex], 
      x = parseFloat(e.xAxis[0].value), 
      y = parseFloat(e.yAxis[0].value); 

     // Add it 
     series.addPoint([x, y]); 

     if (series.data.length > 1) { 
      // grab last point object in array 
      var point = series.data[series.data.length-1]; 
      // sort the point objects on their x values 
      series.data.sort(function (a, b) 
      { 
       //Compare "a" and "b" and return -1, 0, or 1 
       return (a.x - b.x); 
      }); 
      // force a redraw 
      point.update(); 
     } 
    } 
}

来源

2013-08-14 03:03:02 user2592213

highcharts 3 addPoint Point order

回答

相关问题