javascript - 如何删除通过 Highcharts 中的 Chart.renderer 添加的文本

Question

我已在图表中添加标签，而不是图例 ( see fiddle here )。绘制图表后，通过 Chart.renderer.text 将这些系列标签附加到图表上，用户可以单击按钮来添加其他系列，这反过来又会抑制其他线条(成功)。然而，我现在怎样才能摆脱这些标签——它们现在矗立在虚空中。

示例:这是完整的行和标签集:

这是当单击按钮以显示附加行时，它同时抑制其他四行:

我添加这样的标签:

chart.renderer.text('Volcanic', 1170, 360)
  .css({
    fontSize: '13px',
    color: '#7d7d7d'
  })
.add();

现在，这些标签仍然存在 - 但应该消失。我有什么办法可以实现这个目标吗？是否可以添加ID，然后调用chart.renderer.byID(xy).remove()或类似的东西？

Answer 1

您可以通过调用 .destroy() 来删除渲染的对象。您所需要做的就是将对象分配给变量。

var objLabel; // assign the var so it is reachable in your scope

objLabel = $('#container').highcharts().renderer.text('Volcanic', 100, 30)
  .css({
    fontSize: '13px',
    color: '#7d7d7d'
  })
.add();

这里有一个 fiddle 来证明这一点:http://jsfiddle.net/jfpq6zcg/