ECharts日歷坐標(biāo)系屬性

2018-10-11 10:39 更新

calendar.zlevel   |   number

[ default: 0 ]

所有圖形的 zlevel 值。

zlevel 用于 Canvas 分層,不同 zlevel 值的圖形會(huì)放置在不同的 Canvas 中,Canvas 分層是一種常見的優(yōu)化手段。我們可以把一些圖形變化頻繁(例如有動(dòng)畫)的組件設(shè)置成一個(gè)單獨(dú)的zlevel。

需要注意的是過多的 Canvas 會(huì)引起內(nèi)存開銷的增大,在手機(jī)端上需要謹(jǐn)慎使用以防崩潰。 

zlevel 大的 Canvas 會(huì)放在 zlevel 小的 Canvas 的上面。

calendar.z   |   number

[ default: 2 ]

得到日歷坐標(biāo)系組件的所有圖形的 z 值。控制圖形的前后順序。z 值小的圖形會(huì)被 z 值大的圖形覆蓋。

z 相比 zlevel 優(yōu)先級(jí)更低,而且不會(huì)創(chuàng)建新的 Canvas。

calendar.left   |   string, number

[ default: 80 ]

日歷坐標(biāo)系組件離容器左側(cè)的距離。

left 的值可以是像 20 這樣的具體像素值,可以是像 '20%' 這樣相對(duì)于容器高寬的百分比,也可以是 'left', 'center', 'right'。

如果 left 的值為'left', 'center', 'right',組件會(huì)根據(jù)相應(yīng)的位置自動(dòng)對(duì)齊。

calendar.top   |   string, number

[ default: 60 ]

日歷坐標(biāo)系組件離容器上側(cè)的距離。

top 的值可以是像 20 這樣的具體像素值,可以是像 '20%' 這樣相對(duì)于容器高寬的百分比,也可以是 'top', 'middle', 'bottom'。

如果 top 的值為'top', 'middle', 'bottom',組件會(huì)根據(jù)相應(yīng)的位置自動(dòng)對(duì)齊。

calendar.right   |   string, number

[ default: 'auto' ]

日歷坐標(biāo)系組件離容器右側(cè)的距離。

right 的值可以是像 20 這樣的具體像素值,可以是像 '20%' 這樣相對(duì)于容器高寬的百分比。

默認(rèn)自適應(yīng)。

calendar.bottom   |   string, number

[ default: 'auto' ]

日歷坐標(biāo)系組件離容器下側(cè)的距離。

bottom 的值可以是像 20 這樣的具體像素值,可以是像 '20%' 這樣相對(duì)于容器高寬的百分比。

默認(rèn)自適應(yīng)。

calendar.width   |   number, string

[ default: auto ]

日歷坐標(biāo)的整體寬度

注意: 默認(rèn)cellSize 為20,若設(shè)置了width的值, 則cellSize中的寬度強(qiáng)制轉(zhuǎn)為auto;

calendar.height   |   number, string

[ default: auto ]

日歷坐標(biāo)的整體高度,

注意: 默認(rèn)cellSize 為20,若設(shè)置了height的值, 則cellSize中的高度強(qiáng)制轉(zhuǎn)為auto;

calendar.range   |   number, string, Array

必填項(xiàng),日歷坐標(biāo)的范圍,支持多種格式

使用示例:


// 某一年
range: 2017

// 某個(gè)月
range: '2017-02'

// 某個(gè)區(qū)間
range: ['2017-01-02', '2017-02-23']

// 注意 此寫法會(huì)識(shí)別為['2017-01-01', '2017-02-01']
range: ['2017-01', '2017-02']

calendar.cellSize   |   number, Array

[ default: 20 ]

設(shè)置日歷每格框的大小,可設(shè)置為單值或數(shù)組,其中,第一個(gè)元素是寬,第二個(gè)元素是高。 支持設(shè)置自適應(yīng):auto, 默認(rèn)為高寬均為20

使用示例:


// 設(shè)置寬高均為20
cellSize: 20

// 設(shè)置寬為20,高為40
cellSize: [20, 40]

// 設(shè)置寬高均為40
cellSize: [40]

// 設(shè)置寬高均自適應(yīng)
cellSize: 'auto'

// 設(shè)置寬自適應(yīng),高為40
cellSize: ['auto', 40]

calendar.orient   |   string

[ default: 'horizontal' ]

日歷坐標(biāo)的布局朝向。

可選:

  • 'horizontal'
  • 'vertical'

calendar.silent   |   boolean

[ default: false ]

圖形是否不響應(yīng)和觸發(fā)鼠標(biāo)事件,默認(rèn)為 false,即響應(yīng)和觸發(fā)鼠標(biāo)事件。

以上內(nèi)容是否對(duì)您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號(hào)
微信公眾號(hào)

編程獅公眾號(hào)