更新图表的整个数据系列

问题描述 投票:1回答:2

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

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

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

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

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

highcharts
2个回答
0
投票

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

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

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

0
投票

您可以使用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

© www.soinside.com 2019 - 2024. All rights reserved.