highchart axis datetime + categories

Question

ハイチャートを使用すると、タイプがdatetimeのときに追加のカテゴリを軸に追加できますか？

Highcharts.chart('container', { 

    chart: { 
     pankey:'shift', 
     panning:true, 
     type: 'column', 
     zoomType:'xy' 
    }, 
    series: { 
     allowPointSelect: true, 
     cursor: 'pointer', 
     stacking: 'normal', 
    }, 
    xAxis: { 
     type:'datetime', 
     dateTimeLableFormats:{ 
      day:'%e. %b', 
      hour:'%H', 
      month:'%b \'%Y', 
      year:'%Y' 
     } 
    }, 
series: [{ 
     data: [ 
     [1451606400000, 179594.83], 
     [1454284800000, 176105.09], 
     [1456790400000, 195630.06], 
     [1459468800000, 183081.82], 
     [1462060800000, 187955.4], 
     [1464739200000, 187483.48], 
     [1467331200000, 318999.15], 
     [1470009600000, 176279.28], 
     [1472688000000, 74438.96] 
     ], 
     name: 'Cost', 
     stack: 'Cost' 
    }, 
    { 
     data: [ 
     [1451606400000, 179594.83], 
     [1454284800000, 176105.09], 
     [1456790400000, 195630.06], 
     [1459468800000, 183081.82], 
     [1462060800000, 187955.4], 
     [1464739200000, 187483.48], 
     [1467331200000, 318999.15], 
     [1470009600000, 176279.28], 
     [1472688000000, 74438.96] 
     ], 
     name: 'Cost', 
     stack: 'Cost1' 
    }], 
    tooltip: { 
     crosshairs: true, 
     headerFormat:'<b>{point.x:%e. %b} : {series.options.stack}</b>', 
     pointFormat:'<b>{point.name}: </b> {point.y}<br><b>Total: </b>{point.total}' 
    } 


}); 

サンプルjsfiddle：https://jsfiddle.net/m1yoga/kby5973t/

は、スタック名Cost1 & Cost2を参照してくださいX軸上に表示したいと思います。このjsfiddleデータは単なるサンプルであり、コードの背後にはスタック名が異なる多くのシリーズ名が生成されます。

関連リンク：フィドルで遊んProper x-axis for Highcharts stack group column

Answer 1

と、この作業を得ました。ここで

$(function() { 
var ugly = ['apples','oranges']; 
    var cats = ugly.concat(ugly).concat(ugly).concat(ugly).concat(ugly); 
    var zeroes = []; 
    cats.forEach(function() {zeroes.push(0);}); 

var options = { 

    chart: { 
     pankey:'shift', 
     panning:true, 
     type: 'column', 
     zoomType:'xy' 
    }, 
    series: { 
     allowPointSelect: true, 
     cursor: 'pointer', 
     stacking: 'normal', 
    }, 
    xAxis: [ 
    { 
     categories:cats, 
     lineColor:'#ffffff' 
    }, 
    { 
      type:'datetime', 
     dateTimeLableFormats:{ 
      day:'%e. %b', 
      hour:'%H', 
      month:'%b \'%Y', 
      year:'%Y' 
     } 
    } 
    ], 

    series: [{ 
      id: 'cost', 
     data: [ 
     [1451606400000, 179594.83], 
     [1454284800000, 176105.09], 
     [1456790400000, 195630.06], 
     [1459468800000, 183081.82], 
     [1462060800000, 187955.4], 
     [1464739200000, 187483.48], 
     [1467331200000, 318999.15], 
     [1470009600000, 176279.28], 
     [1472688000000, 74438.96] 
     ], 
     name: 'Cost', 
     stack: 'Cost', 
     xAxis: 1 
    }, 
    { 
     linkedTo: 'cost', 
     data: [ 
     [1451606400000, 179594.83], 
     [1454284800000, 176105.09], 
     [1456790400000, 195630.06], 
     [1459468800000, 183081.82], 
     [1462060800000, 187955.4], 
     [1464739200000, 187483.48], 
     [1467331200000, 318999.15], 
     [1470009600000, 176279.28], 
     [1472688000000, 74438.96] 
     ], 
     name: 'Cost', 
     stack: 'Cost1', 
     xAxis:1 
    }, 
    { 
      name: '', 
      data: zeroes, 
      showInLegend: false, 
      stack: '2015', 

     } 
    ], 
    tooltip: { 
     crosshairs: true, 
     headerFormat:'<b>{point.x:%e. %b} : {series.options.stack}</b>', 
     pointFormat:'<b>{point.name}: </b> {point.y}<br><b>Total: </b>{point.total}' 
    } 

}; 

    $('#container').highcharts(options); 
}); 

はフィドルです： https://jsfiddle.net/m1yoga/afu3s3sj/3/