Question

我正在尝试创建一个向下钻取Highcharts列图。只要数据是硬编码的，我就可以使用这些示例并使其工作。我也可以从MySQL数据库中获取数据。

我需要知道的是如何打电话给这个系列。

示例：

/// This needs to be data from the MySQL (a total sum) of X-data
name = 'Browser brands', 
data = [{
y: 55.11,
color: colors[0],
////// this drill down needs the a breakdown of the data
drilldown: {
name: 'MSIE versions',
categories: ['MSIE 6.0', 'MSIE 7.0', 'MSIE 8.0', 'MSIE 9.0'],
data: [10.85, 7.35, 33.06, 2.81],
color: colors[0]
}
 ///////// I need another drill that will show a breakdown of the data again
}
/// This needs to be data from the MySQL (a total sum) of y-data
name = 'Browser brands', 
data = [{
y: 55.11,
color: colors[0],
////// this drill down needs the a breakdown of the data
drilldown: {
name: 'MSIE versions',
categories: ['MSIE 6.0', 'MSIE 7.0', 'MSIE 8.0', 'MSIE 9.0'],
data: [10.85, 7.35, 33.06, 2.81],
color: colors[0]
}
///////// I need another drill that will show a breakdown of the data again
}

所以在理论上我怎么能得到一个图表，第一个系列显示总X，Y，Z 当单击任何一个时，它会显示该数据的分解，当单击下一列中的任何一个时，再次显示数据的进一步细分。

据我所知，有多个MySQL查询，多个数组。我只是不明白如何在需要时给他们打电话

Answer 1

看一下这部分：

click: function() {
                 var drilldown = this.drilldown;
                 if (drilldown) { // drill down

                     this.series.chart.setTitle({
                         text: drilldown.name
                     });

                     setChart(drilldown.name, drilldown.categories, drilldown.data, drilldown.color, drilldown.level);
                 } else { // restore
                    setChart(name, categories, data, null, level);
                 }
              }

只需在那里使用$ .getJSON（），并在$ .getJSON（）内部使用setChart（）方法和AJAX中的数据。这样的事情（未经测试）：

click: function() {
                 var drilldown = this.drilldown;
                 if (drilldown) { // drill down
                     var chart = this.series.chart;
                     $.getJSON(...., function(data){
                         chart.setTitle({
                             text: data.name
                         });
                         setChart(data.name, data.categories, data.data, data.color, data.level);
                     });
                 } else { // restore
                    setChart(name, categories, data, null, level);
                 }
              }

Highcharts：列向下钻取：JSON

1 个答案: