Javascript 使用带有ID的数组向highchart图表添加数据

我想将一个系列添加到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, 'point3'],[2,1, 'point4'],[3,2, 'point5']]);

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

我发现我可以添加如下数据：

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, 'point3'],[2,1, 'point4'],[3,2, 'point5']]);

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

但是，当选择点时，我可以访问

id

的唯一方法是通过

this.point.config[2]

。使用以下方法，我无法使用

chart.get（'pointID'）

识别点，因为我没有设置

ID

。我希望能够仅使用

ID

尝试使用

但如果需要为序列设置数据，请使用

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

---

一旦您可以像这样传递数据：

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, 'point3'],[2,1, 'point4'],[3,2, 'point5']]);

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

（正如你在问题中所说的），我可以建议你使用一点黑客

我们需要在Highcharts.Point原型的方法

applyOptions

中添加另一条语句

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

---

您可以看到它的作用。

广义上讲，有两种方法可以动态修改图表数据

如果要用一些新数据完全替换现有数据，请使用此方法

如果要动态添加点的子集，请使用此方法。此方法不仅仅用于一次添加一个点，如果您再次仔细阅读文档，您将发现此方法采用布尔重绘参数，参数详细信息如下

重新绘制：布尔值
默认为true。之后是否重新绘制图表 补充一点。当添加多个点时，它是高度安全的 建议将重绘选项设置为false，而不是 添加点后显式调用chart.redraw（） 完成了

在您的情况下，因为您希望动态添加一些点，但保留现有点，所以应该使用方法2。但是您需要在循环中使用它，将redraw设置为false（从而解决速度慢的问题），然后在循环之后显式调用redraw方法

代码

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();

var id=['point3'，'point4'，'point5']，
y=[0,1,2]，
x=[1,2,3]；
对于（变量i=0；i

---

谢谢你的建议。我希望能够在中添加一个数组。我想我可以使用一个带有

addpoint（）

的循环来循环一个同样有效的数组。@celenius我可以看看你想要添加的数组吗？我在上面的问题中包括了它：

x=[1,2,3]；y=[0,1,2]；id=['point3'、'point4'、'point5']请更新问题的状态，如果有任何解决方案有助于标记，如果有什么问题，请考虑至少留下评论。