HighCharts解析之xAxis——x軸的樣式


xAxis:x軸選項

參數

描述

默認值

allowDecimals

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

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

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

false

events

事件回調,支持addSeries方法,click方法,load方法,selection方法等的回調函數。

 

gridLineColor

繪圖區網格線的顏色

#C0C0C0

gridLineDashStyle

網格線的點或線的樣式

Solid

gridLineWidth

繪圖區網格線的寬度

0.0

id

軸的id。可以在圖表渲染后,通過chart.get()獲得一個點

null

labels

設置X軸各分類名稱的樣式style,格式formatter,角度rotation等。

array

lineColor

軸本身的線的顏色。

#C0D0E0

lineWidth

 軸本身的線的寬度

1.0

linkedTo

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

null

max

軸的最大值。如果是null,最大值被自動計算。如果endOnTick選項是true,max的值可能會被四舍五入。實際的最大值也會被chart.alignTicks影響。

null 

 maxPadding

 最大值相對於軸的長度的填充間距。padding值為0.05時會取100px長的軸的5px長度。

 0.01 

 maxZoom

 已過期。V2.2版本后改名為minRange.

 null

 min

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

 null

 minPadding

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

 null

 minTickInterval

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

 null

minorGridLineColor 

 最小級別,次級的網格線的顏色。

  #E0E0E0

 minorGridLineDashStyle

 次級網格線的破折號或點的樣式。

 Solid 

 minorGridLineWidth

 次級網格線的寬度。

  1.0

 minorTickColor

 次級刻度標記的顏色。

 #A0A0A0 

minorTickInterval 

 次級網格線的刻度間隔,以標尺為單位。在線性軸中,如果是‘auto’,次級刻度間隔是刻度間隔的五分之一。如果是null,次級刻度將不顯示。

null 

 minorTickLength

 次級刻度的像素長度

  2.0

minorTickPosition 

 次級刻度相對於軸線的位置。可以是inside或outside

outside 

minorTickWidth 

 次級刻度的像素寬度

0.0 

 offset

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

  0.0

opposite 

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

 false

 plotBands

 

 

 plotLines

 

 

reversed 

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

false  

 showEmpty

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

null 

 showFirstLabel

 是否顯示第一個刻度標簽

true 

 showLastLabel

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

false 

startOfWeek 

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

1.0 

startOnTick 

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

 false

 tickColor

 主刻度的顏色

 #C0D0E0 

 tickInterval

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

 null 

tickLength 

 主刻度的長度

 5.0

tickPixelInterval 

 當tickInterval是null的時候,該選項設置了刻度標志的大約間隔的像素值

 Y軸:72,X軸:100

tickPosition 

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

outside 

 tickPositioner

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

null 

 tickPositions

 定義軸刻度的數組

null 

 tickWidth

 主刻度的像素寬度

1.0 

 tickmarkPlacement

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

  between

title 

 X軸名稱,支持text、enabled、align、rotation、style等屬性

 

type 

 軸的類型。可以是linear,logarithmic,或者datetime

 linear

 events x軸事件

參數

描述

默認值

afterSetExtremes

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

null

setExtremes

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

null

 lables x軸標簽

參數

描述

默認值

align

水平對齊方式。可以是’left’,’right’,’center’.

center

 enabled

 啟用或禁用軸標簽

true 

formatter 

 回調javascript函數格式化標簽。值通過this.value得到。this的附加屬性,axis,chart,isFirst和isLast。

 function() {

return this.value;}

 overflow

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

 null 

 rotation

 標簽旋轉的角度

 0

staggerLines 

 僅在水平軸使用。把標簽分布在幾行中以增大或縮小標簽的空間

null 

step 

  每隔n個的標簽顯示在軸上。設置step為n。設置step為2,每隔1個顯示標簽

null 

style 

 標簽的CSS樣式

style: {

color:'#6D869F',

fontWeight:  'bold'

}

 

 useHTML

  是否使用HTML渲染標簽

false 

 x

 標簽相對於軸刻度的位置的x的偏移量

 0 

 y

 標簽相對於軸刻度的位置的y的偏移量


免責聲明!

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



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