2013-06-12 87 views
3

下面是測試:Highcharts:如何在xAxis旋轉角度爲90°時將標籤固定在頂部?

$(function() { 
var chart; 
$(document).ready(function() { 
    chart = new Highcharts.Chart({ 
     chart: { 
      renderTo: 'container', 
      type: 'column' 
     }, 
     title: { 
      text: 'Long xAxis legends', 
     }, 
     xAxis: { 
      categories: ['a long category name', 'another long category name', 'a very long category name', 'Thats enormous', 'short', 'a long category name', 'another long category name', 'a very long category name', 'Thats enormous', 'short'], 
      labels:{ 
       rotation:90, 
       y:100, 
      }, 
     }, 
     series: [ 
      { 
      name: 'Some values', 
      data: [10, 20, 53, 2.51, 1.35, 10, 20, 53, 2.51, 1.35], 
      }, 
      { 
      name: 'Other values', 
      data: [22.40, 0.15, 40, 10.73, 13, 22, 15, 40.11, 10, 13], 
      } 
     ], 
     legend: { 
      layout: 'vertical', 
      align: 'top', 
      verticalAlign: 'top', 
      x: 50, 
      y: 65, 
      borderWidth: 0, 
      margin: 30 
     }, 
    }); 
}); 

}); http://jsfiddle.net/Y5Qhm/1/

我想有一個垂直xAxis標籤頂部對齊的圖表。

在我真實的情況下,我會有更多的數據,所以我不能做的除了輪換。

我已經試過了X軸參數: http://api.highcharts.com/highcharts#xAxis.labels

我想對齊會做的伎倆,但是當我把它添加到旋轉參數時, 表壞了。

在此先感謝。

回答

4

用途:

align: 'top' 

這樣的:

labels:{ 
    rotation:90, 
    align: 'top' 
    //y:100, 
}, 

的jsfiddle:http://jsfiddle.net/Y5Qhm/2/

+0

這個偉大的工程,但對我來說,我的數據,這不:我有更多的超過60個標籤(> 60個產品要顯示爲圖表),並且當我添加該參數時,我有一個js錯誤:未捕獲RangeError:超出最大調用堆棧大小 – Overdose

+0

嘗試對齊:'left',should w ork也是:http://jsfiddle.net/Y5Qhm/3/ –

+0

這個很好用謝謝你的 –