如何以编程方式设置选择Highchats主细节图表? [英] How to programmatically set selection Highchats master-detail chart?

问题描述

我已根据Highcharts文档和此示例创建了自己的主从明细表:https://www.highcharts.com/demo/dynamic-master-detail

I have created my own master-detail chart following the Highcharts docs and this example: https://www.highcharts.com/demo/dynamic-master-detail

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

Eveything works fine but I would like to add a feature: When the chart is loaded the last 50 data points should automatically be selected in the master chart and thus shown in the detail chart.

我试图手动触发选择事件，但是没有成功.知道如何解决这个问题吗?

I tried to manually trigger the selection event but it did not work out. Any idea how to solve this?

推荐答案

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

You can fire selection event in chart load event and set correct extremes:

            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

这篇关于如何以编程方式设置选择Highchats主细节图表?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！