我可以在堆积条形图中使用两个“类别”数组吗？答案

【问题标题】：Can I use two "categories" arrays in a stacked bar chart?我可以在堆积条形图中使用两个“类别”数组吗？
【发布时间】：2016-05-10 17:17:05
【问题描述】：

我在 Highcharts 中使用堆积百分比条形图。（This jsfiddle 类似于我们的图表，源自 Highcharts 网站上的an example。）

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

我尝试使用多个 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]
    }]
});

【问题讨论】：

This discussion in the Highcharts forums 建议这是不可能的，但可能在未来某个不确定的时间。
是的，您可以使用第二个轴，并将第二组类别提供给该第二个轴。
哦，我知道你有那个部分 :) 你缺少的是你需要将第二个轴链接到第一个轴，或者必须附加一个数据系列。因此，为此，在您的第二个轴上添加 linkedTo: 0。小提琴：jsfiddle.net/jlbriggs/z4zkm8v5/2
@jlbriggs 你能把它作为答案发布吗？你是对的，小提琴展示了它的工作原理，我相信一旦我说服 Rails 通过几层抽象将第二个轴向下传递到 Highcharts，它就会在我的应用程序中工作。 ;-)

标签： highcharts bar-chart axes

【解决方案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
}]

更新的小提琴：

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

【讨论】：