HighCharts:向下钻到堆叠的列

Question

你好，大家好！我正在尝试创建一个特定的HighChart，但我不确定如何格式化我的drilldown数据，我在互联网上找不到任何例子！

这个JSfiddle显示了我已经走了多远：http://jsfiddle.net/ma50685a/37/。

HighChart应该将被删除的评论可视化。前两条是过滤后的注释的平均数量。当钻取被激活，我会有堆叠列的网站和四个类别的评论已经被过滤(讨厌的评论，垃圾邮件等)。

有人能帮我解决这个问题，或者有一个如何格式化钻取数据的例子吗？

Answer 1

要有一个堆叠的列，您需要多个系列，在钻取之后要有多个系列，您必须动态地添加该系列，例如在钻取事件上。

下面的对象的每个属性表示一个系列，它与顶级系列名称相关联。对象'1‘将出现在单击第一列后，并将跨越4个类别。

var drilldowns = {
          1: {
            stacking: 'normal',
            name: 'facebook',
            color: Highcharts.getOptions().colors[0],
            data: [
              ['nasty comments', 2],
              ['spam', 3],
              ['category-3', 10],
              ['category-4', 15]
            ]
          },

          66: {
            name: 'second-column-drilldown',
            data: [
              ['second-column-drilldown-point', 10]
            ]
          }
        };

下一个对象'1‘将与来自drilldowns.1对象的数据堆叠：

var drilldowns2 = {
          1: {
            color: Highcharts.getOptions().colors[1],
            colorIndex: 1,
            stacking: 'normal',
            name: 'youtube',
            data: [
              ['nasty comments', 5],
              ['spam', 10],
              ['category-3', 10],
              ['category-4', 15]
            ]
          }
        };

最后，必须添加该系列，并触发钻取。

var series = drilldowns[e.point.name],
            series2 = drilldowns2[e.point.name],
            series3 = drilldowns3[e.point.name];

        this.addSingleSeriesAsDrilldown(e.point, series);
        this.addSingleSeriesAsDrilldown(e.point, series2);
        this.addSingleSeriesAsDrilldown(e.point, series3);
        this.applyDrilldown();

示例：https://jsfiddle.net/ahjkouuh/

Answer 2

您只是忘了包括钻取js (http://jsfiddle.net/ma50685a/38/)

在highstock之后添加以下脚本：<script src="https://code.highcharts.com/modules/drilldown.js"></script>

编辑:对不起，我没把问题看对了.这工作：http://jsfiddle.net/ma50685a/39/

在此发现：http://www.semantia.com.au/articles/highcharts-drill-down-stacked-columns/