highcharts - 将 Highcharts dataLabels 固定到底部

Question

我一直在搜索，但找不到将 Highcharts dataLabels 固定到图形底部的简单方法。对于柱形图，我正在寻找如下内容：

 80 -  ┌──┐        ┌──┐ ┌──┐
 40 -  |  | ┌──┐   |  | |  |
  0 -|_|__|_|__|_|_|__|_|__|_|
        80   40     80   80
         Cat 1       Cat 2

谢谢你的帮助。

Answer 1

您可以迭代每个 elemetn，并使用 translate 函数，它允许“移动”SVG 元素。

var bottom = chart.plotHeight - 20;

    $.each(chart.series[0].data,function(i,data){

        data.dataLabel.attr({
            y: bottom
        });
    });

看一个简单的例子：

http://jsfiddle.net/wMLg6/39/

Answer 2

我认为下面的代码可以帮助你。stacking是诀窍。y根据您的图表更改值。

plotOptions:{

    column:{
        stacking:'normal',
    dataLabels:{
        enabled:true,
        verticalAlign:'bottom',
        y:40
    }
    },
},