Javascript 在HighCharts中xAxis上具有负值和类别的柱状图

嗯，我在网络应用程序中使用highcharts。 下面是在柱状图中显示人口统计数据的任务，如图所示：

我现在举的只是下一个例子：

---

目前，在有一定空间的图形中间显示类别是一个问题。在我的示例中，偏移量不是根据数据生成的，因此不是所有情况下都可以使用两个y轴，这两个y轴将使用“顶”和“高”来定义位置

演示：

海图。海图‘容器’{ 图表：{ 类型：“列” }, 标题：{ 正文：“水果消费总量，按性别分组” }, xAxis：{ 类别：[‘苹果’、‘橘子’、‘梨’、‘葡萄’、‘香蕉’]， 偏移量：-150， 线宽：0， 宽度：0 }, 亚克斯：[{ allowDecimals:false， 标题：{ 文本：“水果数量”， y:100， x:-10 }, 前50名， 身高：124 },{ 标题：{ 文本：空 }, 前200名， 身高：150， 偏移量：0 }], 工具提示：{ 格式化程序：函数{ return+this.x++ this.series.name+'：'+this.y++ “总计：”+this.point.stackTotal； } }, 打印选项：{ 专栏：{ 堆叠：“正常” } }, 系列：[{ 姓名：'约翰'， 数据：[5,3,4,7,2]， }, { 名字：'乔'， 亚克西斯:1,， 数据：[-3，-4，-4，-2，-5]， }] };

---

现在看来这是我想要的。谢谢还有一个问题-如何使柱的高度相对于y轴和y轴？因为我需要隐藏轴上的标签。。。现在，正如你们可能看到的，负边上的值16看起来大于正边上的值20，负边上的最大值和最小值，可能会起作用，但可能有更多的自动解决方案…@demo不幸的是，我没有比上面提到的最小值，最大值更好的了。

Highcharts.chart('container', {

chart: {
    type: 'column'
},

title: {
    text: 'Total fruit consumtion, grouped by gender'
},

xAxis: {
    categories: ['Apples', 'Oranges', 'Pears', 'Grapes', 'Bananas'],
    offset: -150
},

yAxis: {
    allowDecimals: false,
    title: {
        text: 'Number of fruits'
    }
},

tooltip: {
    formatter: function () {
        return '<b>' + this.x + '</b><br/>' +
            this.series.name + ': ' + this.y + '<br/>' +
            'Total: ' + this.point.stackTotal;
    }
},

plotOptions: {
    column: {
        stacking: 'normal'
    }
},

series: [{
    name: 'John',
    data: [5, 3, 4, 7, 2],
}, {
    name: 'Joe',
    data: [-3, -4, -4, -2, -5],
}]

});