javascript Highcharts - 如何以编程方式切换图例项并确定选择了哪些项

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/16073403/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-27 03:10:29  来源:igfitidea点击:

Highcharts - How to programmatically toggle legend items and determine which items are selected

javascriptjqueryhighcharts

提问by Markus Hay

So I have a couple of requests from our designers:

所以我们的设计师有几个要求:

1) Allow users to select/deselect all legend items via clicking a link outside the chart container. This means I need to programmatically toggle all items in the chart on or off, regardless if any are currently selected/deselected.

1) 允许用户通过单击图表容器外的链接来选择/取消选择所有图例项。这意味着我需要以编程方式打开或关闭图表中的所有项目,无论当前是否选择/取消选择任何项目。

2) Determine which particular legend items are selected (or enabled) in the chart so that we can generate another chart from the selections.

2) 确定在图表中选择(或启用)了哪些特定的图例项,以便我们可以从选择中生成另一个图表。

I don't see a way to do either using the API so I was wondering if anyone has come up with a possible solution for either (or both).

我没有看到使用 API 的方法,所以我想知道是否有人为其中一个(或两个)提出了可能的解决方案。

Thanks in advance for any guidance.

提前感谢您的任何指导。

回答by Strikers

Highcharts does allow us to toggle the legend states from outside.

Highcharts 确实允许我们从外部切换图例状态。

series[0].hide(); series[0].show();are provided by highcharts which we can use to implement the functionality you asked for.

series[0].hide(); series[0].show();由 highcharts 提供,我们可以使用它来实现您要求的功能。

here is a fiddle for your reference http://jsfiddle.net/gfNYk/1/

这是一个小提琴供您参考http://jsfiddle.net/gfNYk/1/

回答by c-urchin

series[i].visible is the property

series[i].visible 是属性

回答by Yush0

If you have a lot of series, hide()and show()can result in very bad performance. Alternatively you can use setVisible()on each series and redraw()at the end.

如果你有很多系列,hide()show()会导致非常糟糕的性能。或者,您可以在每个系列上使用setVisible()并在最后使用redraw()

    $('#uncheckAll').click(function(){
        var chart = $('#container').highcharts();
        var series = chart.series;
        for(i=0; i < chart.series.length; i++) {
            series[i].setVisible(false, false);
        }
        chart.redraw();
    });

    $('#checkAll').click(function(){
        var chart = $('#container').highcharts();
        var series = chart.series;
        for(i=0; i < chart.series.length; i++) {
            series[i].setVisible(true, true);
        }
        chart.redraw();
    });

to determine if a series is selected you can use the series.visibleproperty

要确定是否选择了系列,您可以使用series.visible属性