如何以编程方式设置选择Highchats主细节图表？

Question

我已经根据Highcharts文档和以下示例创建了自己的主从图表：https://www.highcharts.com/demo/dynamic-master-detail

一切正常，但我想添加一个功能：加载图表时，应在主图表中自动选择最后50个数据点，并在详细图表中显示。

我尝试手动触发选择事件，但没有成功。知道如何解决这个问题吗？

Answer 1

您可以在图表加载事件中触发selection事件，并设置正确的极端值：

            chart: {
                ...
                events: {
                    load: function() {
                        var points = this.series[0].points,
                            xAxis = this.xAxis[0];

                        Highcharts.fireEvent(this, 'selection', {
                            xAxis: [{
                                min: points[points.length - 51].x,
                                max: points[points.length - 1].x
                            }],

                        });
                    },

                    selection: function(event) {
                        ...
                    }
                }
            }

实时演示：https://jsfiddle.net/BlackLabel/xy8qug9h/

API：https://api.highcharts.com/highcharts/chart.events.load