highcharts - 如何配置 Highcharts 中的选项以允许异步进行多个向下钻取？

Question

我正在尝试将 Highcharts 中的以下选项转换为具有多个向下钻取的多个系列。问题是我已经更改了循环以在这些点上取得进展，以便添加两个向下钻取系列。然而，在我写的循环中，似乎是这样的，在一个人完成循环之后，点数组被空值覆盖，这使得整个事情变得无关紧要。

我是这些选项的初学者，在花了很多时间之后我无法破解它。解释和解决方案将是以下问题的理想答案:“我如何通过多个向下钻取执行以下操作？”都是对数据集的异步请求。

我从

开始

        options.chart = options.chart || {};
        options.chart.events = options.chart.events || {};
        var dd = options.chart.events.drilldown || function(e) {};
        options.chart.events.drilldown = function(e) {
            var chart = this;
            chart._drilldowns = chart._drilldowns || {};
            var series = chart._drilldowns[e.point.drilldown];
            if (series) {
                e.seriesOptions = series;
                chart.addSeriesAsDrilldown(e.point, series);
                dd(e);
            }
            if (!e.seriesOptions) {
                chart.showLoading('Fetching data...');
                $.getJSON(
                    '%(url)s?' + analytics.get_form_data(),
                    function(drilldowns) {
                        chart.hideLoading();
                        chart._drilldowns = drilldowns;
                        var series = drilldowns[e.point.drilldown];
                        chart.addSeriesAsDrilldown(e.point, series);
                        e.seriesOptions = series;
                        dd(e);
                    }
                );
            }
        };
    ''' % {'url': self.get_drilldown_url()}

并且我尝试将第二部分更改为:

...
                    function(drilldowns) {
                        chart.hideLoading();
                        chart._drilldowns = drilldowns;
                        e.points.forEach(function(value, key){
                            var series = drilldowns[value.drilldown];
                            chart.addSeriesAsDrilldown(value, series);
                        })
                        e.seriesOptions = series;
                        dd(e);
                    }
                );
            }
        };

但我并没有深入了解我的两个系列。我实际上收到了 Property xAxis of null is not allowed 错误，因为当我第二次执行循环时，点集已更改为 null。

更新

我们最终使用 promises 修复了(实际上是一个同事做的!)。我们将其设计为等到第一个异步数据请求被检索到，然后在每个请求上调用 addSingleSeriesAsDrilldown 直到我们到达最后一个(从图表状态派生)，此时我们调用 addSeriesAsDrilldown 将 applyDrilldown 作为代码的一部分。

Answer 1

这不是官方 API 的一部分，但通过这种方式您可以获得多个下钻:http://jsfiddle.net/p2xw9416/

在最低级别的 AJAX 请求中(如果您有多个请求)，将每个系列添加为单个对象:

chart.hideLoading();
chart.addSingleSeriesAsDrilldown(e.point, series_1);
chart.addSingleSeriesAsDrilldown(e.point, series_2);
chart.applyDrilldown(); // update && animate