Как программно установить выделение Highchats master-detail chart?

Question

Я создал свою собственную таблицу основных данных, следуя документам Highcharts и этому примеру: https://www.highcharts.com/demo/dynamic-master-detail

Eveything работает нормально, но я хотел бы добавить функцию: при загрузке диаграммы последние 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