更新图表的整个数据系列

Question

我想做的事情：我有一个基本的折线图，最初加载了一个数据数组（系列：[...]），这让我可以说x线。我还将在图表上方呈现x复选框。单击其中一个复选框后，相应的行应消失或显示。因此我正在收听点击事件，然后我想添加或删除一行。

问题：我无法弄清楚如何用新的系列替换整个系列。我发现的是setData（）方法，但它只适用于数据数组的项目。我还发现了addSeries（）方法，它将添加一个项目。并删除（）将删除特定项目。问题是，我不知道哪个项目是哪个。我想要的是隐藏一条线或显示它们，但始终在数据系列中包含完整的x行。我认为。

我还发现了方法update（），它允许我将新的配置对象传递给图表，但是如果我传递选项'series：newData（array）'则它不起作用。

我要么寻找一个选项，在开始时传递完整的数据数组，然后隐藏或显示一行，或者用任何给定的新数组覆盖整个系列数据。

希望这是可以理解的，有人可以指出我错过了什么！谢谢！

Answer 1

我找到了解决方案。我会在开头加载整个数据数组，并使用选项visible：false显示或隐藏初始显示的某些系列。

单击复选框，我需要找到正确的系列，然后有方法show（）和hide（）来操作运行时的可见属性。

chart.series[myIndex].show();
chart.series[myIndex].hide();

Answer 2

您可以使用setVisible方法进行系列化和绑定系列的复选框：

var checkboxes = document.getElementById('checkboxes').children;

for (var i = 0; i < checkboxes.length; i++) {
    (function(i) {
        checkboxes[i].addEventListener('change', function() {
            chart.series[i].setVisible(this.checked);
        });
    })(i);
}

现场演示：http://jsfiddle.net/BlackLabel/ur31g4j5/

API参考：https://api.highcharts.com/class-reference/Highcharts.Series#setVisible