1

我正在尝试创建一个向下钻取的 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 查询，多个数组。我只是不明白如何在需要时给他们打电话

4

1 回答 1

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);
                 }
              }
于 2013-02-14T14:00:01.893 回答