HighChart：多个图表

Question

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

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

下面是我的图表分享的功能。

  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/

  

我想在许多图表中只有一条红线

更新1：

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

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

Answer 1

没有像'Highcharts.each（xAxis.plotLinesAndBands，function（p）'。循环迭代图表并使用'removePlotLine（PlotLineID）'代替'destroy（）'：

for(i=0;i<Highcharts.charts.length; i++){
    var chart=Highcharts.charts[i];
    chart.xAxis[0].removePlotLine('myPlotLineId');
}

在括号中设置id：

id: 'myPlotLineId'

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