一、Echarts中的action

echarts中支援的圖表行為，通過dispatchAction觸發。

1.highlight 高亮指定的資料圖形

dispatchAction({
    type: 'highlight',
    // 可選，系列 index，可以是一個數組指定多個系列
    seriesIndex?: number|Array,
    // 可選，系列名稱，可以是一個數組指定多個系列
    seriesName?: string|Array,
    // 可選，資料的 index
    dataIndex?: number,
    // 可選，資料的 名稱
    name?: string
})
 

2.downplay 取消高亮指定的資料圖形

dispatchAction({
    type: 'downplay',
    // 可選，系列 index，可以是一個數組指定多個系列
    seriesIndex?: number|Array,
    // 可選，系列名稱，可以是一個數組指定多個系列
    seriesName?: string|Array,
    // 可選，資料的 index
    dataIndex?: number,
    // 可選，資料的 名稱
    name?: string
})

3.圖例相關的行為，必須引入圖例元件之後才能使用

1）legendSelect（選中圖例）

dispatchAction({
    type: 'legendSelect',
    // 圖例名稱
    name: string
})

2）legendUnSelect（取消選中圖例）

dispatchAction({
    type: 'legendUnSelect',
    // 圖例名稱
    name: string
})

3）legendToggleSelect（切換圖例的選中狀態）

dispatchAction({
    type: 'legendToggleSelect',
    // 圖例名稱
    name: string
})

4）legendScroll（控制圖例的滾動），當legend.type是scroll的時候有效

dispatchAction({
    type: 'legendScroll',
    scrollDataIndex: number,
    legendId: string
})

4. 提示框元件相關行為，必須引入提示框元件之後才能引用

1）showTip（顯示提示框）
有兩種使用方式
A：指定在相對容器的位置處顯示提示框，如果指定的位置無法顯示則無效。

dispatchAction({
    type:'showTip',
    //螢幕上的x座標
    x: number,
    //螢幕上的y座標
    y: number,
    //本次顯示tooltip的位置，只在本次action生效。預設則使用option中定義的tooltip位置
    position: Array.<number> | String | Function
})

B: 指定資料圖形，根據tooltip的配置項進行顯示提示框

dispatch({
    type: 'showTip',
    // 系列的 index，在 tooltip 的 trigger 為 axis 的時候可選。
    seriesIndex?: number,
    // 資料的 index，如果不指定也可以通過 name 屬性根據名稱指定資料
    dataIndex?: number,
    // 可選，資料名稱，在有 dataIndex 的時候忽略
    name?: string,
    // 本次顯示 tooltip 的位置。只在本次 action 中生效。
    // 預設則使用 option 中定義的 tooltip 位置。
    position: Array.<number>|string|Function,
})

2）hideTip 隱藏提示框

dispatchAction({
    type:'hideTip'
})

5.資料區域縮放元件、視覺對映元件、時間軸元件、工具欄元件相關行為

1. 資料區域縮放元件,必須引入資料區域縮放元件之後才能使用（dataZoom）

dispatchAction({
    type: 'dataZoom',
    // 可選，dataZoom 元件的 index，多個 dataZoom 元件時有用，預設為 0
    dataZoomIndex: number,
    // 開始位置的百分比，0 - 100
    start: number,
    // 結束位置的百分比，0 - 100
    end: number,
    // 開始位置的數值
    startValue: number,
    // 結束位置的數值
    endValue: number
})

2.關閉或啟動toolbox中的dataZoom的刷選狀態（takeGlobalCursor）

myChart.dispatchAction({
    type: 'takeGlobalCursor',
    key: 'dataZoomSelect',
    // 啟動或關閉
    dataZoomSelectActive: true
});

3.視覺對映元件，只能在引入視覺對映元件之後才能使用（visualMap）
選取對映的數值範圍：selectDataRange

