我可以在堆叠条形图中使用两个 "categories" 数组吗？

Question

我在 Highcharts 中使用堆积百分比条形图。（This jsfiddle is similar to our chart, derived from an example 在 Highcharts 网站上。）

我想做的是在图表右侧添加另一组 "category" 标签。左侧有每个条形图的标签，我想在右侧显示平均值。（计算这个平均值并将其放入 Highcharts 配置数据中是在服务器端完成的；在 fiddle 中，我只是硬编码了一些虚拟值。）

我试过使用多个 x 轴配置，将平均值类别标记为 opposite: true 以将它们放在右侧。我可以看到添加这个正在改变图表，特别是如果我不把它们放在 opposite 上，但标签实际上并没有在我尝试过的任何配置中显示。这可能吗？如果是这样，我需要做什么我还没有做？

这是jsFiddle示例中的配置：

$('#container').highcharts({
    chart: {
        type: 'bar'
    },
    title: {
        text: 'Stacked bar chart'
    },
    xAxis: [{
        categories: ['Apples', 'Oranges', 'Pears', 'Grapes', 'Bananas']
    }, {
        title: 'Avg.',
        categories: [3.0, 3.3, 3.6, 2.6, 3.0],
      opposite: true
    }],
    yAxis: {
        min: 0,
        title: {
            text: 'Percent fruit consumption'
        }
    },
    plotOptions: {
        series: {
            stacking: 'percent'
        }
    },
    series: [{
        name: 'John',
        data: [5, 3, 4, 7, 2]
    }, {
        name: 'Jane',
        data: [2, 2, 3, 2, 1]
    }, {
        name: 'Joe',
        data: [3, 4, 4, 2, 5]
    }]
});

Answer 1

您设置了正确的轴，但目前图表不知道如何处理第二个轴。

Highcharts 要求轴附有数据系列，或者它链接到另一个轴，以便显示它。

如果您添加 linkedTo 属性，它将按要求工作：

xAxis: [{
    categories: ['Apples', 'Oranges', 'Pears', 'Grapes', 'Bananas']
}, {
    linkedTo: 0, // <-- now the chart will show it, as long as axis 0 is able to be shown
    title: 'Avg.',
    categories: [3.0, 3.3, 3.6, 2.6, 3.0],
    opposite: true
}]

已更新 fiddle：

http://jsfiddle.net/jlbriggs/z4zkm8v5/2/

我可以在堆叠条形图中使用两个 "categories" 数组吗？

Can I use two "categories" arrays in a stacked bar chart?

axes

bar-chart

highcharts