K線圖有哪些屬性？

K 線圖屬性

type

type 屬性的默認(rèn)值為 candlestick

coordinateSystem

該系列使用的坐標(biāo)系，可選值：

• 'cartesian2d'：使用二維的直角坐標(biāo)系（也稱笛卡爾坐標(biāo)系），通過下面介紹的 xAxisIndex 和 yAxisIndex 屬性指定相應(yīng)的坐標(biāo)軸組件。

xAxisIndex

使用的 x 軸的 index，在單個(gè)圖表實(shí)例中存在多個(gè) x 軸的時(shí)候有用。

yAxisIndex

使用的 y 軸的 index，在單個(gè)圖表實(shí)例中存在多個(gè) y 軸的時(shí)候有用。

name

設(shè)置 K 線圖的名稱，用于tooltip的顯示，legend 的圖例篩選，在 setOption 更新數(shù)據(jù)和配置項(xiàng)時(shí)用于指定對(duì)應(yīng)的系列。

legendHoverLink 

判斷 K線圖 是否啟用 圖例 hover 時(shí)的聯(lián)動(dòng)高亮，默認(rèn)值為 true，即啟動(dòng)聯(lián)動(dòng)高亮。

hoverAnimation 

是否開啟 hover 在 box 上的動(dòng)畫效果，默認(rèn)為 true。

layout

設(shè)置 K 線圖的布局方式，在沒有設(shè)置值的時(shí)候，它的默認(rèn)值為 null，可選值如下：

• 'horizontal'：水平排布各個(gè) box。
• 'vertical'：豎直排布各個(gè) box。

默認(rèn)值根據(jù)當(dāng)前坐標(biāo)系狀況決定：如果 category 軸為橫軸，則水平排布；否則豎直排布；如果沒有 category 軸則水平排布。

barWidth

 指定柱的寬度。可以使用絕對(duì)數(shù)值（如 10）或百分比（如 '20%'，表示 band width 的百分之多少）。默認(rèn)自適應(yīng)。

barMinWidth

指定柱的最大寬度?？梢允褂媒^對(duì)數(shù)值（如 10）或百分比（如 '20%'，表示 band width 的百分之多少）。默認(rèn)自適應(yīng)。

barMaxWidth

指定柱的最小寬度?？梢允褂媒^對(duì)數(shù)值（如 10）或百分比（如 '20%'，表示 band width 的百分之多少）。默認(rèn)自適應(yīng)。

itemStyle

candlestick 圖形樣式，有 normal 和 emphasis 兩個(gè)狀態(tài)。normal 是圖形在默認(rèn)狀態(tài)下的樣式；emphasis 是圖形在高亮狀態(tài)下的樣式，比如在鼠標(biāo)懸浮或者圖例聯(lián)動(dòng)高亮?xí)r。

dimensions

使用 dimensions 定義 data 每個(gè)維度的信息。例如：

series: {
    type: 'xxx',
    // 定義了每個(gè)維度的名稱。這個(gè)名稱會(huì)被顯示到默認(rèn)的 tooltip 中。
    dimensions: ['date', 'open', 'close', 'highest', 'lowest']
    data: [
        // 有了上面 dimensions 定義后，下面這五個(gè)維度的名稱分別為：
        // 'date', 'open', 'close', 'highest', 'lowest'
        [12, 44, 55, 66, 2],
        [23, 6, 16, 23, 1],
        ...
    ]
}

series: {
    type: 'xxx',
    dimensions: [
        null,                // 如果此維度不想給出定義，則使用 null 即可
        {type: 'ordinal'},   // 只定義此維度的類型。
                             // 'ordinal' 表示離散型，一般文本使用這種類型。
                             // 如果類型沒有被定義，會(huì)自動(dòng)猜測類型。
        {name: 'good', type: 'number'},
        'bad'                // 等同于 {name: 'bad'}
    ]
}

dimensions 數(shù)組中的每一項(xiàng)可以是：

• string，如 'someName'，等同于 {name: 'someName'}
• Object，屬性可以有：
  • name: string。
  • type: string，支持
    • number
    • float，即 Float64Array 
    • int，即 Int32Array 
    • ordinal，表示離散數(shù)據(jù)，一般指字符串。
    • time，表示時(shí)間類型，時(shí)間類型的支持參見 data

