Question

有没有办法让＃datetime＆＃39;对于主系列上的xAxis类型，但是当单击一个系列时，让钻取使用当时的类别？

在这个jsfiddle示例（http://jsfiddle.net/kadams/3e3xqv7e/）中，您可以看到＆＃39;类别＆＃39;用作xAxis类型，深入分析数据正确使用深入分析系列名称＆＃39; A＆＃39;＆＃39; B＆＃39;＆＃39; C＆＃39;在xAxis上。但是，当xAxis类型更改为＆＃39; datetime＆＃39;时，毫秒时间用于＆＃39; x＆＃39;价值代替主要系列的名称，钻取中的类别不显示＆＃39; A＆＃39; B＆＃39;或＆＃39; C＆＃39;了。只是毫无意义的约会。

更新澄清 - 我更愿意使用＆＃39; datetime＆＃39;键入而不是＆＃39;类别＆＃39;键入格式为日期的值，因为Highcharts会抛出太多的刻度线＆＃39; x轴很大时出错：http://www.highcharts.com/errors/19。我给出了＆＃39;类别＆＃39;在下面的小提琴中输入的例子只是为了证明＆＃39; A＆＃39;＆＃39; B＆＃39;＆＃39; C＆＃39;当类型不是＆＃39; datetime＆＃39;时，请正确显示。

$(function () {
    $('#container').highcharts({
        chart: {
            type: 'column',
        },
        xAxis: {
            type: 'category',
            //  type: 'datetime',
            dateTimeLabelFormats: {
                hour: '%l:%M %p'
            }
        },
        legend: {
            enabled: false
        },
        series: [{
            name: 'Total',
            colorByPoint: true,
            data: [{
                y: 8,
                drilldown: 'Bob',
                name: 'Bob', //used with 'category' xAxis type
                x: 1420700400000 //used with 'datetime' xAxis type
            }]
        }],
        drilldown: {
            series: [{
                id: 'Bob',
                name: 'Bob',
                data: [{
                    name: 'A',
                    y: 3
                }, {
                    name: 'B',
                    y: 3
                }, {
                    name: 'C',
                    y: 2
                }]
            }]
        }
    });
});

Answer 1

我找到了解决问题的方法！ Sebastian Bochan给了我一些想法。您需要分离xAxis并为每个类型设置不同的类型。因此，您必须在此处添加类别Highcharts's way。

xAxis: [{
         id: 0,
         type: 'datetime'
       },
       {
         id: 1,
         type: 'categories',
         categories: data.categories
       }
   ]

然后你必须在你的系列中添加这个代码，以便将它与你的新轴连接起来。

drilldown: {
      series: [{
        name: "test",
        id: "test",
        xAxis: 1, // <--- your desired X axis ID
        data: [
          [your data]
        ]
      }]
    }

可能你会在底部图表上看到一个小差异，但一切都适合我。

我希望对你有所帮助;）

Answer 2

您需要将其添加到xAxis：

labels: {
        formatter: function() {
              return Highcharts.dateFormat('%a %d %b', this.value);
         }
},

查看fiddle。

带有＆＃39; datetime＆＃39;的Highcharts图表xAxis - 在明细时使用类别

2 个答案: