highcharts系列之xAxis


xAxis定義的是x坐標軸的配置選項。默認情況下,x軸指的是水平軸,特殊指定的時候也可以作為垂直的軸使用,在多坐標系中,xAxis是有多個配置好了的軸object的數組。

下面來看一下,xAxis常用的屬性都有哪些:

 

屬性  

數據類型

默認值

說明

type

String

datetime

可選,值為linear,logarithmic或者datetime;如果為datetime,則數值是百萬分之一秒,標尺會自動放在適當位置,如整小時,或者day的位置。

tickInterval

mixed

null

設置橫標標尺的間隔長度, 1*24*3600*1000為一天

tickLength

num

5

每個間隔長度默認的像素值

labels

object

aligncenter

x0

y0

Enabled:true

Formatterfunction(){

Return this.value;}

Overflow: null;

Reotation: 0;

sraggerLines: null;

Step: null;

Style: {color:#6D869F,

Font-weight: bold};

useHTML: false;

Align:可選,leftrightcenter left表示刻度線在刻度名稱的左邊;

X:刻度偏離刻度線x軸的像素,正數為向右偏移,負數為向左偏移;

Y:刻度偏離刻度線y軸的像素,正數為向下偏移,負數為向上偏移。

Enabled:啟用和禁用標簽;

Formatter:回調javascript函數格式化標簽,值通過this.value得到,this的附加屬性,axischartisFirst

overFlow:處理水平軸的一出標簽。可以是undefinedjustify,如果是justify,標簽將不會在繪圖區外渲染,如果有足夠的空間去移動它,它將會在邊緣對齊,否則會被移除。

Rotation:標簽旋轉的角度。

Step:每隔n個的標簽顯示在軸上,設置stepn,每隔n-1個顯示標簽。

Style: 標簽的css樣式。

useHTML:是否使用HTML渲染標簽。

allowDecimals

Boolean

true

軸上的刻度是否允許使用小數

alternateGridColor

 

null

使用備用的網格顏色時,表格會隔行變色

categories

 

[]

x軸的名稱。比如 categories: ['Apples', 'Bananas', 'Oranges']

dateTimeLabelFormats

 

{second:'%H:%M:%S',

minute:'%H:%M',

hour:'%H:%M',

day:'%e. %b',

week:'%e. %b',

month:'%b \'%y',

year:'%Y'}

時間軸,標尺會根據合適的單位自動計算.

endOnTick

Boolean

false

是否強制軸以一個刻度結束。使用該項和maxpadding項來控制軸的末端

gridLineColor

 

#C0C0C0

繪圖區網格線的顏色

id

 

null

軸的id,可以在圖表渲染后,通過chartget()來獲得一個點

lineColor

 

#C0D0E0

軸本身的線的顏色

lineWidth

 

1.0

軸本身的線的寬度

linkedTo

 

null

指向本軸的另一個軸的索引,當一個軸指向主軸時,它將有和主軸一樣的極端值,但是通過minmax或者setExtremes可以進行更改。它也可以用來顯示附加信息,或者通過復制標尺來緩解圖表顯示

max

 

null

軸的最大值,如果是null,最大值會被自動計算。如果endOnTick設置為true,則最大值會被四舍五入。實際上的最大值也會被chart.alignTicks影響。

maxpadding

 

0.01

最大值相對於軸的長度的填充間距。padding0.05時,會取100px長得軸的5px長度。

min

 

null

軸的最小值,如果是null,會自動計算

minpadding

 

0.01

最小值相對於軸的長度的填充間距。

minrange

 

null

軸顯示的最小范圍,整個軸將不被允許跨越這個最小間隔。比如一個時間軸,最小單位是毫秒

minTickInterval

 

null

軸值允許的最小刻度間隔,比如縮放軸用來顯示每天的數據,可以用來阻止軸上顯示的時間。

offset

 

0.0

繪圖區到軸線的像素間距,正的偏移量會讓軸的線,便簽,和刻度遠離繪圖區

opposite

 

false

是否顯示在正常顯示的對面一側顯示軸。正常顯示的是垂直的左邊,水平的下面,因此對面就是垂直的右邊,和水平的上邊。

plotBands

 

 

參考plotBands

plotLines

 

 

參考plotLines

reversed

 

false

是否逆轉軸,以使得最高的點最接近起點。

showEmpty

 

null

是否顯示軸線和標題,當軸不包含數據時。

showFirstLabel

Boolean

true

是否顯示第一個刻度標簽

showLastLabel

Boolean

false

是否顯示最后一個刻度標簽

startofWeek

 

1.0

對於時間軸,決定軸之間的刻度。 0=周日,1=周一。

startOnTick

 

false

是否強制軸以刻度開始。結合maxPadding選項使用控制軸的開始。

tickColor

 

#C0D0E0

主刻度的顏色

tickInterval

 

null

主刻度的間隔,以軸單位為單位。當為null時,線性軸的刻度間隔約等於tickPixelInterval,時間軸的約為時間間隔。

tickLength

 

5.0

主刻度的長度

tickPixelInterval

 

X:72

Y:100

tickIntervalnull的時候,該選項設置了刻度標志的大約間隔的像素值。

tickPosition

 

outside

可以是inside或者outside。刻度標記相對於軸線的位置。

tickPositioner

 

null

回調函數,返回一個定義刻度在軸上的排列的數組

tickPositions

 

null

定義軸刻度的數組

tickWidth

 

1.0

主刻度的像素寬度

tickmarkPlacement

 

between

僅用在分類軸上。如果是on,刻度標記在分類的正中間,如果是between,刻度在兩個分類的之間。

afterSetExtremes

fn

null

Event x軸事件,相對於setExtremes事件的事件。在最后的最小值和最大值都被計算且校正過minRange后觸發該事件

setExtremes

 

null

當軸的最大值和最小值設置的時候,被觸發,無論是調用.setExtremes()方法或者是選擇了圖表的一個區域。this關鍵字是指軸對象自己。唯一的參數event被傳遞到函數中。用戶設置的新的最大值和最小值可以通過event.minevent.max查找。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM