HighChart：多个图表的情节线点击事件

我正在使用高图来进行一些向下钻取function。

我有一个function让用户点击区域图并添加一条线。 但后来我发现我的function有一个错误。 这些图表之间应该只有一条红线，但是当用户点击另一个图表时，第一个图表上的现有红线不会被删除。

下面是我的图表共享的function。

var myPlotLineId = "myPlotLine"; addPlotLine = function(evt) { var point = evt.point; var xValue = point.x; var xAxis = point.series.xAxis; Highcharts.each(xAxis.plotLinesAndBands, function(p) { if (p.id === myPlotLineId) { p.destroy(); } }); xAxis.addPlotLine({ value: xValue, width: 1, color: 'red', id: myPlotLineId }); }; 

它应该只允许一条红线，因为我使用的是ID。

以下是目前的情况。

由于我使用id作为情节线是不应该允许两行，请看我的例子：

http://jsfiddle.net/Xm4vW/74/

在许多图表中，我只想要一条RED LINE

更新1：

我在新的演示中尝试了redraw（）： http ： //jsfiddle.net/Xm4vW/80/

但它没有帮助。 如果问题不够明确，请告诉我。

Answer 1

没有什么比’Highcharts.each（xAxis.plotLinesAndBands，function（p）’。循环迭代图表并使用’removePlotLine（PlotLineID）’而不是’destroy（）’：

 for(i=0;i 

并在括号中设置id：

 id: 'myPlotLineId' 

这里是jsfiddle http://jsfiddle.net/asadsarwar89/bh4kz9rw/