3

1 つの測定値と 3 つのディメンションを使用してデータを視覚化するグラフを作成しようとしています。1 つのディメンションを x 軸に、1 つをスタックとして、もう 1 つをシリーズのリストとして配置します。

HighCharts には、私が基礎として使用する積み上げグループ縦棒グラフがあります。私のjsfiddleを参照してください。

    series: [{
        name: 'John',
        color: '#ff4400',
        data: [5, 3, 4, 7, 2],
        stack: '2014'
    }, {
        name: 'Joe',
        color: '#44ff00',
        data: [3, 4, 4, 2, 5],
        stack: '2014'
    }, {
        name: 'John',
        color: '#ff4400',
        data: [2, 5, 6, 2, 1],
        showInLegend: false,
        stack: '2015'
    }, {
        name: 'Joe',
        data: [3, 0, 4, 4, 3],
        color: '#44ff00',
        showInLegend: false,
        stack: '2015'
    }]

ここに画像の説明を入力

スタック名を第 2 レベルの x 軸に表示できるようにしたいと考えています。group-pluginは知っていますが、スタックとは連携していないようです。

ヒントはありますか？

4

1 に答える 1

10

It might not be the best solution (so please keep 'm coming), but I now fake a dataseries.

See jsfiddle update

  xAxis: [{
            categories: ['Apples', 'Oranges', 'Pears', 'Grapes', 'Bananas']
        },
               {
            categories: ['2014', '2015', '2014', '2015', '2014', '2015','2014', '2015', '2014', '2015'],
                   opposite: true
        }],        
  series: [{
        name: 'John',
        color: '#ff4400',
        data: [5, 3, 4, 7, 2],
        stack: '2014',

    }, {
        name: 'Joe',
        color: '#44ff00',
        data: [3, 4, 4, 2, 5],
        stack: '2014',

    }, {
        name: 'John',
        color: '#ff4400',
        data: [2, 5, 6, 2, 1],
        showInLegend: false,
        stack: '2015'
    }, {
        name: 'Joe',
        data: [3, 0, 4, 4, 3],
        color: '#44ff00',
        showInLegend: false,
        stack: '2015'
    }, {
        name: '',
        data: [0, 0, 0,0, 0, 0,0, 0, 0,0],
        showInLegend: false,
        stack: '2015',
        xAxis: 1            
    }]

Result: enter image description here

Update

Fiddled around with fake axis labels: http://jsfiddle.net/b72e0vh4/8/ enter image description here

于 2015-06-24T14:36:08.193 に答える