javascript - 为什么这 2 个 HighCharts 代码不相同？ (或者有没有办法在创建图表对象后修改对 legendItemClick 的调用？)

Question

有人知道为什么这两个片段的工作方式完全不同吗？

在第一个代码片段中，我在 JSON 中声明了一个函数:

                    plotOptions : {
                    series : {
                        events: {
                            legendItemClick: function () {
                                var visibility = this.visible ? 'visible' : 'hidden';
                                if (this.visible) {
                                    this.chart.container.style.height = '100px';
                                    this.chart.reflow();
                                }
                                else {
                                    this.chart.container.style.height = '400px';
                                    this.chart.reflow();
                                }
                                //this.chart.collapse();
                            }
                        }
                    }
                },

请参阅此处的代码片段:first snippet on jsfiddle

注意:如果您将文件内容保存在硬盘上，则在 Chrome 上效果会更好。

如果单击图例，您将看到它将折叠图表(调用该函数)。在第二个片段中，我稍后声明该函数:

                plotOptions : {
                    series : {
                        events: {
                        }
                    }
                },

…

    myChart.options.plotOptions.series.events.legendItemClick = function () {
        var visibility = this.visible ? 'visible' : 'hidden';
        if (this.visible) {
            this.chart.container.style.height = '100px';
            this.chart.reflow();
        }
        else {
            this.chart.container.style.height = '400px';
            this.chart.reflow();
        }
        //this.chart.collapse();
    };

请参阅此处的代码片段:second snippet on jsfiddle

在这种情况下，如果您单击图例，则不会调用该函数，并且图表也不会折叠。

我猜答案就在 highcharts.js 中的某个地方，但是在哪里呢？查看 Highcharts.Legend API 文档时我不知道该怎么做:https://api.highcharts.com/class-reference/Highcharts.Legend#toc0

有没有办法在创建图表对象后修改对 legendItemClick 的调用？

p.s.:顺便说一下，在调试器中查看 myChart.options.plotOptions.series.events.legendItemClick 的 2 个代码片段时，我看到了完全相同的结果:

Answer 1

1. 请注意，第二个函数不执行任何操作。默认功能正在触发。
2. 如果您想自定义默认功能，您应该考虑使用Event.preventDefault