如果值爲負，Highcharts會將數據標籤對齊x軸

Question

我有一個啓用了數據標籤的Highcharts圖。默認情況下，數據標籤附加到每個數據欄的末尾（請參閱此小提琴：http://jsfiddle.net/cyphun/NHCvW）。

是否可以移動負數據標籤並將它們顯示在x軸的旁邊而不是欄的末端？這裏是我想要做什麼篡改屏幕截圖：

http://cl.ly/image/2G3F0I2l2m1z

這裏是我的Highcharts示例代碼副本：

$(function() { 
    var chart; 
    $(document).ready(function() { 
     chart = new Highcharts.Chart({ 
      chart: { 
       renderTo: 'container', 
       type: 'column' 
      }, 
      plotOptions: { 
       column: { 
        dataLabels: { 
         enabled: true, 
         useHTML: true, 
         style: { 
          color: '#252525', 
          fontWeight: 'bold' 
         } 
        } 
       } 
      }, 
      title: { 
       text: 'Column chart with negative values' 
      }, 
      xAxis: { 
       categories: ['Apples', 'Oranges', 'Pears', 'Grapes', 'Bananas'] 
      }, 
      tooltip: { 
       formatter: function() { 
        return ''+ 
         this.series.name +': '+ this.y +''; 
       } 
      }, 
      credits: { 
       enabled: false 
      }, 
      series: [{ 
       name: 'Jane', 
       data: [2, -2, -3, 2, 1] 
      }] 
     }); 
    }); 

}); 

感謝您的幫助！

Answer 1

您可以通過使用stackLabels並設置dataLabels的y（位置y）屬性來做到這一點。你也應該將verticalLine的verticalAlign設置爲'top'。

plotOptions: { 
    column: { 
     dataLabels: { 
      enabled: true, 
      useHTML: true, 
      style: { 
       color: '#252525', 
       fontWeight: 'bold' 
      }, 
      verticalAlign : 'top', 
      y: -15 
     } 
    } 
} 

演示：http://jsfiddle.net/NHCvW/49/