使用具有ID的数组将数据添加到一个highchart图表(Adding data to a high

我想添加一个系列一个highchart散点图我在哪里命名系列中的每一个点。我创建以下列方式图表：

var chart; // globally available

makeCharts = function(){

      chart = new Highcharts.Chart({
         chart: {
            renderTo: 'container1',
            type: 'scatter'
         },        
         series: [{
            name: 'a',
                data: [{                    
                    'id': 'point1',
                    'x': 1,
                    'y': 2
                }, {
                    'id': 'point2',
                    'x': 2,
                    'y': 5
                }]
            }]

      });
}

我希望能够更新使用类似图上的点：

chart.series[0].setData([{id:['point3', 'point4', 'point5'], y:[0,1,2], x:[1,2,3]}])

但是这是不正确的。是否有可能使用这种方法，每个点都有一个ID更新图表？

编辑：

只是为了澄清，我想能够直接传递的阵列，而不是使用由点添加数据点addPoint() 我可以遍历数组并用addPoint()做这样的事情：

id:['point3', 'point4', 'point5'];
y:[0,1,2];
x:[1,2,3];

for (i=0; i<x.length; i++)
  {
  chart.series[0].addPoint({
    x:  x[[i],
    y:  y[i],
    id: id[i]
});

  }

然而，这是非常缓慢的。这是更快的使用以下方法来添加数据：

chart.series[0].setData([[1,0],[2,1],[3,2]]);

我发现，我可以这样添加数据：

 chart.series[0].setData([[1,0, 'point3'],[2,1, 'point4'],[3,2, 'point5']]);

但是然后，我可以访问的唯一途径id选择点时，是通过this.point.config[2] 用下面的办法，我无法使用chart.get('pointID')以确定一个点，因为我没有设置ID 。我希望能够识别只使用点ID 。

Answer 1:

那么大致来说有两种方法可以动态修改图表数据

Series.setData（）当你想用一些新的数据完全替换现有数据，请使用此方法
Series.addPoint（）时，要动态添加点的子集使用此方法。这种方法不仅是一次添加一个点，如果你再仔细阅读文档，你会发现，这种方法需要一个布尔重绘参数，该参数主要内容如下

重绘：布尔
默认为true。是否重新绘制在添加点之后的图表。当添加多个点，强烈建议重绘选项困扰假，而是chart.redraw（）的结束点的加入后，显式调用。

在你的情况下，由于要动态补充几点，但保留现有的点，你应该有办法去2.但是，你需要使用它在一个循环中，与重绘被设置为false（因此解决问题正在缓慢），然后在循环后，显式调用再拉法

码

var id = ['point3', 'point4', 'point5'],
    y = [0, 1, 2],
    x = [1, 2, 3];

for (var i = 0; i < x.length; i++) {
    chart.series[0].addPoint({
        x: x[i],
        y: y[i],
        id: id[i]
    },false);
}
chart.redraw();

添加多点动态| Highcharts和Highstock @的jsfiddle

Answer 2:

尝试使用series.addPoint 。

chart.series[0].addPoint({
    x:  0,
    y:  0,
    id: 'anything'
});

但是，如果你需要为系列，使用的数据

chart.series[0].setData([{
    x:  0,
    y:  0,
    id: 'anything'
},{
    x:  2,
    y:  2,
    id: 'another'
}]);

Answer 3:

只要你可以通过你的数据是这样的：

chart.series[0].setData([[1,0, 'point3'],[2,1, 'point4'],[3,2, 'point5']]);

（如您有问题说明），我可以建议你使用一个小巧的黑客工具。

我们需要另一个语句添加到方法applyOptions Highcharts.Point原型。

if (typeof options[0] === 'number' && options[2] && typeof options[2] === 'string') this.id = options[2];

在这里，你可以看到它的行动。

文章来源: Adding data to a highchart chart using an array with IDs