值得一提的是，當(dāng)定義了 dimensions 后，默認(rèn) tooltip 中對(duì)個(gè)維度的顯示，會(huì)變?yōu)椤贺Q排』，從而方便顯示每個(gè)維度的名稱。如果沒有定義 dimensions，則默認(rèn) tooltip 會(huì)橫排顯示，且只顯示數(shù)值沒有維度名稱可顯示。

encode

可以定義 data 的哪個(gè)維度被編碼成什么。比如：

series: {
    type: 'xxx',
    encode: {
        x: [3, 1, 5],      // 表示維度 3、1、5 映射到 x 軸。
        y: 2,              // 表示維度 2 映射到 y 軸。
        tooltip: [3, 2, 4] // 表示維度 3、2、4 會(huì)在 tooltip 中顯示。
        label: 3           // 表示 label 使用維度 3。
    },
    data: [
        // 每一列稱為一個(gè)『維度』。
        // 這里分別是維度 0、1、2、3、4。
        [12, 44, 55, 66, 2],
        [23, 6, 16, 23, 1],
        ...
    ]
}

encode 支持的屬性，根據(jù)坐標(biāo)系不同而不同。 對(duì)于 直角坐標(biāo)系（cartesian2d），支持 x、y。 對(duì)于 極坐標(biāo)系（polar），支持 radius、angle。 對(duì)于 地理坐標(biāo)系（geo），支持 lng，lat。 此外，均支持 tooltip 和 label 和 itemName（用于指定 tooltip 中數(shù)據(jù)項(xiàng)名稱）。

當(dāng)使用 dimensions 給維度定義名稱后，encode 中可直接引用名稱，例如：

series: {
    type: 'xxx',
    dimensions: ['date', 'open', 'close', 'highest', 'lowest'],
    encode: {
        x: 'date',
        y: ['open', 'close', 'highest', 'lowest']
    },
    data: [ ... ]
}

data[i]

數(shù)據(jù)格式是如下的二維數(shù)組。

[
    [2320.26, 2320.26, 2287.3,  2362.94],
    [2300,    2291.3,  2288.26, 2308.38],
    { // 數(shù)據(jù)項(xiàng)也可以是 Object，從而里面能含有對(duì)此數(shù)據(jù)項(xiàng)的特殊設(shè)置。
        value: [2300,    2291.3,  2288.26, 2308.38],
        itemStyle: {...}
    },
    ...
]

二維數(shù)組的每一數(shù)組項(xiàng)（上例中的每行）是渲染一個(gè) box，它含有四個(gè)量值，依次是：

[open, close, lowest, highest] （即：[開盤值, 收盤值, 最低值, 最高值]）

markPoint

設(shè)置 K 線圖的標(biāo)注。

markLine

設(shè)置 K 線圖的標(biāo)線。

markArea

設(shè)置 K 線圖的標(biāo)域，常用于標(biāo)記圖表中某個(gè)范圍的數(shù)據(jù)，例如標(biāo)出某段時(shí)間投放了廣告。

zlevel

K 線圖所有圖形的 zlevel 值。默認(rèn)值為 0。

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 的上面。

z

K 線圖組件的所有圖形的 z 值。默認(rèn)值為 2。

z 值用于控制圖形的前后順序。z 值小的圖形會(huì)被 z 值大的圖形覆蓋。

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

silent

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

animationDuration

初始動(dòng)畫的時(shí)長，默認(rèn)值為 300，支持回調(diào)函數(shù)，可以通過每個(gè)數(shù)據(jù)返回不同的 delay 時(shí)間實(shí)現(xiàn)更戲劇的初始動(dòng)畫效果：

animationDuration: function (idx) {
    // 越往后的數(shù)據(jù)延遲越大
    return idx * 100;
}

animationEasing

初始動(dòng)畫的緩動(dòng)效果，默認(rèn)為 linear。不同的緩動(dòng)效果可以參考 緩動(dòng)示例。

animationDelay

初始動(dòng)畫的延遲，支持回調(diào)函數(shù)，可以通過每個(gè)數(shù)據(jù)返回不同的 delay 時(shí)間實(shí)現(xiàn)更戲劇的初始動(dòng)畫效果。

如下示例：

animationDelay: function (idx) {
    // 越往后的數(shù)據(jù)延遲越大
    return idx * 100;
}

也可以看該示例