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

回答

相關問題