You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@echarts.apache.org by sh...@apache.org on 2020/11/10 12:10:15 UTC
[incubator-echarts-doc] branch next updated: update events and
action doc
This is an automated email from the ASF dual-hosted git repository.
shenyi pushed a commit to branch next
in repository https://gitbox.apache.org/repos/asf/incubator-echarts-doc.git
The following commit(s) were added to refs/heads/next by this push:
new 23e7a85 update events and action doc
23e7a85 is described below
commit 23e7a856d14821109e751b9acbd2a6b00fd543b8
Author: pissang <bm...@gmail.com>
AuthorDate: Tue Nov 10 20:10:01 2020 +0800
update events and action doc
---
en/api/action.md | 80 +++++++++++++++++++++++++--------------
en/api/events.md | 39 +++++++++++++++----
zh/api/action.md | 112 +++++++++++++++++++------------------------------------
zh/api/events.md | 42 ++++++++++++++-------
4 files changed, 151 insertions(+), 122 deletions(-)
diff --git a/en/api/action.md b/en/api/action.md
index 906bf1d..282dad5 100644
--- a/en/api/action.md
+++ b/en/api/action.md
@@ -18,7 +18,7 @@ Chart actions supported by ECharts are triggered through [dispatchAction](~echar
## highlight(Action)
-Highlights the given graphic element.
+Highlights specified data.
Series is specified through `seriesName` or `seriesIndex`. If another data needs to be specified, then use `dataIndex` or `name`.
```js
@@ -34,7 +34,7 @@ dispatchAction({
## downplay(Action)
-Cancels highlighting graphic element.
+Downplay specified data.
Series is specified through `seriesName` or `seriesIndex`. If another data needs to be specified, then use `dataIndex` or `name`.
```js
@@ -48,11 +48,48 @@ dispatchAction({
})
```
+## select(Action)
+
+Select specified data. Selected data will apply the style of [select](option.html#series-bar.select).
+
+```js
+dispatchAction({
+ type: 'select',
+ // 图例名称
+ {{ use: action-series-query }}
+ {{ use: action-data-query }}
+})
+```
+
+## unselect(Action)
+
+Unselect specified data.
+
+```js
+dispatchAction({
+ type: 'unselect',
+ // 图例名称
+ {{ use: action-series-query }}
+ {{ use: action-data-query }}
+})
+```
+
+## toggleSelected(Action)
+
+Toggle selected status of specified data.
+
+```js
+dispatchAction({
+ type: 'toggleSelected',
+ // 图例名称
+ {{ use: action-series-query }}
+ {{ use: action-data-query }}
+})
+```
-<!--============= legend ==========-->
## legend
-Actions related to [legend component](option.html#legend), which should include [legend component](option.html#legend) before use.
+Actions related to [legend component](option.html#legend), [legend component](option.html#legend) should be imported before use.
### legendSelect(Action)
Selects legend.
@@ -126,10 +163,9 @@ dispatchAction({
**EVENT:** [legendscroll](~events.legendscroll)
-<!--============= tooltip ==========-->
## tooltip
-Actions related to [tooltip component](option.html#tooltip), which should include [tooltip component](option.html#tooltip) before use.
+Actions related to [tooltip component](option.html#tooltip), [tooltip component](option.html#tooltip) should be imported before use.
### showTip(Action)
@@ -177,10 +213,9 @@ dispatchAction({
})
```
-<!--============= dataZoom ==========-->
## dataZoom
-Actions related to [data region zoom component](option.html#dataZoom), which should include [data region zoom component](option.html#dataZoom) before use.
+Actions related to [data region zoom component](option.html#dataZoom), [data region zoom component](option.html#dataZoom) should be imported before use.
### dataZoom(Action)
@@ -219,10 +254,9 @@ myChart.dispatchAction({
-<!--============= visualMap ==========-->
## visualMap
-Actions related to [visual mapping component](option.html#visualMap), which should include [visual mapping component](option.html#visualMap) before use.
+Actions related to [visual mapping component](option.html#visualMap), [visual mapping component](option.html#visualMap) should be imported before use.
### selectDataRange(Action)
@@ -256,10 +290,9 @@ myChart.dispatchAction({
**EVENT:** [datarangeselected](~events.datarangeselected)
-<!--============= timeline ==========-->
## timeline
-Actions related to [timeline component](option.html#timeline), which should include [timeline component](option.html#timeline) before use.
+Actions related to [timeline component](option.html#timeline), [timeline component](option.html#timeline) should be imported before use.
### timelineChange(Action)
@@ -289,10 +322,9 @@ dispatchAction({
**EVENT:** [timelineplaychanged](~events.timelineplaychanged)
-<!--============= toolbox ==========-->
## toolbox
-Actions related to [toolbox component](option.html#toolbox), which should include [toolbox component](option.html#toolbox) before use.
+Actions related to [toolbox component](option.html#toolbox), [toolbox component](option.html#toolbox) should be imported before use.
### restore(Action)
Resets option.
@@ -304,28 +336,19 @@ dispatchAction({
```
**EVENT:** [restore](~events.restore)
-<!--============= pie ==========-->
-## pie
-Actions related to [pie chart](option.html#series-pie), which should include [pie chart](option.html#series-pie) before use.
+## geo
-{{ use: action-select(
- componentType='pie',
- name='pie chart'
-) }}
+Actions related to [geo](option.html#geo) component, [geo](option.html#geo) should be imported before use.
-<!--============= map ==========-->
-## map
-Actions related to [map](option.html#series-map), which should include [map](option.html#series-map) before use.
{{ use: action-select(
- componentType='map',
- name='map area'
+ componentType='geo',
+ name='geo region'
) }}
-<!--============= graph ==========-->
## graph
-Actions related to [graph](option.html#series-graph), which should include [graph](option.html#series-graph) before use.
+Actions related to [graph](option.html#series-graph), [graph](option.html#series-graph) should be imported before use.
### focusNodeAdjacency(Action)
@@ -370,7 +393,6 @@ Event [unfocusNodeAdjacency](~event.unfocusNodeAdjacency) will be thrown finally
-<!--============= brush ==========-->
## brush
[brush](option.html#brush) related actions.
diff --git a/en/api/events.md b/en/api/events.md
index dfe5e84..9b6e81e 100644
--- a/en/api/events.md
+++ b/en/api/events.md
@@ -80,6 +80,35 @@ See [Events and actions in ECharts](tutorial.html#Events%20and%20actions%20in%20
### globalout(Event)
### contextmenu(Event)
+## highlight(Event)
+
+**ACTION:** [highlight](~action.highlight)
+
+Event of data highlight.
+
+## downplay(Event)
+
+**ACTION:** [downplay](~action.downplay)
+
+Event of data downplay.
+
+## selectchanged(Event)
+
+**ACTION:** [toggleSelected](~action.toggleSelected), [select](~action.select), [unselect](~action.unselect)
+
+Event emitted when data selection is changed.
+
+```js
+{
+ type: 'selectchanged',
+ fromAction: 'select' | 'toggleSelected' | 'unselect',
+ // Grouped by series.
+ selected: ({
+ dataIndex: number[], seriesIndex: number
+ })[]
+}
+```
+
## legendselectchanged(Event)
**ACTION:** [legendToggleSelect](~action.legend.legendToggleSelect)
Event emitted after legend selecting state changes.
@@ -249,13 +278,9 @@ Switching event of [magic type tool in toolbox](option.html#toolbox.feature.magi
{{ use: event-select(
- componentType='pie',
- name='pie chart'
-) }}
-
-{{ use: event-select(
- componentType='map',
- name='map region'
+ componentType='geo',
+ componentTypeFull='geo',
+ name=''
) }}
diff --git a/zh/api/action.md b/zh/api/action.md
index f7892d1..4f1d58b 100644
--- a/zh/api/action.md
+++ b/zh/api/action.md
@@ -48,8 +48,46 @@ dispatchAction({
})
```
+## select(Action)
+
+选中指定的数据。选中数据会使用 [select](option.html#series-bar.select) 配置的样式。
+
+```js
+dispatchAction({
+ type: 'select',
+ // 图例名称
+ {{ use: action-series-query }}
+ {{ use: action-data-query }}
+})
+```
+
+## unselect(Action)
+
+取消选中指定的数据。
+
+```js
+dispatchAction({
+ type: 'unselect',
+ // 图例名称
+ {{ use: action-series-query }}
+ {{ use: action-data-query }}
+})
+```
+
+## toggleSelected(Action)
+
+切换选中状态
+
+```js
+dispatchAction({
+ type: 'toggleSelected',
+ // 图例名称
+ {{ use: action-series-query }}
+ {{ use: action-data-query }}
+})
+```
+
-<!--============= legend ==========-->
## legend
[图例组件](option.html#legend)相关的行为，必须引入[图例组件](option.html#legend)后才能使用。
@@ -124,7 +162,6 @@ dispatchAction({
**EVENT:** [legendscroll](~events.legendscroll)
-<!--============= tooltip ==========-->
## tooltip
[提示框组件](option.html#tooltip)相关的行为，必须引入[提示框组件](option.html#tooltip)后才能使用。
@@ -176,7 +213,6 @@ dispatchAction({
})
```
-<!--============= dataZoom ==========-->
## dataZoom
[数据区域缩放组件](option.html#dataZoom)相关的行为，必须引入[数据区域缩放组件](option.html#dataZoom)后才能使用。
@@ -217,7 +253,6 @@ myChart.dispatchAction({
```
-<!--============= visualMap ==========-->
## visualMap
[视觉映射组件](option.html#visualMap)相关的行为，必须引入[视觉映射组件](option.html#visualMap)后才能使用。
@@ -254,7 +289,6 @@ myChart.dispatchAction({
**EVENT:** [datarangeselected](~events.datarangeselected)
-<!--============= timeline ==========-->
## timeline
[时间轴组件](option.html#timeline)相关的行为，必须引入[时间轴组件](option.html#timeline)后才能使用。
@@ -287,7 +321,6 @@ dispatchAction({
**EVENT:** [timelineplaychanged](~events.timelineplaychanged)
-<!--============= toolbox ==========-->
## toolbox
[工具栏组件](option.html#toolbox)相关的行为，必须引入[工具栏组件](option.html#toolbox)后才能使用。
@@ -302,17 +335,6 @@ dispatchAction({
```
**EVENT:** [restore](~events.restore)
-<!--============= pie ==========-->
-## pie
-
-[饼图](option.html#series-pie)相关的行为，必须引入[饼图](option.html#series-pie)后才能使用。
-
-{{ use: action-select(
- componentType='pie',
- name='饼图扇形'
-) }}
-
-<!--============= geo ==========-->
## geo
[地图组件](option.html#series-geo)相关的行为，必须引入[地图组件](option.html#geo)后才能使用。
@@ -321,62 +343,6 @@ dispatchAction({
name='地图区域'
) }}
-
-<!--============= map ==========-->
-## map
-[地图图表](option.html#series-map)相关的行为，必须引入[地图图表](option.html#series-map)后才能使用。
-
-{{ use: action-select(
- componentType='map',
- name='地图区域'
-) }}
-
-
-<!--============= graph ==========-->
-## graph
-[关系图](option.html#series-graph) 相关的行为，必须引入 [关系图](option.html#series-graph) 后才能使用。
-
-### focusNodeAdjacency(Action)
-
-将指定的节点以及其所有邻接节点高亮。
-
-```js
-dispatchAction({
- type: 'focusNodeAdjacency',
-
- // 使用 seriesId 或 seriesIndex 或 seriesName 来指定 series.
- seriesId: 'xxx',
- seriesIndex: 0,
- seriesName: 'nnn',
-
- // 使用 dataIndex 来指定目标节点，或者使用 edgeDataIndex 来指定目标边。
- dataIndex: 12,
- edgeDataIndex: 5
-})
-```
-
-最后会抛出 [focusNodeAdjacency](~event.focusNodeAdjacency) 事件。
-
-### unfocusNodeAdjacency(Action)
-
-将指定的节点以及其所有邻接节点高亮。
-
-```js
-dispatchAction({
- type: 'unfocusNodeAdjacency',
-
- // 使用 seriesId 或 seriesIndex 或 seriesName 来定位 series.
- seriesId: 'xxx',
- seriesIndex: 0,
- seriesName: 'nnn'
-})
-```
-
-最后会抛出 [unfocusNodeAdjacency](~event.unfocusNodeAdjacency) 事件。
-
-
-
-<!--============= brush ==========-->
## brush
[区域选择](option.html#brush)相关的行为。
diff --git a/zh/api/events.md b/zh/api/events.md
index 168da46..2a5edb3 100644
--- a/zh/api/events.md
+++ b/zh/api/events.md
@@ -77,6 +77,35 @@ chart.on('mouseover', {seriesIndex: 1, name: 'xx'}, function (params) {
### globalout(Event)
### contextmenu(Event)
+## highlight(Event)
+
+**ACTION:** [highlight](~action.highlight)
+
+高亮事件。
+
+## downplay(Event)
+
+**ACTION:** [downplay](~action.downplay)
+
+取消高亮事件。
+
+## selectchanged(Event)
+
+**ACTION:** [toggleSelected](~action.toggleSelected), [select](~action.select), [unselect](~action.unselect)
+
+在数据选中状态发生变化时触发的事件
+
+```js
+{
+ type: 'selectchanged',
+ fromAction: 'select' | 'toggleSelected' | 'unselect',
+ // 按系列分组的选中项列表
+ selected: ({
+ dataIndex: number[], seriesIndex: number
+ })[]
+}
+```
+
## legendselectchanged(Event)
**ACTION:** [legendToggleSelect](~action.legend.legendToggleSelect)
切换图例选中状态后的事件。
@@ -251,19 +280,6 @@ chart.on('mouseover', {seriesIndex: 1, name: 'xx'}, function (params) {
name='地图区域'
) }}
-{{ use: event-select(
- componentType='pie',
- componentTypeFull='series-pie',
- name='饼图扇形'
-) }}
-
-{{ use: event-select(
- componentType='map',
- componentTypeFull='series-map',
- name='地图区域'
-) }}
-
-
## axisareaselected(Event)
[平行坐标轴 (Parallel)](option.html#parallelAxis)范围选取事件。
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org