javascript - Highcharts - 动态获取可见系列名称

Question

我想制作一个函数，将 Highchart 实例中的所有可见系列名称动态发送到 PHP 函数。例如，在此图表中，我想获取此数组:[Salle, PR]。如果我点击 Internet，系列就会变得可见，我想获得 [Salle, Internet, PR]。

为此，我尝试使用 legendItemClick 事件并创建一个函数来检查每个系列是否可见以将其添加到数组中，但我不知道如何使用可见选项来执行此操作。

你有什么想法吗？

到目前为止，我没有太多代码可以分享:

plotOptions: {
        series: {
            events: {
                legendItemClick: function(){

                }
            }
        }
    }

Answer 1

如果您像这样保留指向图表的指针:

var ch = Highcharts.chart(_chart_data_);

然后您可以访问整个图表结构。您会感兴趣的是系列数组。

ch.series[]

它包含您所有系列的数组。 visible 属性设置为 true 的系列是当前显示的系列。所以，它可能是这样的:

var ch = Highcharts.chart(...

plotOptions: {
        series: {
            events: {
                legendItemClick: function(){
                   ch.series.forEach(function(sr){
                         if(sr.visible){
                            console.log(sr.name, "visible!");
                         }
                   });
                }
            }
        }
    }

...);

但是，您的方法有一个问题，即在实际图例上单击您对图例的当前操作尚未处理。因此您将看到的输出是当前点击之前的先前状态的输出。

因此，出于这个原因，您可以尝试在事件应用后使用 setTimeout 来获取您的列表:

         events: {
            legendItemClick: function(){
               setTimeout(
                  function(){ 
                      ch.series.forEach(
                          function(sr){
                              if(sr.visible){
                                 console.log(sr.name, "visible!");
                              }
                           }
                       )
                    },20);
                }
            }

试试这个并检查控制台日志:http://jsfiddle.net/op8142z0/