dispatchAction({
    type: 'selectDataRange',
    // 可選，visualMap 元件的 index，多個 visualMap 元件時有用，預設為 0
    visualMapIndex: number,
    // 連續型 visualMap 和 離散型 visualMap 不一樣
    // 連續型的是一個表示數值範圍的陣列。
    // 離散型的是一個物件，鍵值是類目或者分段的索引。值是 `true`, `false`
    selected: Object|Array
})

4.時間軸元件，同理引入之後才能使用
1）設定當前的時間點：timelineChange

dispatchAction({
    type: 'timelineChange',
    // 時間點的 index
    currentIndex: number
})

2)切換時間軸的播放狀態：timelinePlayChange

dispatchAction({
    type: 'timelinePlayChange',
    // 播放狀態，true 為自動播放
    playState: boolean
})

5.工具欄元件相關行為，同理引入之後才能使用
重置option：restore

dispatchAction({
    type: 'restore'
})

6.餅圖、地圖元件、地圖圖表、關係圖、區域選擇相關行為
1）餅圖

• 選中指定的餅圖扇形（pieSelect）
• 取消選中指定的餅圖扇形（pieUnSelect）
• 切換指定的選中的餅圖扇形狀態（pieToggleSelect）

dispatchAction({
    type: 'pieSelect | pieUnSelect | pieToggleSelect',
    // 可選，系列 index，可以是一個數組指定多個系列
    seriesIndex?: number|Array,
    // 可選，系列名稱，可以是一個數組指定多個系列
    seriesName?: string|Array,
    // 資料的 index，如果不指定也可以通過 name 屬性根據名稱指定資料
    dataIndex?: number,
    // 可選，資料名稱，在有 dataIndex 的時候忽略
    name?: string
})

2)地圖元件

• 選中指定的地圖區域（geoSelect）
• 取消選中的指定地圖區域（geoUnSelect）
• 切換指定的地圖區域的選中狀態（geoToggleSelect）

dispatchAction({
    type: 'geoSelect | geoUnSelect | geoToggleSelect',
    // 可選，系列 index，可以是一個數組指定多個系列
    seriesIndex?: number|Array,
    // 可選，系列名稱，可以是一個數組指定多個系列
    seriesName?: string|Array,
    // 資料的 index，如果不指定也可以通過 name 屬性根據名稱指定資料
    dataIndex?: number,
    // 可選，資料名稱，在有 dataIndex 的時候忽略
    name?: string
})

3)地圖圖表元件
同地圖元件類似，也有三個行為，如下：

• 選中指定的地圖區域（mapSelect）
• 取消選中的指定地圖區域（mapUnSelect）
• 切換指定的地圖區域的選中狀態（mapToggleSelect）

dispatchAction({
    type: 'mapToggleSelect',
    // 可選，系列 index，可以是一個數組指定多個系列
    seriesIndex?: number|Array,
    // 可選，系列名稱，可以是一個數組指定多個系列
    seriesName?: string|Array,
    // 資料的 index，如果不指定也可以通過 name 屬性根據名稱指定資料
    dataIndex?: number,
    // 可選，資料名稱，在有 dataIndex 的時候忽略
    name?: string
})

4)關係圖
關係圖行為使用，也得引入關係圖

• focusNodeAdjacency 將指定的節點以及其周邊相鄰的節點高亮
• unFocusNodeAdjacency 將指定的節點以及其周邊相鄰的節點取消高亮

5）區域選擇相關的行為

• brush：觸發此action可設定或刪除chart中的選框
• takeGlobalCursor：刷選模式的開關。使用此Action可將當前滑鼠變為刷選狀態

dispatchAction({
    type: 'takeGlobalCursor',
    // 如果想變為“可刷選狀態”，必須設定。不設定則會關閉“可刷選狀態”。
    key: 'brush',
    brushOption: {
        // 參見 brush 元件的 brushType。如果設定為 false 則關閉“可刷選狀態”。
        brushType: string,
        // 參見 brush 元件的 brushMode。如果不設定，則取 brush 元件的 brushMode 設定。
        brushMode: string
    }
});