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/09/09 08:17:33 UTC

[incubator-echarts-doc] branch next updated: add en doc for states.

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 3240cbb  add en doc for states.
3240cbb is described below

commit 3240cbbd6943c32319e76b104a8f52606a2d1747
Author: pissang <bm...@gmail.com>
AuthorDate: Wed Sep 9 16:17:18 2020 +0800

    add en doc for states.
---
 editor/common/blockHelper.js              |   2 +-
 en-src/option/partial/focus-blur-scope.md |  48 ------
 en-src/option/partial/label-layout.md     | 136 ---------------
 en-src/option/partial/selected-mode.md    |  15 --
 en/option/component/geo-common.md         |  42 +++--
 en/option/component/geo.md                |  22 ++-
 en/option/partial/focus-blur-scope.md     |  26 ++-
 en/option/partial/label-layout.md         |  72 ++++----
 en/option/partial/mark-area.md            |  30 ++++
 en/option/partial/mark-line.md            |  31 ++++
 en/option/partial/mark-point.md           |  35 ++++
 en/option/partial/selected-mode.md        |   2 +-
 en/option/partial/zr-graphic.md           |  48 +++++-
 en/option/series/bar.md                   |  20 +--
 en/option/series/boxplot.md               |  73 ++++++--
 en/option/series/candlestick.md           |  68 ++++++--
 en/option/series/custom.md                |   4 +
 en/option/series/effectScatter.md         |  72 ++++++--
 en/option/series/funnel.md                |  96 ++++++-----
 en/option/series/graph.md                 | 178 +++++++++++++-------
 en/option/series/heatmap.md               |  46 +++++-
 en/option/series/line.md                  |  99 ++++++++---
 en/option/series/lines.md                 |  63 +++++--
 en/option/series/map.md                   |  42 +++--
 en/option/series/pictorialBar.md          |  70 ++++++--
 en/option/series/pie.md                   | 105 +++++++-----
 en/option/series/radar.md                 |  90 ++++++----
 en/option/series/sankey.md                | 137 ++++++++++-----
 en/option/series/scatter.md               |  78 ++++++---
 en/option/series/sunburst.md              | 185 +++++++++++----------
 en/option/series/themeRiver.md            |  56 +++++--
 en/option/series/tree.md                  | 109 +++++++++---
 en/option/series/treemap.md               | 266 ++++++++++++++++--------------
 package.json                              |   4 +-
 tool/patchLanguage.js                     |   2 +-
 zh/option/component/geo.md                |   2 +-
 zh/option/partial/label-layout.md         |   6 +-
 zh/option/series/effectScatter.md         |  12 +-
 zh/option/series/funnel.md                |   4 +
 39 files changed, 1486 insertions(+), 910 deletions(-)

diff --git a/editor/common/blockHelper.js b/editor/common/blockHelper.js
index eb2e340..6f2e531 100644
--- a/editor/common/blockHelper.js
+++ b/editor/common/blockHelper.js
@@ -240,7 +240,7 @@ module.exports.updateBlocksKeys = function (blocks) {
             baseKey = uiControlKeyNoDuplicate(`uicontrol:${scopeKey}`);
         }
 
-        block.key = allKeyNoDuplicate(baseKey) ;
+        block.key = allKeyNoDuplicate(baseKey);
     }
 };
 
diff --git a/en-src/option/partial/focus-blur-scope.md b/en-src/option/partial/focus-blur-scope.md
deleted file mode 100644
index 8d035d9..0000000
--- a/en-src/option/partial/focus-blur-scope.md
+++ /dev/null
@@ -1,48 +0,0 @@
-
-{{ target: partial-focus-blur-scope }}
-
-### focus(string) = 'none'
-
-{{ use: partial-version(
-    version = "5.0.0"
-) }}
-
-在高亮图形时,是否淡出其它数据的图形已达到聚焦的效果。支持如下配置:
-
-+ `'none'` 不淡出其它图形,默认使用该配置。
-+ `'self'` 只聚焦(不淡出)当前高亮的数据的图形。
-+ `'series'` 聚焦当前高亮的数据所在的系列的所有图形。
-
-{{ if: ${isGraph} }}
-+ `'adjacency'` 聚焦关系图中的邻接点和边的图形
-
-{{ elif: ${isTree} }}
-+ `'ancestor'` 聚焦所有祖先节点
-+ `'descendant'` 聚焦所有子孙节点
-{{ /if }}
-
-**示例:**
-
-下面代码配置了柱状图在高亮一个图形的时候,淡出当前直角坐标系所有其它的系列。
-
-```js
-emphasis: {
-    focus: 'series',
-    blurScope: 'coordinateSystem'
-}
-```
-
-~[600x400](${galleryViewPath}bar-y-category-stack&reset=1&edit=1)
-
-### blurScope(string) = 'coordinateSystem'
-
-{{ use: partial-version(
-    version = "5.0.0"
-) }}
-
-在开启`focus`的时候,可以通过`blurScope`配置淡出的范围。支持如下配置
-
-+ `'coordinateSystem'` 淡出范围为坐标系,默认使用该配置。
-+ `'series'` 淡出范围为系列。
-+ `'global'` 淡出范围为全局。
-
diff --git a/en-src/option/partial/label-layout.md b/en-src/option/partial/label-layout.md
deleted file mode 100644
index fc32f4a..0000000
--- a/en-src/option/partial/label-layout.md
+++ /dev/null
@@ -1,136 +0,0 @@
-
-{{ target: partial-label-layout }}
-
-{{ use: partial-version(
-    version = "5.0.0"
-) }}
-
-标签的统一布局配置。
-
-该配置项是在每个系列默认的标签布局基础上,统一调整标签的`(x, y)`位置,标签对齐等属性以实现想要的标签布局效果。
-
-该配置项也可以是一个有如下参数的回调函数
-
-```js
-// 标签对应数据的 dataIndex
-dataIndex: number
-// 标签对应的数据类型,只在关系图中会有 node 和 edge 数据类型的区分
-dataType?: string
-// 标签对应的系列的 index
-seriesIndex: number
-// 标签显示的文本
-text: string
-// 默认的标签的包围盒,由系列默认的标签布局决定
-labelRect: {x: number, y: number, width: number, height: number}
-// 默认的标签水平对齐
-align: 'left' | 'center' | 'right'
-// 默认的标签垂直对齐
-verticalAlign: 'top' | 'middle' | 'bottom'
-// 标签所对应的数据图形的包围盒,可用于定位标签位置
-rect: {x: number, y: number, width: number, height: number}
-// 默认引导线的位置,目前只有饼图(pie)和漏斗图(funnel)有默认标签位置
-// 如果没有该值则为 null
-labelLinePoints?: number[][]
-```
-
-**示例:**
-
-将标签显示在图形右侧 10px 的位置,并且垂直居中:
-
-```js
-labelLayout(params) {
-    return {
-        x: params.rect.x + 10,
-        y: params.rect.y + params.rect.height / 2,
-        verticalAlign: 'middle',
-        align: 'left'
-    }
-}
-```
-
-根据图形的包围盒尺寸决定文本尺寸
-
-```js
-
-labelLayout(params) {
-    return {
-        fontSize: Math.max(params.rect.width / 10, 5)
-    };
-}
-```
-
-#${prefix} hideOverlap(boolean)
-
-是否隐藏重叠的标签。
-
-下面示例演示了在关系图中开启该配置后,在缩放时可以实现自动的标签隐藏。
-
-~[600x400](${galleryViewPath}graph-label-overlap&edit=1&reset=1)
-
-#${prefix} moveOverlap(string)
-
-在标签重叠的时候是否挪动标签位置以防止重叠。
-
-目前支持配置为:
-
-+ `'shiftX'` 水平方向依次位移,在水平方向对齐时使用
-+ `'shiftY'` 垂直方向依次位移,在垂直方向对齐时使用
-
-下面是标签右对齐并配置垂直方向依次位移以防止重叠的示例。
-
-~[600x400](${galleryViewPath}scatter-label-align-right&edit=1&reset=1)
-
-#${prefix} x(number|string)
-
-标签的 x 位置。支持绝对的像素值或者`'20%'`这样的相对值。
-
-#${prefix} y(number|string)
-
-标签的 y 位置。支持绝对的像素值或者`'20%'`这样的相对值。
-
-#${prefix} dx(number)
-
-标签在 x 方向上的像素偏移。可以和`x`一起使用。
-
-#${prefix} dy(number)
-
-标签在 y 方向上的像素偏移。可以和`y`一起使用
-
-#${prefix} rotate(number)
-
-标签旋转角度。
-
-#${prefix} width(number)
-
-标签显示的宽度。可以配合`overflow`使用控制标签显示在固定宽度内
-
-#${prefix} height(number)
-
-标签显示的高度。可以配合`lineOverflow`使用控制标签显示在固定高度内
-
-#${prefix} align(string)
-
-标签水平对齐。可以设置`'left'`, `'center'`, `'right'`。
-
-#${prefix} verticalAlign(string)
-
-标签垂直对齐。可以设置`'top'`, `'middle'`, `'bottom'`。
-
-#${prefix} fontSize(number)
-
-标签的文本大小,可以根据
-
-#${prefix} draggable(boolean)
-
-标签是否可以允许用户通过拖拽二次调整位置。
-
-#${prefix} labelLinePoints(Array)
-
-标签引导线三个点的位置。格式为:
-
-```js
-[[x, y], [x, y], [x, y]]
-```
-
-在饼图中常用来微调已经计算好的引导线,其它情况一般不建议设置。
-
diff --git a/en-src/option/partial/selected-mode.md b/en-src/option/partial/selected-mode.md
deleted file mode 100644
index 77f0bb0..0000000
--- a/en-src/option/partial/selected-mode.md
+++ /dev/null
@@ -1,15 +0,0 @@
-
-{{ target: partial-selected-mode }}
-
-## selectedMode(boolean|string) = false
-
-{{ if: ${version} }}
-{{ use: partial-version(
-    version = ${version}
-) }}
-{{ /if }}
-
-<ExampleUIControlEnum options="true,false,single,multiple" />
-
-选中模式的配置,表示是否支持多个选中,默认关闭,支持布尔值和字符串,字符串取值可选`'single'`,`'multiple'`,分别表示单选还是多选。
-
diff --git a/en/option/component/geo-common.md b/en/option/component/geo-common.md
index 9996e6d..9bb0ab9 100644
--- a/en/option/component/geo-common.md
+++ b/en/option/component/geo-common.md
@@ -150,23 +150,16 @@ Area filling color.
 
 Map area style in highlighted state.
 
-##${prefix} label(Object)
-
-{{ use: partial-label(
-    prefix = "##" + ${prefix},
-    formatter = true
+{{ use: partial-geo-common-state(
+    prefix = '#' + ${prefix}
 ) }}
 
-##${prefix} itemStyle(Object)
-
-###${prefix} areaColor(Color) = '#eee'
+#${prefix} select(Object)
 
-Area filling color.
-
-{{ use: partial-color-desc() }}
+Map area style in selected state.
 
-{{ use: partial-item-style(
-    prefix = ${prefix} + '##'
+{{ use: partial-geo-common-state(
+    prefix = '#' + ${prefix}
 ) }}
 
 {{ use: partial-rect-layout(
@@ -193,3 +186,26 @@ After setting these two values, `left/right/top/bottom/width/height` becomes inv
 
 Size of map, see `layoutCenter` for more information. Percentage relative to screen width, and absolute pixel values are supported.
 
+
+
+{{ target: partial-geo-common-state }}
+
+#${prefix} label(Object)
+
+{{ use: partial-label(
+    prefix = "#" + ${prefix},
+    formatter = true
+) }}
+
+#${prefix} itemStyle(Object)
+
+##${prefix} areaColor(Color) = '#eee'
+
+The color of the map area.
+
+{{ use: partial-color-desc() }}
+
+{{ use: partial-item-style(
+    prefix = "#" + ${prefix}
+) }}
+
diff --git a/en/option/component/geo.md b/en/option/component/geo.md
index ffe187d..4ded4a2 100644
--- a/en/option/component/geo.md
+++ b/en/option/component/geo.md
@@ -88,11 +88,27 @@ Area color in the map.
 
 Style of emphasis region.
 
+{{ use: geo-region-state() }}
+
+### select(Object)
+
+Style of selected region.
+
+{{ use: geo-region-state() }}
+
+{{ use: partial-silent(
+    prefix = "#"
+) }}
+
+
+
+{{ target: geo-region-state }}
+
 #### itemStyle(Object)
 
 ##### areaColor(Color)
 
-Area color in the map.
+The color of the map area.
 
 {{ use: partial-color-desc() }}
 
@@ -107,7 +123,3 @@ Area color in the map.
     formatter = true
 ) }}
 
-{{ use: partial-silent(
-    prefix = "#"
-) }}
-
diff --git a/en/option/partial/focus-blur-scope.md b/en/option/partial/focus-blur-scope.md
index 8d035d9..02c4e93 100644
--- a/en/option/partial/focus-blur-scope.md
+++ b/en/option/partial/focus-blur-scope.md
@@ -7,23 +7,21 @@
     version = "5.0.0"
 ) }}
 
-在高亮图形时,是否淡出其它数据的图形已达到聚焦的效果。支持如下配置:
+When the data is highlighted, whether to fade out of other data to focus the highlighted. The following configurations are supported:
 
-+ `'none'` 不淡出其它图形,默认使用该配置。
-+ `'self'` 只聚焦(不淡出)当前高亮的数据的图形。
-+ `'series'` 聚焦当前高亮的数据所在的系列的所有图形。
++ `'none'` Do not fade out other data, it's by default.
++ `'self'` Only focus (not fade out) the element of the currently highlighted data.
++ `'series'` Focus on all elements of the series which the currently highlighted data belongs to.
 
 {{ if: ${isGraph} }}
-+ `'adjacency'` 聚焦关系图中的邻接点和边的图形
++ `'adjacency'` Focus on the elements of adjacent nodes and edges in the graph.
 
 {{ elif: ${isTree} }}
-+ `'ancestor'` 聚焦所有祖先节点
-+ `'descendant'` 聚焦所有子孙节点
++ `'ancestor'` Focus on all ancestor nodes.
++ `'descendant'` Focus on all descendants nodes.
 {{ /if }}
 
-**示例:**
-
-下面代码配置了柱状图在高亮一个图形的时候,淡出当前直角坐标系所有其它的系列。
+**Example: **
 
 ```js
 emphasis: {
@@ -40,9 +38,9 @@ emphasis: {
     version = "5.0.0"
 ) }}
 
-在开启`focus`的时候,可以通过`blurScope`配置淡出的范围。支持如下配置
+The range of fade out when `focus` is enabled. Support the following configurations
 
-+ `'coordinateSystem'` 淡出范围为坐标系,默认使用该配置。
-+ `'series'` 淡出范围为系列。
-+ `'global'` 淡出范围为全局。
++ `'coordinateSystem'`
++ `'series'`
++ `'global'`
 
diff --git a/en/option/partial/label-layout.md b/en/option/partial/label-layout.md
index fc32f4a..9f8cc46 100644
--- a/en/option/partial/label-layout.md
+++ b/en/option/partial/label-layout.md
@@ -5,37 +5,37 @@
     version = "5.0.0"
 ) }}
 
-标签的统一布局配置。
+Unified layout configuration of labels.
 
-该配置项是在每个系列默认的标签布局基础上,统一调整标签的`(x, y)`位置,标签对齐等属性以实现想要的标签布局效果。
+It provide a chance to adjust the labels' `(x, y)` position, alignment based on the original layout each series provides.
 
-该配置项也可以是一个有如下参数的回调函数
+This option can be a callback with following parameters.
 
 ```js
-// 标签对应数据的 dataIndex
+// corresponding index of data
 dataIndex: number
-// 标签对应的数据类型,只在关系图中会有 node 和 edge 数据类型的区分
+// corresponding type of data. Only available in graph, in which it can be 'node' or 'edge'
 dataType?: string
-// 标签对应的系列的 index
+// corresponding index of series
 seriesIndex: number
-// 标签显示的文本
+// Displayed text of label.
 text: string
-// 默认的标签的包围盒,由系列默认的标签布局决定
+// Bounding rectangle of label.
 labelRect: {x: number, y: number, width: number, height: number}
-// 默认的标签水平对齐
+// Horizontal alignment of label.
 align: 'left' | 'center' | 'right'
-// 默认的标签垂直对齐
+// Vertical alignment of label.
 verticalAlign: 'top' | 'middle' | 'bottom'
-// 标签所对应的数据图形的包围盒,可用于定位标签位置
+// Bounding rectangle of the element corresponding to.
 rect: {x: number, y: number, width: number, height: number}
-// 默认引导线的位置,目前只有饼图(pie)和漏斗图(funnel)有默认标签位置
-// 如果没有该值则为 null
+// Default points array of labelLine. Currently only provided in pie and funnel series.
+// It's null in other series.
 labelLinePoints?: number[][]
 ```
 
-**示例:**
+**Example:**
 
-将标签显示在图形右侧 10px 的位置,并且垂直居中:
+Align the labels on the right. Left 10px margin to the edge.
 
 ```js
 labelLayout(params) {
@@ -48,7 +48,7 @@ labelLayout(params) {
 }
 ```
 
-根据图形的包围盒尺寸决定文本尺寸
+Set the text size based on the size of element bounding rectangle.
 
 ```js
 
@@ -61,76 +61,76 @@ labelLayout(params) {
 
 #${prefix} hideOverlap(boolean)
 
-是否隐藏重叠的标签。
+If hide the overlapped labels.
 
-下面示例演示了在关系图中开启该配置后,在缩放时可以实现自动的标签隐藏。
+The following example shows how to hide the overlapped labels in graph automatically when zooming.
 
 ~[600x400](${galleryViewPath}graph-label-overlap&edit=1&reset=1)
 
 #${prefix} moveOverlap(string)
 
-在标签重叠的时候是否挪动标签位置以防止重叠。
+If move the overlapped labels to avoid overlapping.
 
-目前支持配置为:
+Currently supported configurations:
 
-+ `'shiftX'` 水平方向依次位移,在水平方向对齐时使用
-+ `'shiftY'` 垂直方向依次位移,在垂直方向对齐时使用
++ `'shiftX'` Place the labels on horizontal direction sequencely, used when aligned horizontally.
++ `'shiftY'` Place the labels on vertial direction sequencely, used when aligned vertically.
 
-下面是标签右对齐并配置垂直方向依次位移以防止重叠的示例。
+The following example shows how to use `moverOverlap: 'shiftY'` to place the labels aligned vertically.
 
 ~[600x400](${galleryViewPath}scatter-label-align-right&edit=1&reset=1)
 
 #${prefix} x(number|string)
 
-标签的 x 位置。支持绝对的像素值或者`'20%'`这样的相对值。
+The x position of the label. Support absolute pixel values ​​or relative values ​​such as `'20%'`.
 
 #${prefix} y(number|string)
 
-标签的 y 位置。支持绝对的像素值或者`'20%'`这样的相对值。
+The y position of the label. Support absolute pixel values ​​or relative values ​​such as `'20%'`.
 
 #${prefix} dx(number)
 
-标签在 x 方向上的像素偏移。可以和`x`一起使用。
+The pixel offset of the label in the x direction. Can be used with `x`.
 
 #${prefix} dy(number)
 
-标签在 y 方向上的像素偏移。可以和`y`一起使用
+The pixel offset of the label in the y direction. Can be used with `y`
 
 #${prefix} rotate(number)
 
-标签旋转角度。
+Label rotation angle.
 
 #${prefix} width(number)
 
-标签显示的宽度。可以配合`overflow`使用控制标签显示在固定宽度内
+The width of displayed label. Can be used with `overflow` to constraint the label in a fixed width
 
 #${prefix} height(number)
 
-标签显示的高度。可以配合`lineOverflow`使用控制标签显示在固定高度内
+The height of displayed label. Can be used with `lineOverflow` to constraint the label in a fixed height.
 
 #${prefix} align(string)
 
-标签水平对齐。可以设置`'left'`, `'center'`, `'right'`。
+The horizontal alignment of the label. Can be `'left'`, `'center'`, `'right'`.
 
 #${prefix} verticalAlign(string)
 
-标签垂直对齐。可以设置`'top'`, `'middle'`, `'bottom'`。
+The vertical alignment of the label. Can be `'top'`, `'middle'`, `'bottom'`.
 
 #${prefix} fontSize(number)
 
-标签的文本大小,可以根据
+The text size of the label.
 
 #${prefix} draggable(boolean)
 
-标签是否可以允许用户通过拖拽二次调整位置。
+Whether to allow the user to adjust the position by dragging.
 
 #${prefix} labelLinePoints(Array)
 
-标签引导线三个点的位置。格式为:
+The array of the three points of the label guide line. The format is:
 
 ```js
 [[x, y], [x, y], [x, y]]
 ```
 
-在饼图中常用来微调已经计算好的引导线,其它情况一般不建议设置。
+It is often used in pie charts to fine-tune the guide line that has been calculated. Usually not recommended to set it in other situations.
 
diff --git a/en/option/partial/mark-area.md b/en/option/partial/mark-area.md
index 92adeee..49fa2d1 100644
--- a/en/option/partial/mark-area.md
+++ b/en/option/partial/mark-area.md
@@ -41,6 +41,22 @@ Emphasis status of mark area.
     prefix = "###" + ${prefix}
 ) }}
 
+##${prefix} blur(Object)
+
+Configurations of blur state. Whether to blur follows the series.
+
+###${prefix} label(Object)
+
+{{ use: partial-label(
+    prefix = ${prefix} + '###'
+) }}
+
+###${prefix} itemStyle(*)
+
+{{ use: partial-item-style(
+    prefix = "###" + ${prefix}
+) }}
+
 ##${prefix} data(*)
 
 The scope of the area is defined by `data`, which is an array with two item, representing the left-top point and the right-bottom point of rectangle area. Each item can be defined as follows:
@@ -233,3 +249,17 @@ Label style of start point and end point will be merged together.
     prefix = '##'+${prefix}
 ) }}
 
+#${prefix} blur(Object)
+
+##${prefix} itemStyle(Object)
+
+{{ use: partial-item-style(
+    prefix = "##"+${prefix}
+) }}
+
+##${prefix} label(Object)
+
+{{ use: partial-label(
+    prefix = '##'+${prefix}
+) }}
+
diff --git a/en/option/partial/mark-line.md b/en/option/partial/mark-line.md
index f888e7e..b3cc398 100644
--- a/en/option/partial/mark-line.md
+++ b/en/option/partial/mark-line.md
@@ -58,6 +58,22 @@ Emphasis status of mark line.
     prefix = "###" + ${prefix}
 ) }}
 
+##${prefix} blur(Object)
+
+Configurations of blur state. Whether to blur follows the series.
+
+###${prefix} label(Object)
+
+{{ use: mark-line-label(
+    prefix = ${prefix} + '###'
+) }}
+
+###${prefix} lineStyle(Object)
+
+{{ use: partial-line-style(
+    prefix = "###" + ${prefix}
+) }}
+
 ##${prefix} data(*)
 
 Data array of marking line. Every array item can be an array of one or two values, representing starting and ending point of the line, and every item is an object. Here are several ways to assign the positions of starting and ending point.
@@ -283,3 +299,18 @@ Label of this data item, which will be merged with `label` of starting point and
     prefix = '##'+${prefix}
 ) }}
 
+#${prefix} blur(Object)
+
+##${prefix} lineStyle(Object)
+
+{{ use: partial-line-style(
+    prefix = "##"+${prefix},
+    hasCurveness = true
+) }}
+
+##${prefix} label(Object)
+
+{{ use: mark-line-label(
+    prefix = '##'+${prefix}
+) }}
+
diff --git a/en/option/partial/mark-point.md b/en/option/partial/mark-point.md
index ee29a0b..84c45f5 100644
--- a/en/option/partial/mark-point.md
+++ b/en/option/partial/mark-point.md
@@ -54,6 +54,23 @@ Emphasis status of mark point.
     prefix = "###" + ${prefix}
 ) }}
 
+##${prefix} blur(Object)
+
+Configurations of blur state. Whether to blur follows the series.
+
+###${prefix} label(Object)
+
+{{ use: partial-label(
+    prefix = "###" + ${prefix},
+    formatter = true
+) }}
+
+###${prefix} itemStyle(Object)
+
+{{ use: partial-item-style(
+    prefix = "###" + ${prefix}
+) }}
+
 ##${prefix} data(Array)
 
 Data array for mark points, each of which is an object. Here are some ways to assign mark point position.
@@ -179,3 +196,21 @@ Mark point style.
     prefix = "#" + ${prefix}
 ) }}
 
+###${prefix} blur(Object)
+
+####${prefix} label(Object)
+
+{{ use: partial-label(
+    prefix = ${prefix} + '####'
+) }}
+
+####${prefix} itemStyle(Object)
+
+{{ use: partial-item-style(
+    prefix = "####" + ${prefix}
+) }}
+
+{{ use: partial-animation(
+    prefix = "#" + ${prefix}
+) }}
+
diff --git a/en/option/partial/selected-mode.md b/en/option/partial/selected-mode.md
index 5f33e46..d0ac590 100644
--- a/en/option/partial/selected-mode.md
+++ b/en/option/partial/selected-mode.md
@@ -9,7 +9,7 @@
 ) }}
 {{ /if }}
 
-<ExampleUIControlEnum options="true,false,single,multiple" />
+<ExampleUIControlEnum options="false,true,single,multiple" />
 
 Selected mode.  It is enabled by default, and you may set it to be `false` to disabled it.
 
diff --git a/en/option/partial/zr-graphic.md b/en/option/partial/zr-graphic.md
index 24a5a6d..4c102ae 100644
--- a/en/option/partial/zr-graphic.md
+++ b/en/option/partial/zr-graphic.md
@@ -1352,9 +1352,53 @@ Notice:
 {{ target: partial-graphic-cpt-style-emphasis }}
 
 {{ if: ${usageType} === 'customSeries' }}
-##${prefix} styleEmphasis(Object)
+##${prefix} emphasis(Object)
 
-Empahsis style of the graphic element, whose structure is the same as [style](~${optionPath}.${hostName}${symbolVisit}polygon.style).
+Emphasis state of the element.
+
+###${prefix} focus(string) = 'none'
+
+{{ use: partial-version(
+    version = "5.0.0"
+) }}
+
+When it's highlighted, whether to fade out of other data to focus the highlighted. The following configurations are supported:
+
++ `'none'` Do not fade out other data, it's by default.
++ `'self'` Only focus (not fade out) the element of the currently highlighted data.
++ `'series'` Focus on all elements of the series which the currently highlighted data belongs to.
+
+###${prefix} blurScope(string) = 'coordinateSystem'
+
+{{ use: partial-version(
+    version = "5.0.0"
+) }}
+
+The range of fade out when `focus` is enabled. Support the following configurations
+
++ `'coordinateSystem'`
++ `'series'`
++ `'global'`
+
+###${prefix} style(Object)
+
+Same to [style](~${optionPath}.${hostName}${symbolVisit}polygon.style).
+
+##${prefix} blur(Object)
+
+Blur state, available when `focus` is set.
+
+###${prefix} style(Object)
+
+Same to [style](~${optionPath}.${hostName}${symbolVisit}polygon.style).
+
+##${prefix} select(Object)
+
+Select state, available when [selectedMode](~series-custom.selectedMode) is set.
+
+###${prefix} style(Object)
+
+Same to [style](~${optionPath}.${hostName}${symbolVisit}polygon.style).
 {{ /if }}
 
 
diff --git a/en/option/series/bar.md b/en/option/series/bar.md
index 3773ebc..6e92ef0 100644
--- a/en/option/series/bar.md
+++ b/en/option/series/bar.md
@@ -80,7 +80,7 @@ Background style of each bar if [showBackground](~series-bar.showBackground) is
 
 ## emphasis(Object)
 
-高亮的图形样式和标签样式。
+Configurations of emphasis state.
 
 {{ use: partial-focus-blur-scope() }}
 
@@ -92,7 +92,7 @@ Background style of each bar if [showBackground](~series-bar.showBackground) is
 
 ## blur(Object)
 
-淡出时的图形样式和标签样式。开启 [emphasis.focus](~series-bar.emphasis.focus) 后有效
+Configurations of blur state. Available when [emphasis.focus](~series-bar.emphasis.focus) is set.
 
 {{ use: partial-bar-state(
     prefix = "##",
@@ -102,7 +102,7 @@ Background style of each bar if [showBackground](~series-bar.showBackground) is
 
 ## select(Object)
 
-数据选中时的图形样式和标签样式。开启 [selectedMode](~series-bar.selectedMode) 后有效。
+Configurations of select state. Available when [selectedMode](~series-bar.selectedMode) is set.
 
 {{ use: partial-bar-state(
     prefix = "##",
@@ -168,7 +168,7 @@ The value of a single data item.
 
 ### emphasis(Object)
 
-单个数据的高亮状态配置。
+Emphasis state of single data.
 
 {{ use: partial-bar-state(
     prefix = "###",
@@ -178,7 +178,7 @@ The value of a single data item.
 
 ### blur(Object)
 
-单个数据的淡出状态配置。
+Blur state of single data.
 
 {{ use: partial-bar-state(
     prefix = "###",
@@ -188,7 +188,7 @@ The value of a single data item.
 
 ### select(Object)
 
-单个数据的选中状态配置。
+Select state of single data.
 
 {{ use: partial-bar-state(
     prefix = "###",
@@ -202,7 +202,7 @@ The value of a single data item.
 
 {{ use: partial-z-zlevel(
     prefix = "#",
-    componentName = "柱状图"
+    componentName = "Bar chart "
 ) }}
 
 {{ use: partial-silent(
@@ -224,7 +224,7 @@ The value of a single data item.
 {{ if: ${topLevel} }}
 {{ use: partial-label-desc() }}
 {{ else }}
-单个数据的文本配置。
+Label style configurations of single data.
 {{ /if }}
 
 {{ use: partial-label(
@@ -238,7 +238,7 @@ The value of a single data item.
 {{ if: ${topLevel} }}
 {{ use: partial-item-style-desc() }}
 {{ else }}
-单个数据的图形样式设置。
+Rectangle style configurations of single data.
 {{ /if }}
 
 {{ use: partial-bar-item-style(
@@ -273,7 +273,7 @@ The border width of bar. defaults to have no border.
 
 <ExampleUIControlEnum default="solid" options="solid,dashed,dotted" />
 
-柱条的描边类型,默认为实线,支持 `'dashed'`, `'dotted'`。
+Border type. Can be `'dashed'`, `'dotted'`.
 
 {{ use: partial-border-radius(
     prefix = ${prefix}
diff --git a/en/option/series/boxplot.md b/en/option/series/boxplot.md
index b094c8f..8852770 100644
--- a/en/option/series/boxplot.md
+++ b/en/option/series/boxplot.md
@@ -74,18 +74,45 @@ Style of boxplot.
 
 Configurations of emphasis state.
 
+{{ use: partial-focus-blur-scope() }}
+
 ### itemStyle(Object)
 
 {{ use: partial-item-style(
     prefix = "###",
-    useColorPalatte = true,
     name = "boxplot",
     defaultColor = "#fff",
     defaultBorderWidth = 2,
     defaultShadowBlur = 5,
-    defaultShadowOffsetX = 2,
-    defaultShadowOffsetY = 2,
-    defaultShadowColor = "rgba(0,0,0,0.4)"
+    defaultShadowOffsetX = 1,
+    defaultShadowOffsetY = 1,
+    defaultShadowColor = "rgba(0,0,0,0.2)"
+) }}
+
+## blur(Object)
+
+Configurations of blur state. Available when [emphasis.focus](~series-boxplot.emphasis.focus) is set.
+
+### itemStyle(Object)
+
+{{ use: partial-item-style(
+    prefix = "###",
+    name = "boxplot"
+) }}
+
+## select(Object)
+
+Configurations of select state. Available when [selectedMode](~series-boxplot.selectedMode) is set.
+
+### itemStyle(Object)
+
+{{ use: partial-item-style(
+    prefix = "###",
+    name = "boxplot"
+) }}
+
+{{ use: partial-selected-mode(
+    version = '5.0.0'
 ) }}
 
 {{ use: partial-series-dimensions(
@@ -144,10 +171,7 @@ Style of a single data.
 
 {{ use: partial-item-style(
     prefix = "###",
-    useColorPalatte = true,
-    name = "boxplot",
-    defaultColor = "#fff",
-    defaultBorderWidth = 1
+    name = "boxplot"
 ) }}
 
 ### emphasis(Object)
@@ -158,14 +182,29 @@ Emphasis state of a single data.
 
 {{ use: partial-item-style(
     prefix = "####",
-    useColorPalatte = true,
-    name = "boxplot",
-    defaultColor = "#fff",
-    defaultBorderWidth = 2,
-    defaultShadowBlur = 5,
-    defaultShadowOffsetX = 2,
-    defaultShadowOffsetY = 2,
-    defaultShadowColor = "rgba(0,0,0,0.4)"
+    name = "boxplot"
+) }}
+
+### blur(Object)
+
+Blur state of single data.
+
+#### itemStyle(Object)
+
+{{ use: partial-item-style(
+    prefix = "####",
+    name = "boxplot"
+) }}
+
+### select(Object)
+
+Select state of single data.
+
+#### itemStyle(Object)
+
+{{ use: partial-item-style(
+    prefix = "####",
+    name = "boxplot"
 ) }}
 
 {{ use: partial-tooltip-in-series-data() }}
@@ -179,7 +218,7 @@ Emphasis state of a single data.
 
 {{ use: partial-z-zlevel(
     prefix = "#",
-    componentName = "Box plot"
+    componentName = "Boxplot "
 ) }}
 
 {{ use: partial-silent(
diff --git a/en/option/series/candlestick.md b/en/option/series/candlestick.md
index 2c2ed83..6daa397 100644
--- a/en/option/series/candlestick.md
+++ b/en/option/series/candlestick.md
@@ -94,17 +94,41 @@ Item style of candlestick.
 
 Emphasis style of candlestick.
 
+{{ use: partial-focus-blur-scope() }}
+
 ### itemStyle(Object)
 
 {{ use: partial-candlestick-item-style-detail(
     prefix = "###",
-    defaultColor = "#c23531",
-    defaultColor0 = "#314656",
-    defaultBorderColor = "#c23531",
-    defaultBorderColor0 = "#314656",
     defaultBorderWidth = 2
 ) }}
 
+## blur(Object)
+
+Configurations of blur state. Available when [emphasis.focus](~series-candlestick.emphasis.focus) is set.
+
+### itemStyle(Object)
+
+{{ use: partial-candlestick-item-style-detail(
+    prefix = "###",
+    defaultBorderWidth = 2
+) }}
+
+## select(Object)
+
+Configurations of select state. Available when [selectedMode](~series-candlestick.selectedMode) is set.
+
+### itemStyle(Object)
+
+{{ use: partial-candlestick-item-style-detail(
+    prefix = "###",
+    defaultBorderWidth = 2
+) }}
+
+{{ use: partial-selected-mode(
+    version = '5.0.0'
+) }}
+
 {{ use: partial-large(
     prefix = "#",
     defaultLarge = true,
@@ -166,12 +190,7 @@ Value of data item.
 Style of a candle box.
 
 {{ use: partial-candlestick-item-style-detail(
-    prefix = "###",
-    defaultColor = "#c23531",
-    defaultColor0 = "#314656",
-    defaultBorderColor = "#c23531",
-    defaultBorderColor0 = "#314656",
-    defaultBorderWidth = 1
+    prefix = "###"
 ) }}
 
 ### emphasis(Object)
@@ -181,12 +200,27 @@ Emphasis style of a candle box.
 #### itemStyle(Object)
 
 {{ use: partial-candlestick-item-style-detail(
-    prefix = "####",
-    defaultColor = "#c23531",
-    defaultColor0 = "#314656",
-    defaultBorderColor = "#c23531",
-    defaultBorderColor0 = "#314656",
-    defaultBorderWidth = 2
+    prefix = "####"
+) }}
+
+### blur(Object)
+
+Blur state of single data.
+
+#### itemStyle(Object)
+
+{{ use: partial-candlestick-item-style-detail(
+    prefix = "####"
+) }}
+
+### select(Object)
+
+Select state of single data.
+
+#### itemStyle(Object)
+
+{{ use: partial-candlestick-item-style-detail(
+    prefix = "####"
 ) }}
 
 {{ use: partial-tooltip-in-series-data() }}
@@ -205,7 +239,7 @@ Emphasis style of a candle box.
 
 {{ use: partial-z-zlevel(
     prefix = "#",
-    componentName = "candlestick"
+    componentName = "Candlestick "
 ) }}
 
 {{ use: partial-silent(
diff --git a/en/option/series/custom.md b/en/option/series/custom.md
index dee8f2b..58e7304 100644
--- a/en/option/series/custom.md
+++ b/en/option/series/custom.md
@@ -405,6 +405,10 @@ Emphasis state.
     prefix = "###"
 ) }}
 
+{{ use: partial-selected-mode(
+    version = '5.0.0'
+) }}
+
 {{ use: partial-series-dimensions(
     prefix = "#"
 ) }}
diff --git a/en/option/series/effectScatter.md b/en/option/series/effectScatter.md
index fe30c12..5d0f819 100644
--- a/en/option/series/effectScatter.md
+++ b/en/option/series/effectScatter.md
@@ -114,19 +114,36 @@ The brush type for ripples. options: `'stroke'` and `'fill'`.
 
 Configurations of emphasis state.
 
-### label(Object)
+### scale(boolean) = true
 
-{{ use: partial-label(
-    prefix = "###",
-    formatter = true
+<ExampleUIControlBoolean default="true" />
+
+Whether to scale to highlight the data in emphasis state.
+
+{{ use: partial-focus-blur-scope() }}
+
+{{ use: effectScatter-state(
+    prefix = "##"
 ) }}
 
-### itemStyle(Object)
+## blur(Object)
 
-{{ use: partial-item-style(
-    prefix = "###",
-    useColorPalatte = true,
-    hasCallback = true
+Configurations of blur state. Available when [emphasis.focus](~series-effectScatter.emphasis.focus) is set.
+
+{{ use: effectScatter-state(
+    prefix = "##"
+) }}
+
+## select(Object)
+
+Configurations of select state. Available when [selectedMode](~series-effectScatter.selectedMode) is set.
+
+{{ use: effectScatter-state(
+    prefix = "##"
+) }}
+
+{{ use: partial-selected-mode(
+    version = '5.0.0'
 ) }}
 
 {{ use: partial-seriesLayoutBy() }}
@@ -170,16 +187,24 @@ Configurations of emphasis state.
 
 Emphasis state of the specified single data.
 
-#### label(Object)
+{{ use: effectScatter-state(
+    prefix = "###"
+) }}
+
+### blur(Object)
 
-{{ use: partial-label(
-    prefix = "####"
+Blur state of the specified single data.
+
+{{ use: effectScatter-state(
+    prefix = "###"
 ) }}
 
-#### itemStyle(Object)
+### select(Object)
 
-{{ use: partial-item-style(
-    prefix = "####"
+Select state of the specified single data.
+
+{{ use: effectScatter-state(
+    prefix = "###"
 ) }}
 
 {{ use: partial-tooltip-in-series-data() }}
@@ -205,3 +230,20 @@ Emphasis state of the specified single data.
 
 {{ use: partial-tooltip-in-series() }}
 
+
+
+{{ target: effectScatter-state }}
+
+#${prefix} label(Object)
+
+{{ use: partial-label(
+    prefix = "#" + ${prefix},
+    formatter = ${prefix} === '##'
+) }}
+
+#${prefix} itemStyle(Object)
+
+{{ use: partial-item-style(
+    prefix = "#" + ${prefix}
+) }}
+
diff --git a/en/option/series/funnel.md b/en/option/series/funnel.md
index 3d7751d..e78261e 100644
--- a/en/option/series/funnel.md
+++ b/en/option/series/funnel.md
@@ -109,58 +109,36 @@ The visual guide line style of label. When [label position](~series-funnel.label
 
 ## emphasis(Object)
 
-高亮的标签和图形样式。
+Configurations of emphasis state.
 
 {{ use: partial-focus-blur-scope() }}
 
-### label(Object)
-
-{{ use: partial-funnel-label(
-    prefix = "###",
-    position = false,
-    formatter = true
-) }}
-
-### labelLine(Object)
-
-{{ use: partial-funnel-label-line(
-    prefix = '###',
-    length = false
-) }}
-
-### itemStyle(Object)
-
-{{ use: partial-item-style(
-    prefix = "###"
+{{ use: partial-funnel-state(
+    prefix = "##"
 ) }}
 
 ## blur(Object)
 
-淡出时的图形样式和标签样式。开启 [emphasis.focus](~series-funnel.emphasis.focus) 后有效
-
-### label(Object)
+Configurations of blur state. Available when [emphasis.focus](~series-funnel.emphasis.focus) is set.
 
-{{ use: partial-funnel-label(
-    prefix = "###",
-    position = false,
-    formatter = true
+{{ use: partial-funnel-state(
+    prefix = "##"
 ) }}
 
-### labelLine(Object)
+## select(Object)
 
-{{ use: partial-funnel-label-line(
-    prefix = '###',
-    length = false
-) }}
+Configurations of select state. Available when [selectedMode](~series-funnel.selectedMode) is set.
 
-### itemStyle(Object)
+{{ use: partial-funnel-state(
+    prefix = "##"
+) }}
 
-{{ use: partial-item-style(
-    prefix = "###"
+{{ use: partial-selected-mode(
+    version = '5.0.0'
 ) }}
 
 {{ use: partial-rect-layout-width-height(
-    componentName = "漏斗图",
+    componentName = "Funnel",
     defaultLeft = 80,
     defaultTop = 60,
     defaultRight = 80,
@@ -230,25 +208,20 @@ The label configuration of a single data item.
 
 ### emphasis(Object)
 
-#### itemStyle(Object)
-
-{{ use: partial-item-style(
-    prefix = "####"
+{{ use: partial-funnel-state(
+    prefix = "###"
 ) }}
 
-#### label(Object)
+### blur(Object)
 
-{{ use: partial-funnel-label(
-    prefix = "####",
-    position = false,
-    formatter = false
+{{ use: partial-funnel-state(
+    prefix = "###"
 ) }}
 
-#### labelLine(Object)
+### select(Object)
 
-{{ use: partial-funnel-label-line(
-    prefix = "####",
-    length = false
+{{ use: partial-funnel-state(
+    prefix = "###"
 ) }}
 
 {{ use: partial-tooltip-in-series-data() }}
@@ -270,6 +243,31 @@ The label configuration of a single data item.
 
 
 
+{{ target: partial-funnel-state }}
+
+#${prefix} label(Object)
+
+{{ use: partial-funnel-label(
+    prefix = "#" + ${prefix},
+    position = false,
+    formatter = true
+) }}
+
+#${prefix} labelLine(Object)
+
+{{ use: partial-funnel-label-line(
+    prefix = "#" + ${prefix},
+    length = false
+) }}
+
+#${prefix} itemStyle(Object)
+
+{{ use: partial-item-style(
+    prefix = "#" + ${prefix}
+) }}
+
+
+
 {{ target: partial-funnel-label }}
 
 #${prefix} show(boolean) = false
diff --git a/en/option/series/graph.md b/en/option/series/graph.md
index e049572..58cfaef 100644
--- a/en/option/series/graph.md
+++ b/en/option/series/graph.md
@@ -31,10 +31,6 @@ Graph is a diagram to represent [nodes](~series-graph.nodes) and the [links](~se
     calendar = true
 ) }}
 
-## hoverAnimation(boolean)
-
-Whether to enable the highlight animation effect of mousr hover node.
-
 ## center(Array)
 
 <ExampleUIControlVector default="0,0" dims="x,y" />
@@ -145,20 +141,6 @@ Related zooming ratio of nodes when mouse zooming in or out. When it is set as 0
 
 If node is draggable. Only available when using force-directed layout.
 
-## focusNodeAdjacency(boolean) = false
-
-<ExampleUIControlBoolean default="false" />
-
-Whether to focus/highlight the hover node and it's adjacencies.
-
-{{ use: partial-symbol(
-    prefix = '#',
-    defaultSymbol = "'circle'",
-    defaultSymbolSize = 10,
-    name = 'node of relation graph',
-    hasCallback = true
-) }}
-
 ## edgeSymbol(Array|string) = ['none', 'none']
 
 Symbol of two ends of edge line.
@@ -232,30 +214,32 @@ The style of edge line. [lineStyle.color](~series-graph.lineStyle.color) can be
 
 Configurations of emphasis state.
 
-### itemStyle(Object)
+### scale(boolean) = true
 
-{{ use: partial-item-style(
-    prefix = "###"
-) }}
+<ExampleUIControlBoolean default="true" />
 
-### lineStyle(Object)
+Whether to scale to highlight the node in emphasis state.
 
-{{ use: partial-line-style(
-    prefix = "###"
+{{ use: partial-focus-blur-scope(
+    isGraph = true
 ) }}
 
-### label(Object)
+{{ use: graph-state() }}
 
-{{ use: partial-label(
-    prefix = "###",
-    defaultShow = true,
-    formatter2d = true
-) }}
+## blur(Object)
 
-### edgeLabel(Object)
+Configurations of blur state. Available when [emphasis.focus](~series-graph.emphasis.focus) is set.
 
-{{ use: graph-edge-label(
-    prefix = "###"
+{{ use: graph-state() }}
+
+## select(Object)
+
+Configurations of select state. Available when [selectedMode](~series-graph.selectedMode) is set.
+
+{{ use: graph-state() }}
+
+{{ use: partial-selected-mode(
+    version = '5.0.0'
 ) }}
 
 ## categories(Array)
@@ -293,17 +277,21 @@ The label style of node in this category.
 
 ### emphasis(Object)
 
-#### itemStyle(Object)
+Emphasis state of nodes in this category.
 
-{{ use: partial-item-style(
-    prefix = "####"
-) }}
+{{ use: graph-node-state() }}
 
-#### label(Object)
+### blur(Object)
 
-{{ use: partial-label(
-    prefix = "####"
-) }}
+Blur state of nodes in this category.
+
+{{ use: graph-node-state() }}
+
+### select(Object)
+
+Select state of nodes in this category.
+
+{{ use: graph-node-state() }}
 
 ## autoCurveness(number|Array) = 20
 
@@ -385,17 +373,21 @@ The label style of this node.
 
 ### emphasis(Object)
 
-#### itemStyle(Object)
+Emphasis state of specified node.
 
-{{ use: partial-item-style(
-    prefix = "####"
-) }}
+{{ use: graph-node-state() }}
 
-#### label(Object)
+### blur(Object)
 
-{{ use: partial-label(
-    prefix = "####"
-) }}
+Blur state of specified node.
+
+{{ use: graph-node-state() }}
+
+### select(Object)
+
+Select state of specified node.
+
+{{ use: graph-node-state() }}
 
 {{ use: partial-tooltip-in-series-data() }}
 
@@ -450,17 +442,21 @@ The curveness of edge, supporting values from 0 to 1. The curveness will be larg
 
 ### emphasis(Object)
 
-#### label(Object)
+Emphasis state of specified edge.
 
-{{ use: graph-edge-label(
-    prefix = "####"
-) }}
+{{ use: graph-edge-state() }}
 
-#### lineStyle(Object)
+### blur(Object)
 
-{{ use: partial-line-style(
-    prefix = "####"
-) }}
+Blur state of specified edge.
+
+{{ use: graph-edge-state() }}
+
+### select(Object)
+
+Select state of specified edge.
+
+{{ use: graph-edge-state() }}
 
 ### symbol(Array|string)
 
@@ -529,3 +525,69 @@ Label position, options:
     prefix = ${prefix}
 ) }}
 
+
+
+{{ target: graph-state }}
+
+### itemStyle(Object)
+
+{{ use: partial-item-style(
+    prefix = "###"
+) }}
+
+### lineStyle(Object)
+
+{{ use: partial-line-style(
+    prefix = "###",
+    hasCurveness = true
+) }}
+
+### label(Object)
+
+{{ use: partial-label(
+    prefix = "###",
+    defaultShow = true,
+    formatter2d = true
+) }}
+
+### edgeLabel(Object)
+
+{{ use: graph-edge-label(
+    prefix = "###"
+) }}
+
+
+
+{{ target: graph-node-state }}
+
+#### itemStyle(Object)
+
+{{ use: partial-item-style(
+    prefix = "####"
+) }}
+
+#### label(Object)
+
+{{ use: partial-label(
+    prefix = "####",
+    defaultShow = true
+) }}
+
+
+
+{{ target: graph-edge-state }}
+
+#### lineStyle(Object)
+
+{{ use: partial-line-style(
+    prefix = "####",
+    hasCurveness = true
+) }}
+
+#### label(Object)
+
+{{ use: partial-label(
+    prefix = "####",
+    defaultShow = true
+) }}
+
diff --git a/en/option/series/heatmap.md b/en/option/series/heatmap.md
index 74ae0cd..1c213b7 100644
--- a/en/option/series/heatmap.md
+++ b/en/option/series/heatmap.md
@@ -76,17 +76,32 @@ Work for [coordinateSystem](~series-heatmap.coordinateSystem): 'cartesian2d'.
 
 ## emphasis(Object)
 
-### itemStyle(Object)
+Configurations of emphasis state.
 
-{{ use: partial-item-style(
-    prefix = "###"
+{{ use: partial-focus-blur-scope() }}
+
+{{ use: heatmap-state(
+    prefix = "##"
 ) }}
 
-### label(Object)
+## blur(Object)
 
-{{ use: partial-label(
-    prefix = "###",
-    defaultPosition = "inside"
+Configurations of blur state. Available when [emphasis.focus](~series-heatmap.emphasis.focus) is set.
+
+{{ use: heatmap-state(
+    prefix = "##"
+) }}
+
+## select(Object)
+
+Configurations of select state. Available when [selectedMode](~series-heatmap.selectedMode) is set.
+
+{{ use: heatmap-state(
+    prefix = "##"
+) }}
+
+{{ use: partial-selected-mode(
+    version = '5.0.0'
 ) }}
 
 ## data(Array)
@@ -149,3 +164,20 @@ Style of a single data point. It is valid with [coordinateSystem](~series-heatma
 
 {{ use: partial-tooltip-in-series() }}
 
+
+
+{{ target: heatmap-state }}
+
+#${prefix} itemStyle(Object)
+
+{{ use: partial-item-style(
+    prefix = "#" + ${prefix}
+) }}
+
+#${prefix} label(Object)
+
+{{ use: partial-label(
+    prefix = "#" + ${prefix},
+    defaultPosition = "inside"
+) }}
+
diff --git a/en/option/series/line.md b/en/option/series/line.md
index f10d187..ae5a3ee 100644
--- a/en/option/series/line.md
+++ b/en/option/series/line.md
@@ -52,12 +52,6 @@ Only work when main axis is `'category'` axis (`axis.type` is `'category'`). Opt
 + `true`: Show all symbols.
 + `false`: Follow the interval strategy with [axisLabel.interval](~xAxis.axisLabel.interval).
 
-## hoverAnimation(boolean) = true
-
-<ExampleUIControlBoolean default="true" />
-
-Set this to `false` to prevent the animation effect when the mouse is hovering over a symbol
-
 {{ use: partial-legend-hover-link() }}
 
 ## stack(string) = null
@@ -138,17 +132,28 @@ The style of area.
 
 Highlight style of the graphic.
 
-### label(Object)
+### scale(boolean) = true
 
-{{ use: partial-label(
-    prefix = "###",
-    formatter = true
-) }}
+Whether to scale to highlight the data in emphasis state.
 
-### itemStyle(Object)
+{{ use: partial-focus-blur-scope() }}
 
-{{ use: partial-item-style(
-    prefix = "###"
+{{ use: line-state() }}
+
+## blur(Object)
+
+Configurations of blur state. Available when [emphasis.focus](~series-line.emphasis.focus) is set.
+
+{{ use: line-state() }}
+
+## select(Object)
+
+Configurations of select state. Available when [selectedMode](~series-line.selectedMode) is set.
+
+{{ use: line-state() }}
+
+{{ use: partial-selected-mode(
+    version = '5.0.0'
 ) }}
 
 ## smooth(boolean|number) = false
@@ -237,17 +242,19 @@ The style of the symbol of single data point.
 
 Emphasis state of specified single data.
 
-#### itemStyle(Object)
+{{ use: line-item-state() }}
 
-{{ use: partial-item-style(
-    prefix = "####"
-) }}
+### blur(Object)
 
-#### label(Object)
+Blur state of specified single data.
 
-{{ use: partial-label(
-    prefix = "####"
-) }}
+{{ use: line-item-state() }}
+
+### select(Object)
+
+Select state of specified single data.
+
+{{ use: line-item-state() }}
 
 {{ use: partial-tooltip-in-series-data() }}
 
@@ -260,7 +267,7 @@ Emphasis state of specified single data.
 
 {{ use: partial-z-zlevel(
     prefix = "#",
-    componentName = "broken line graph"
+    componentName = "Line"
 ) }}
 
 {{ use: partial-silent(
@@ -274,3 +281,49 @@ Emphasis state of specified single data.
 
 {{ use: partial-tooltip-in-series() }}
 
+
+
+{{ target: line-state }}
+
+### label(Object)
+
+{{ use: partial-label(
+    prefix = "###",
+    formatter = true
+) }}
+
+### itemStyle(Object)
+
+{{ use: partial-item-style(
+    prefix = "###"
+) }}
+
+### lineStyle(Object)
+
+{{ use: partial-line-style(
+    prefix = "###",
+    defaultWidth = 2
+) }}
+
+### areaStyle(Object)
+
+{{ use: partial-area-style(
+    prefix = "###"
+) }}
+
+
+
+{{ target: line-item-state }}
+
+#### label(Object)
+
+{{ use: partial-label(
+    prefix = "####"
+) }}
+
+#### itemStyle(Object)
+
+{{ use: partial-item-style(
+    prefix = "####"
+) }}
+
diff --git a/en/option/series/lines.md b/en/option/series/lines.md
index 323ffd2..130233c 100644
--- a/en/option/series/lines.md
+++ b/en/option/series/lines.md
@@ -133,18 +133,32 @@ Label settings. Does not work when [polyline](~series-lines.polyline) is `true`.
 
 ## emphasis(Object)
 
-Emphasis style.
+Emphasis state.
 
-### lineStyle(Object)
+{{ use: partial-focus-blur-scope() }}
 
-{{ use: partial-line-style(
-    prefix = '###'
+{{ use: lines-state(
+    prefix = "##"
 ) }}
 
-### label(Object)
+## blur(Object)
 
-{{ use: lines-label(
-    prefix = "###"
+Configurations of blur state. Available when [emphasis.focus](~series-lines.emphasis.focus) is set.
+
+{{ use: lines-state(
+    prefix = "##"
+) }}
+
+## select(Object)
+
+Configurations of select state. Available when [selectedMode](~series-lines.selectedMode) is set.
+
+{{ use: lines-state(
+    prefix = "##"
+) }}
+
+{{ use: partial-selected-mode(
+    version = '5.0.0'
 ) }}
 
 {{ use: partial-progressive(
@@ -182,17 +196,20 @@ Label of a single line. Available when [polyline](~series-lines.polyline) is not
 
 ### emphasis(Object)
 
-#### lineStyle(Object)
+{{ use: lines-state(
+    prefix = "###"
+) }}
+
+### blur(Object)
 
-{{ use: partial-line-style(
-    prefix = "####",
-    hasCurveness = true
+{{ use: lines-state(
+    prefix = "###"
 ) }}
 
-#### label(Object)
+### select(Object)
 
-{{ use: lines-label(
-    prefix = "####"
+{{ use: lines-state(
+    prefix = "###"
 ) }}
 
 {{ use: partial-marker(
@@ -206,7 +223,7 @@ Label of a single line. Available when [polyline](~series-lines.polyline) is not
 
 {{ use: partial-z-zlevel(
     prefix = "#",
-    componentName = "lines graph"
+    componentName = "路径图"
 ) }}
 
 {{ use: partial-silent(
@@ -240,3 +257,19 @@ the position of label, options:
     prefix = ${prefix}
 ) }}
 
+
+
+{{ target: lines-state }}
+
+#${prefix} lineStyle(Object)
+
+{{ use: partial-line-style(
+    prefix = '#' + ${prefix}
+) }}
+
+#${prefix} label(Object)
+
+{{ use: lines-label(
+    prefix = "#" + ${prefix}
+) }}
+
diff --git a/en/option/series/map.md b/en/option/series/map.md
index 5a0fdc7..d898f58 100644
--- a/en/option/series/map.md
+++ b/en/option/series/map.md
@@ -108,11 +108,37 @@ Color of the area.
 
 Emphasis state of specified region.
 
+{{ use: map-region-state() }}
+
+### select(Object)
+
+Select state of polygon.
+
+{{ use: map-region-state() }}
+
+{{ use: partial-tooltip-in-series-data() }}
+
+{{ use: partial-marker(
+    prefix = "#",
+    seriesType = "map",
+    hasCoord = true
+) }}
+
+{{ use: partial-silent(
+    prefix = "#"
+) }}
+
+{{ use: partial-tooltip-in-series() }}
+
+
+
+{{ target: map-region-state }}
+
 #### itemStyle(Object)
 
 ##### areaColor(Color)
 
-Area color in the map.
+The color of the map area.
 
 {{ use: partial-color-desc() }}
 
@@ -129,17 +155,3 @@ Area color in the map.
     noVerticalAlign = true
 ) }}
 
-{{ use: partial-tooltip-in-series-data() }}
-
-{{ use: partial-marker(
-    prefix = "#",
-    seriesType = "map",
-    hasCoord = true
-) }}
-
-{{ use: partial-silent(
-    prefix = "#"
-) }}
-
-{{ use: partial-tooltip-in-series() }}
-
diff --git a/en/option/series/pictorialBar.md b/en/option/series/pictorialBar.md
index 96016a7..7dfc3c4 100644
--- a/en/option/series/pictorialBar.md
+++ b/en/option/series/pictorialBar.md
@@ -98,17 +98,32 @@ See the example below:
 
 ## emphasis(Object)
 
-### label(Object)
+Configurations of emphasis state.
 
-{{ use: partial-label(
-    prefix = "###",
-    formatter = true
+{{ use: partial-focus-blur-scope() }}
+
+{{ use: pictoialBar-state(
+    prefix = "##"
 ) }}
 
-### itemStyle(Object)
+## blur(Object)
 
-{{ use: partial-item-style(
-    prefix = "###"
+Configurations of blur state. Available when [emphasis.focus](~series-pictoialBar.emphasis.focus) is set.
+
+{{ use: pictoialBar-state(
+    prefix = "##"
+) }}
+
+## select(Object)
+
+Configurations of select state. Available when [selectedMode](~series-pictoialBar.selectedMode) is set.
+
+{{ use: partial-selected-mode(
+    version = '5.0.0'
+) }}
+
+{{ use: pictoialBar-state(
+    prefix = "##"
 ) }}
 
 {{ use: partial-barGrid(
@@ -162,16 +177,26 @@ The style setting of the text label in a single bar.
 
 ### emphasis(Object)
 
-#### label(Object)
+Emphasis state of the specified single data.
 
-{{ use: partial-label(
-    prefix = "####"
+{{ use: partial-bar-state(
+    prefix = "###"
 ) }}
 
-#### itemStyle(Object)
+### blur(Object)
 
-{{ use: partial-item-style(
-    prefix = "####"
+Blur state of the specified single data.
+
+{{ use: partial-bar-state(
+    prefix = "###"
+) }}
+
+### select(Object)
+
+Select state of the specified single data.
+
+{{ use: partial-bar-state(
+    prefix = "###"
 ) }}
 
 {{ use: partial-tooltip-in-series-data() }}
@@ -185,7 +210,7 @@ The style setting of the text label in a single bar.
 
 {{ use: partial-z-zlevel(
     prefix = "#",
-    componentName = "pictorial bar chart"
+    componentName = "Pictorial bar chart "
 ) }}
 
 {{ use: partial-silent(
@@ -540,3 +565,20 @@ series: [{
 }]
 ```
 
+
+
+{{ target: pictoialBar-state }}
+
+#${prefix} label(Object)
+
+{{ use: partial-label(
+    prefix = "#" + ${prefix},
+    formatter = ${prefix} === '##'
+) }}
+
+#${prefix} itemStyle(Object)
+
+{{ use: partial-item-style(
+    prefix = "#" + ${prefix}
+) }}
+
diff --git a/en/option/series/pie.md b/en/option/series/pie.md
index afef182..60dc7a6 100644
--- a/en/option/series/pie.md
+++ b/en/option/series/pie.md
@@ -29,20 +29,6 @@ For multiple pie series in a single chart, you may use [left](~series-pie.left),
 
 {{ use: partial-legend-hover-link() }}
 
-## hoverAnimation(boolean) = true
-
-<ExampleUIControlBoolean default="true" />
-
-Whether to enable the zoom animation effects when hovering sectors.
-
-## hoverOffset(number) = 10
-
-<ExampleUIControlNumber min="0" default="10" />
-
-The offset distance of hovered sector.
-
-## selectedMode(boolean|string) = false
-
 {{ use: partial-selected-mode() }}
 
 ## selectedOffset(number) = 10
@@ -189,27 +175,38 @@ The style of visual guide line. Will show when [label position](~series-pie.labe
 
 Configurations of emphasis state.
 
-### label(Object)
+### scale(boolean) = true
 
-{{ use: partial-pie-label(
-    prefix = "###",
-    position = false,
-    formatter = true
+<ExampleUIControlBoolean default="true" />
+
+Whether to scale to highlight the data in emphasis state.
+
+### scaleSize(number) = 10
+
+<ExampleUIControlNumber min="0" default="10" />
+
+Size of scale. Available when [emphasis.scale](~series-pie.emphasis.scale) is set `true`.
+
+{{ use: partial-focus-blur-scope() }}
+
+{{ use: pie-state(
+    prefix = "##"
 ) }}
 
-### labelLine(Object)
+## blur(Object)
 
-{{ use: partial-pie-label-line(
-    prefix = '###',
-    length = false,
-    length2 = false,
-    smooth = false
+Configurations of blur state. Available when [emphasis.focus](~series-pie.emphasis.focus) is set.
+
+{{ use: pie-state(
+    prefix = "##"
 ) }}
 
-### itemStyle(Object)
+## select(Object)
 
-{{ use: partial-item-style(
-    prefix = "###"
+Configurations of select state. Available when [selectedMode](~series-pie.selectedMode) is set.
+
+{{ use: pie-state(
+    prefix = "##"
 ) }}
 
 {{ use: component-circular-layout(
@@ -217,7 +214,7 @@ Configurations of emphasis state.
     defaultRadius = "[0, '75%']"
 ) }}
 
-You can set a large inner radius for a Donut chart.
+Donut chart can be achieved by setting a inner radius.
 
 {{ use: partial-seriesLayoutBy() }}
 
@@ -276,27 +273,20 @@ The label configuration of a single sector.
 
 ### emphasis(Object)
 
-#### label(Object)
-
-{{ use: partial-pie-label(
-    prefix = "####",
-    position = false,
-    formatter = false
+{{ use: pie-state(
+    prefix = "###"
 ) }}
 
-#### labelLine(Object)
+### blur(Object)
 
-{{ use: partial-pie-label-line(
-    prefix = '####',
-    length = false,
-    length2 = false,
-    smooth = false
+{{ use: pie-state(
+    prefix = "###"
 ) }}
 
-#### itemStyle(Object)
+### select(Object)
 
-{{ use: partial-item-style(
-    prefix = "####"
+{{ use: pie-state(
+    prefix = "###"
 ) }}
 
 {{ use: partial-tooltip-in-series-data() }}
@@ -426,3 +416,30 @@ Whether to smooth the visual guide line. It defaults to be `false` and can be se
     prefix = "#" + ${prefix}
 ) }}
 
+
+
+{{ target: pie-state }}
+
+#${prefix} label(Object)
+
+{{ use: partial-pie-label(
+    prefix = "#" + ${prefix},
+    position = false,
+    formatter = ${prefix} === '##'
+) }}
+
+#${prefix} labelLine(Object)
+
+{{ use: partial-pie-label-line(
+    prefix = "#" + ${prefix},
+    length = false,
+    length2 = false,
+    smooth = false
+) }}
+
+#${prefix} itemStyle(Object)
+
+{{ use: partial-item-style(
+    prefix = "#" + ${prefix}
+) }}
+
diff --git a/en/option/series/radar.md b/en/option/series/radar.md
index 914efc5..4c64d1f 100644
--- a/en/option/series/radar.md
+++ b/en/option/series/radar.md
@@ -75,31 +75,33 @@ Area filling style.
 
 ## emphasis(Object)
 
-高亮的样式设置
+Configurations of emphasis state.
 
-### itemStyle(Object)
+{{ use: partial-focus-blur-scope() }}
 
-{{ use: partial-item-style(
-    prefix = "###"
+{{ use: radar-state(
+    prefix = "##"
 ) }}
 
-### label(Object)
+## blur(Object)
 
-{{ use: partial-label(
-    prefix = "###",
-    formatter = true
+Configurations of blur state. Available when [emphasis.focus](~series-radar.emphasis.focus) is set.
+
+{{ use: radar-state(
+    prefix = "##"
 ) }}
 
-### lineStyle(Object)
+## select(Object)
 
-{{ use: partial-line-style(
-    prefix = "###"
-) }}
+Configurations of select state. Available when [selectedMode](~series-radar.selectedMode) is set.
 
-### areaStyle(Object)
 
-{{ use: partial-area-style(
-    prefix = "###"
+{{ use: radar-state(
+    prefix = "##"
+) }}
+
+{{ use: partial-selected-mode(
+    version = '5.0.0'
 ) }}
 
 ## data(Array)
@@ -173,36 +175,31 @@ Area filling style of a single item.
 
 Configurations of emphasis state.
 
-#### label(Object)
-
-{{ use: partial-label(
-    prefix = "####",
-    defaultPosition = "top"
+{{ use: radar-state(
+    prefix = "###"
 ) }}
 
-#### itemStyle(Object)
-
-{{ use: partial-item-style(
-    prefix = "####"
-) }}
+### blur(Object)
 
-#### lineStyle(Object)
+单个数据项样式的淡出状态。
 
-{{ use: partial-line-style(
-    prefix = "####"
+{{ use: radar-state(
+    prefix = "###"
 ) }}
 
-#### areaStyle(Object)
+### select(Object)
 
-{{ use: partial-area-style(
-    prefix = "####"
+单个数据项样式的选中状态。
+
+{{ use: radar-state(
+    prefix = "###"
 ) }}
 
 {{ use: partial-tooltip-in-series-data() }}
 
 {{ use: partial-z-zlevel(
     prefix = "#",
-    componentName = "radar chart"
+    componentName = "Radar"
 ) }}
 
 {{ use: partial-silent(
@@ -215,3 +212,32 @@ Configurations of emphasis state.
 
 {{ use: partial-tooltip-in-series() }}
 
+
+
+{{ target: radar-state }}
+
+#${prefix} itemStyle(Object)
+
+{{ use: partial-item-style(
+    prefix = "#" + ${prefix}
+) }}
+
+#${prefix} label(Object)
+
+{{ use: partial-label(
+    prefix = "#" + ${prefix},
+    formatter = ${prefix} === '##'
+) }}
+
+#${prefix} lineStyle(Object)
+
+{{ use: partial-line-style(
+    prefix = "#" + ${prefix}
+) }}
+
+#${prefix} areaStyle(Object)
+
+{{ use: partial-area-style(
+    prefix = "#" + ${prefix}
+) }}
+
diff --git a/en/option/series/sankey.md b/en/option/series/sankey.md
index ac1b3fc..34d60b4 100644
--- a/en/option/series/sankey.md
+++ b/en/option/series/sankey.md
@@ -82,20 +82,6 @@ The layout direction of the nodes in the Sankey diagram, which can be horizontal
 
 The drag-and-drop interaction of the node, which is enabled by default. After opening, the user can drag any node in the Sankey diagram to any position. To turn this interaction off, simply set the value to `false`.
 
-## focusNodeAdjacency(boolean|string) = false
-
-<ExampleUIControlEnum options="false,true,allEdges,outEdges,inEdges" />
-
-Support when mouse hovering over a node or an edge, the adjacent nodes and edges are also highlighted. Default off, can be manually opened.
-
-Optional values:
-
-+ `false`: When hovering over a node or an edge, only the hovered node or edge is highlighted.
-+ `true`: the same as `'allEdges'`.
-+ `'allEdges'`: When hovering over a node, all of the adjacent edges and nodes are highlighted. When hovering over an edge, the adjacent nodes are highlighted.
-+ `'outEdges'`: When hovering over a node, the outcoming edges and its adjacent nodes are highlighted. When hovering over an edge, the adjacent nodes are highlighted.
-+ `'inEdges'`: When hovering over a node, the incoming edges and its adjacent nodes are highlighted. When hovering over an edge, the adjacent nodes are highlighted.
-
 ## levels(Array)
 
 The setting of each layer of Sankey diagram. Can be set layer by layer, as follows:
@@ -143,20 +129,25 @@ levels: [{
 
 Specify which layer is set, value starts from 0.
 
-### itemStyle(Object)
+{{ use: sankey-state(
+    prefix = "##"
+) }}
 
-Specify the node style of the specific layer.
+### emphasis(Object)
 
-{{ use: partial-item-style(
-    prefix = "###",
-    useColorPalatte = true
+{{ use: sankey-state(
+    prefix = "###"
 ) }}
 
-### lineStyle(Object)
+### blur(Object)
 
-Specify the outEdge style of the specific layer. in which [lineStyle.color](~series-sankey.lineStyle.color) can be assigned to the value of `'source'` of `'target'`, then the OutEdge will automatically take the source node or target node color as its own color.
+{{ use: sankey-state(
+    prefix = "###"
+) }}
 
-{{ use: partial-sankey-line-style(
+### select(Object)
+
+{{ use: sankey-state(
     prefix = "###"
 ) }}
 
@@ -200,23 +191,32 @@ The edge style of Sankey diagram, in which [lineStyle.color](~series-sankey.line
 
 Configurations of emphasis state.
 
-### label(Object)
+{{ use: partial-focus-blur-scope(
+    isTree = true
+) }}
 
-{{ use: partial-label(
-    prefix = "###",
-    formatter1d = true
+{{ use: sankey-state(
+    prefix = "##"
 ) }}
 
-### itemStyle(Object)
+## blur(Object)
 
-{{ use: partial-item-style(
-    prefix = "###"
+桑基图的淡出状态。开启 [emphasis.focus](~series-sankey.emphasis.focus) 后有效。
+
+{{ use: sankey-state(
+    prefix = "##"
 ) }}
 
-### lineStyle(Object)
+## select(Object)
 
-{{ use: partial-sankey-line-style(
-    prefix = "###"
+桑基图的选中状态。开启 [selectedMode](~series-sankey.selectedMode) 后有效。
+
+{{ use: sankey-state(
+    prefix = "##"
+) }}
+
+{{ use: partial-selected-mode(
+    version = '5.0.0'
 ) }}
 
 ## data(Array)
@@ -267,16 +267,20 @@ The lable style of this node.
 
 ### emphasis(Object)
 
-#### itemStyle(Object)
+{{ use: sankey-node-state(
+    prefix = "###"
+) }}
+
+### blur(Object)
 
-{{ use: partial-item-style(
-    prefix = "####"
+{{ use: sankey-node-state(
+    prefix = "###"
 ) }}
 
-#### label(Object)
+### select(Object)
 
-{{ use: partial-label(
-    prefix = "####"
+{{ use: sankey-node-state(
+    prefix = "###"
 ) }}
 
 {{ use: partial-tooltip-in-series-data() }}
@@ -327,6 +331,22 @@ The line stlye of edge.
     prefix = "####"
 ) }}
 
+### blur(Object)
+
+#### lineStyle(Object)
+
+{{ use: partial-sankey-line-style(
+    prefix = "####"
+) }}
+
+### select(Object)
+
+#### lineStyle(Object)
+
+{{ use: partial-sankey-line-style(
+    prefix = "####"
+) }}
+
 ## edges(Array)
 
 Equals to [links](~series-sankey.links)
@@ -357,9 +377,50 @@ The opacity of the edge in Sankey diagram.
 
 #${prefix} curveness(number) = 0.5
 
+<ExampleUIControlNumber min="0" max="1" default="0.5" step="0.1" />
+
 The curveness of the edge in Sankey diagram.
 
 {{ use: partial-style-shadow(
     prefix = ${prefix}
 ) }}
 
+
+
+{{ target: sankey-node-state }}
+
+#${prefix} label(Object)
+
+{{ use: partial-label(
+    prefix = "#" + ${prefix}
+) }}
+
+#${prefix} itemStyle(Object)
+
+{{ use: partial-item-style(
+    prefix = "#" + ${prefix}
+) }}
+
+
+
+{{ target: sankey-state }}
+
+#${prefix} label(Object)
+
+{{ use: partial-label(
+    prefix = "#" + ${prefix},
+    formatter1d = ${prefix} === '##'
+) }}
+
+#${prefix} itemStyle(Object)
+
+{{ use: partial-item-style(
+    prefix = "#" + ${prefix}
+) }}
+
+#${prefix} lineStyle(Object)
+
+{{ use: partial-sankey-line-style(
+    prefix = "#" + ${prefix}
+) }}
+
diff --git a/en/option/series/scatter.md b/en/option/series/scatter.md
index 7d7c1c9..d06df33 100644
--- a/en/option/series/scatter.md
+++ b/en/option/series/scatter.md
@@ -25,12 +25,6 @@ It could be used with [rectangular coordinate](~grid) and [polar coordinate](~po
     calendar = true
 ) }}
 
-## hoverAnimation(boolean)
-
-<ExampleUIControlBoolean default="true" />
-
-Whether to enable the animation effect when mouse is on the symbol.
-
 {{ use: partial-legend-hover-link() }}
 
 {{ use: partial-symbol(
@@ -78,17 +72,36 @@ Whether to enable the animation effect when mouse is on the symbol.
 
 Configurations of emphasis state.
 
-### label(Object)
+### scale(boolean) = true
 
-{{ use: partial-label(
-    prefix = "###",
-    formatter = true
+<ExampleUIControlBoolean default="true" />
+
+Whether to scale to highlight the data in emphasis state.
+
+{{ use: partial-focus-blur-scope() }}
+
+{{ use: scatter-state(
+    prefix = "##"
 ) }}
 
-### itemStyle(Object)
+## blur(Object)
 
-{{ use: partial-item-style(
-    prefix = "###"
+Configurations of blur state. Available when [emphasis.focus](~series-scatter.emphasis.focus) is set.
+
+{{ use: scatter-state(
+    prefix = "##"
+) }}
+
+## select(Object)
+
+Configurations of select state. Available when [selectedMode](~series-scatter.selectedMode) is set.
+
+{{ use: scatter-state(
+    prefix = "##"
+) }}
+
+{{ use: partial-selected-mode(
+    version = '5.0.0'
 ) }}
 
 {{ use: partial-progressive(
@@ -143,16 +156,24 @@ the style setting about single data point(bubble).
 
 Emphasis state of single data.
 
-#### label(Object)
+{{ use: scatter-state(
+    prefix = "###"
+) }}
+
+### blur(Object)
 
-{{ use: partial-label(
-    prefix = "####"
+Blur state of single data.
+
+{{ use: scatter-state(
+    prefix = "###"
 ) }}
 
-#### itemStyle(Object)
+### select(Object)
 
-{{ use: partial-item-style(
-    prefix = "####"
+Select state of single data.
+
+{{ use: scatter-state(
+    prefix = "###"
 ) }}
 
 {{ use: partial-tooltip-in-series-data() }}
@@ -170,7 +191,7 @@ Emphasis state of single data.
 
 {{ use: partial-z-zlevel(
     prefix = "#",
-    componentName = "scatter chart"
+    componentName = "Scatter"
 ) }}
 
 {{ use: partial-silent(
@@ -183,3 +204,20 @@ Emphasis state of single data.
 
 {{ use: partial-tooltip-in-series() }}
 
+
+
+{{ target: scatter-state }}
+
+#${prefix} label(Object)
+
+{{ use: partial-label(
+    prefix = "#" + ${prefix},
+    formatter = ${prefix} === '##'
+) }}
+
+#${prefix} itemStyle(Object)
+
+{{ use: partial-item-style(
+    prefix = "#" + ${prefix}
+) }}
+
diff --git a/en/option/series/sunburst.md b/en/option/series/sunburst.md
index aaef0f4..ee35947 100644
--- a/en/option/series/sunburst.md
+++ b/en/option/series/sunburst.md
@@ -5,6 +5,7 @@
 
 <ExampleUIControlEnum options="radial,tangential" default="radial" />
 
+{{ if: ${prefix} === '##' }}
 If it is `number` type, then is stands for rotation, from -90 degrees to 90 degrees, and positive values stand for counterclockwise.
 
 Besides, it can be string `'radial'`, standing for radial rotation; or `'tangential'`, standing for tangential rotation.
@@ -15,13 +16,21 @@ The following example shows different `rotate` settings:
 
 ~[700x400](${galleryViewPath}sunburst-label-rotate&edit=1&reset=1)
 
+{{ else }}
+Same to [label.rotate](~sunburst.label.rotate)
+{{ /if }}
+
 #${prefix} align(string) = 'center'
 
 <ExampleUIControlEnum options="left,center,right" default="center" />
 
 Align of text, which can be `'left'`, `'center'`, or `'right'`. Note that `'left'` stands for inner side, and `'right'` stands for outer side.
 
+{{ if: ${prefix} === '##' }}
 ~[700x400](${galleryViewPath}doc-example/sunburst-label-align&edit=1&reset=1)
+{{ else }}
+Same to [label.align](~sunburst.label.align)
+{{ /if }}
 
 #${prefix} minAngle(number) = null
 
@@ -42,34 +51,32 @@ If angle of data piece is smaller than this value (in degrees), then text is not
 
 {{ target: partial-sunburst-label-props }}
 
-${prefix} label(Object)
+#${prefix} label(Object)
 
-`label` sets the text style for every sectors.
+`label` 描述了每个扇形块中,文本标签的样式。
 
-**Priority: [series.data.label](~series-sunburst.data.label) > [series.levels.label](~series-sunburst.levels.label) > [series.label](~series-sunburst.label).**
+**优先级:[series.data.label](~series-sunburst.data.label) > [series.levels.label](~series-sunburst.levels.label) > [series.label](~series-sunburst.label)。**
 
 {{ use: partial-label-desc() }}
 
 {{ use: partial-sunburst-label-helper(
-    prefix = ${prefix}
+    prefix = ${prefix} + '#'
 ) }}
 
 
 
 {{ target: partial-sunburst-itemStyle-props }}
 
-${prefix} itemStyle(Object)
-
-Style of Sunburst sectors.
+#${prefix} itemStyle(Object)
 
-Style can be set in [series.itemStyle](~series-sunburst.itemStyle) for sectors of this series, or [series.levels.itemStyle](~series-sunburst.levels.itemStyle) for the whole level, or[series.data.itemStyle](~series-sunburst.data.itemStyle) for single sector. If [series.data.itemStyle](~series-sunburst.data.itemStyle) is defined, it will cover the setting of [series.itemStyle](~series-sunburst.itemStyle) and [series.levels.itemStyle](~series-sunburst.levels.itemStyle).
+旭日图扇形块的样式。
 
-**Priority: [series.data.itemStyle](~series-sunburst.data.itemStyle) > [series.levels.itemStyle](~series-sunburst.levels.itemStyle) > [series.itemStyle](~series-sunburst.itemStyle).**
+可以在 [series.itemStyle](~series-sunburst.itemStyle) 定义所有扇形块的样式,也可以在 [series.levels.itemStyle](~series-sunburst.levels.itemStyle) 定义每一层扇形块的样式,还可以在 [series.data.itemStyle](~series-sunburst.data.itemStyle) 定义每个扇形块单独的样式,这三者的优先级从低到高。也就是说,如果定义了 [series.data.itemStyle](~series-sunburst.data.itemStyle),将会覆盖 [series.itemStyle](~series-sunburst.itemStyle) 和 [series.levels.itemStyle](~series-sunburst.levels.itemStyle)。
 
-In ECharts, *emphasis* is for styles when mouse hovers. For Sunburst charts, there are two extra states: *highlight* for highlighting items that relates to the emphasized one, and *downplay* for others when emphasizing an item. See [highlightPolicy](~series-sunburst.highlightPolicy).
+**优先级:[series.data.itemStyle](~series-sunburst.data.itemStyle) > [series.levels.itemStyle](~series-sunburst.levels.itemStyle) > [series.itemStyle](~series-sunburst.itemStyle)。**
 
 {{ use: partial-item-style(
-    prefix = ${prefix},
+    prefix = ${prefix} + '#',
     useColorPalatte = true,
     defaultBorderWidth = 1,
     defaultBorderColor = "'white'",
@@ -78,42 +85,14 @@ In ECharts, *emphasis* is for styles when mouse hovers. For Sunburst charts, the
 
 
 
-{{ target: partial-sunburst-other-state }}
-
-#${prefix} emphasis(Object)
-
-Item style when mouse is hovering. See [highlightPolicy](~series-sunburst.highlightPolicy).
-
-{{ use: partial-sunburst-label-props(
-    prefix = "##" + ${prefix}
-) }}
-
-{{ use: partial-sunburst-itemStyle-props(
-    prefix = "##" + ${prefix}
-) }}
-
-#${prefix} highlight(Object)
-
-Item style when mouse is hovering related items. See [highlightPolicy](~series-sunburst.highlightPolicy).
-
-{{ use: partial-sunburst-label-props(
-    prefix = "##" + ${prefix}
-) }}
-
-{{ use: partial-sunburst-itemStyle-props(
-    prefix = "##" + ${prefix}
-) }}
-
-#${prefix} downplay(Object)
-
-Item style when mouse is hovering unrelated items. See [highlightPolicy](~series-sunburst.highlightPolicy).
+{{ target: partial-sunburst-state }}
 
 {{ use: partial-sunburst-label-props(
-    prefix = "##" + ${prefix}
+    prefix = ${prefix}
 ) }}
 
 {{ use: partial-sunburst-itemStyle-props(
-    prefix = "##" + ${prefix}
+    prefix = ${prefix}
 ) }}
 
 
@@ -147,12 +126,6 @@ Sunburst charts support data mining by default. That means, when a user clicks a
     defaultRadius = "[0, '75%']"
 ) }}
 
-## labelLayout(Object|Function)
-
-{{ use: partial-label-layout(
-    prefix = "##"
-) }}
-
 ## data(Array)
 
 The data structure of [series-sunburst.data](~series-sunburst.data) is like tree. For example:
@@ -213,22 +186,12 @@ See [series-sunburst.data.target](~series-sunburst.data.target).
 Like `target` attribute of HTML `<a>`, which can either be `'blank'` or `'self'`. See [series-sunburst.data.link](~series-sunburst.data.link).
 
 {{ use: partial-sunburst-label-props(
-    prefix = "###"
-) }}
-
-{{ use: partial-sunburst-itemStyle-props(
-    prefix = "###"
-) }}
-
-{{ use: partial-sunburst-other-state(
     prefix = "##"
 ) }}
 
-### children(Array)
-
-Children nodes, which is recursively defined. In the same format to [series-sunburst.data](~series-sunburst.data).
+## labelLayout(Object|Function)
 
-{{ use: partial-sunburst-label-props(
+{{ use: partial-label-layout(
     prefix = "##"
 ) }}
 
@@ -236,35 +199,33 @@ Children nodes, which is recursively defined. In the same format to [series-sunb
     prefix = "##"
 ) }}
 
-## highlightPolicy(string) = 'descendant'
+### emphasis
 
-<ExampleUIControlEnum default="descendant" options="descendant,ancestor,none" />
+Emphasis state.
 
-When mouse hovers a sector, the sector is emphasized. **If `highlightPolicy` is set to be `'descendant'`, then the sector and its descendant will be *highlighted*, and others will be *downplayed*. If `highlightPolicy` is `'ancestor'`, then the sector and its ancestors will be highlighted. If it is set to be `'self'`, then the sector will be highlighted and others downplayed. If it is set to be `'none'`, then others will not be downplayed.**
+{{ use: partial-sunburst-state(
+    prefix = "###"
+) }}
 
-~[700x350](${galleryViewPath}doc-example/sunburst-highlight-descendant&edit=1&reset=1)
+### blur
 
-The `highlightPolicy` value above is the default value `'descendant'`. We use `dispatchAction` to highlight certain sector. Target sector will use the style of `emphasis`, and related sectors decided by `highlightPolicy` uses the style of `highlight`, and others use `downplay`.
+Blur state.
 
-```js
-itemStyle: {
-    color: 'yellow',
-    borderWidth: 2,
-    emphasis: {
-        color: 'red'
-    },
-    highlight: {
-        color: 'orange'
-    },
-    downplay: {
-        color: '#ccc'
-    }
-}
-```
+{{ use: partial-sunburst-state(
+    prefix = "###"
+) }}
+
+### select
 
-If `highlightPolicy` is set to be `'ancestor'`, then the result looks like:
+Select state.
 
-~[700x350](${galleryViewPath}doc-example/sunburst-highlight-ancestor&edit=1&reset=1)
+{{ use: partial-sunburst-state(
+    prefix = "###"
+) }}
+
+### children(Array)
+
+子节点,递归定义,格式同 [series-sunburst.data](~series-sunburst.data)。
 
 ## nodeClick(boolean|string) = 'rootToNode'
 
@@ -295,15 +256,43 @@ function(nodeA, nodeB) {
 If there is no `name`, whether need to render it.
 
 {{ use: partial-sunburst-label-props(
-    prefix = "##"
+    prefix = "#"
 ) }}
 
 {{ use: partial-sunburst-itemStyle-props(
+    prefix = "#"
+) }}
+
+## emphasis
+
+Configurations of emphasis state.
+
+{{ use: partial-focus-blur-scope(
+    isTree = true
+) }}
+
+{{ use: partial-sunburst-state(
     prefix = "##"
 ) }}
 
-{{ use: partial-sunburst-other-state(
-    prefix = "#"
+## blur
+
+Configurations of blur state. Available when [emphasis.focus](~series-sunburst.emphasis.focus) is set.
+
+{{ use: partial-sunburst-state(
+    prefix = "##"
+) }}
+
+## select
+
+Configurations of select state. Available when [selectedMode](~series-sunburst.selectedMode) is set.
+
+{{ use: partial-sunburst-state(
+    prefix = "##"
+) }}
+
+{{ use: partial-selected-mode(
+    version = '5.0.0'
 ) }}
 
 ## levels(Array)
@@ -338,15 +327,35 @@ series: {
 ```
 
 {{ use: partial-sunburst-label-props(
-    prefix = "###"
+    prefix = "##"
 ) }}
 
 {{ use: partial-sunburst-itemStyle-props(
+    prefix = "##"
+) }}
+
+### emphasis
+
+Emphasis state.
+
+{{ use: partial-sunburst-state(
     prefix = "###"
 ) }}
 
-{{ use: partial-sunburst-other-state(
-    prefix = "##"
+### blur
+
+Blur state.
+
+{{ use: partial-sunburst-state(
+    prefix = "###"
+) }}
+
+### select
+
+Select state.
+
+{{ use: partial-sunburst-state(
+    prefix = "###"
 ) }}
 
 {{ use: partial-animation(
diff --git a/en/option/series/themeRiver.md b/en/option/series/themeRiver.md
index 3e7c738..4a74909 100644
--- a/en/option/series/themeRiver.md
+++ b/en/option/series/themeRiver.md
@@ -85,24 +85,30 @@ style of each ribbon-shape river branch in theme river.
 
 Configurations of emphasis state.
 
-### label(Object)
+{{ use: partial-focus-blur-scope() }}
 
-{{ use: partial-label(
-    prefix = "###",
-    defaultPosition = "'left'",
-    defaultMargin = 4,
-    noAlign = true,
-    noVerticalAlign = true,
-    defaultColor = "'#000'",
-    defaultFontSize = 11
+{{ use: themeRiver-state(
+    prefix = "##"
 ) }}
 
-### itemStyle(Object)
+## blur(Object)
 
-{{ use: partial-item-style(
-    prefix = "###",
-    defaultShadowBlur = 20,
-    defaultShadowColor = "'rgba(0,0,0,0.8)'"
+Configurations of blur state.
+
+{{ use: themeRiver-state(
+    prefix = "##"
+) }}
+
+## select(Object)
+
+Configurations of select state.
+
+{{ use: themeRiver-state(
+    prefix = "##"
+) }}
+
+{{ use: partial-selected-mode(
+    version = '5.0.0'
 ) }}
 
 ## data(Array)
@@ -141,3 +147,25 @@ the name of an event or theme.
 
 {{ use: partial-tooltip-in-series() }}
 
+
+
+{{ target: themeRiver-state }}
+
+#${prefix} label(Object)
+
+{{ use: partial-label(
+    prefix = "#" + ${prefix},
+    defaultPosition = "'left'",
+    defaultMargin = 4,
+    noAlign = true,
+    noVerticalAlign = true,
+    defaultColor = "'#000'",
+    defaultFontSize = 11
+) }}
+
+#${prefix} itemStyle(Object)
+
+{{ use: partial-item-style(
+    prefix = "#" + ${prefix}
+) }}
+
diff --git a/en/option/series/tree.md b/en/option/series/tree.md
index 9774189..8f7072d 100644
--- a/en/option/series/tree.md
+++ b/en/option/series/tree.md
@@ -142,23 +142,32 @@ Defines the style of the tree edge.
 
 Configurations of emphasis state.
 
-### itemStyle(Object)
+{{ use: partial-focus-blur-scope(
+    isTree = true
+) }}
 
-{{ use: partial-item-style(
-    prefix = "###"
+{{ use: tree-state(
+    prefix = "##"
 ) }}
 
-### lineStyle(Object)
+## blur(Object)
 
-{{ use: partial-tree-line-style(
-    prefix = "###"
+Configurations of blur state. Available when [emphasis.focus](~series-tree.emphasis.focus) is set.
+
+{{ use: tree-state(
+    prefix = "##"
 ) }}
 
-### label(Object)
+## select(Object)
 
-{{ use: partial-label(
-    prefix = "###",
-    formatter1d = true
+Configurations of select state. Available when [selectedMode](~series-tree.selectedMode) is set.
+
+{{ use: tree-state(
+    prefix = "##"
+) }}
+
+{{ use: partial-selected-mode(
+    version = '5.0.0'
 ) }}
 
 ## leaves(Object)
@@ -188,17 +197,24 @@ The style of the leaf node in the tree.
 
 Emphasis state of leaves nodes.
 
-#### label(Object)
+{{ use: tree-node-state(
+    prefix = "###"
+) }}
 
-{{ use: partial-label(
-    prefix = "####",
-    formatter1d = true
+### blur(Object)
+
+Blur state of leaves nodes.
+
+{{ use: tree-node-state(
+    prefix = "###"
 ) }}
 
-#### itemStyle(Object)
+### select(Object)
 
-{{ use: partial-item-style(
-    prefix = "####"
+Select state of leaves nodes.
+
+{{ use: tree-node-state(
+    prefix = "###"
 ) }}
 
 ## data(Object)
@@ -261,16 +277,24 @@ The label of the node.
 
 Emphasis state of a single node.
 
-#### label(Object)
+{{ use: tree-node-state(
+    prefix = "###"
+) }}
+
+### blur(Object)
 
-{{ use: partial-label(
-    prefix = "####"
+Blur state of a single node.
+
+{{ use: tree-node-state(
+    prefix = "###"
 ) }}
 
-#### itemStyle(Object)
+### select(Object)
 
-{{ use: partial-item-style(
-    prefix = "####"
+Select state of a single node.
+
+{{ use: tree-node-state(
+    prefix = "###"
 ) }}
 
 {{ use: partial-tooltip-in-series-data() }}
@@ -309,3 +333,42 @@ The curvature of the tree edge.
     prefix = ${prefix}
 ) }}
 
+
+
+{{ target: tree-node-state }}
+
+#${prefix} itemStyle(Object)
+
+{{ use: partial-item-style(
+    prefix = "#" + ${prefix}
+) }}
+
+#${prefix} label(Object)
+
+{{ use: partial-label(
+    prefix = "#" + ${prefix},
+    formatter1d = ${prefix} === '##'
+) }}
+
+
+
+{{ target: tree-edge-state }}
+
+#${prefix} lineStyle(Object)
+
+{{ use: partial-tree-line-style(
+    prefix = "#" + ${prefix}
+) }}
+
+
+
+{{ target: tree-state }}
+
+{{ use: tree-node-state(
+    prefix = ${prefix}
+) }}
+
+{{ use: tree-edge-state(
+    prefix = ${prefix}
+) }}
+
diff --git a/en/option/series/treemap.md b/en/option/series/treemap.md
index 634731c..2935bec 100644
--- a/en/option/series/treemap.md
+++ b/en/option/series/treemap.md
@@ -12,7 +12,7 @@
 ~[700x580](${galleryViewPath}treemap-obama&edit=1&reset=1)
 
 
-<br>
+
 **Visual Mapping:**
 
 treemap maps the numerical values to area.
@@ -21,7 +21,6 @@ Moreover, it is able to map some dimensions of data to other visual channel, lik
 
 {{ use: partial-treemap-visual-detial() }}
 
-<br>
 **Drill Down:**
 
 The feature `drill down` means: when clicking a tree node, this node will be set as root and its children will be shown. When [leafDepth](~series-treemap.leafDepth) is set, this feature is enabled.
@@ -29,9 +28,7 @@ The feature `drill down` means: when clicking a tree node, this node will be set
 **An example about drill down:**
 ~[800x500](${galleryViewPath}treemap-drill-down&edit=1&reset=1)
 
-<br>
-<br>
-<br>
+
 Notice: There are some difference in treemap configuration between ECharts3 and ECharts2. Some immature configuration ways are no longer supported:
 
 + The position method using `center/size` is no longer supported, and `left/top/bottom/right/width/height` are used to position treemap, as other components do.
@@ -44,9 +41,6 @@ Notice: There are some difference in treemap configuration between ECharts3 and
 
 + The configuration items `itemStyle.childBorderWidth` and `itemStyle.childBorderColor` are not supported anymore (because in this way only 2 levels can be defined). [series-treemap.levels](~series-treemap.levels) is used to define all levels now.
 
-<br>
-<br>
-
 ## type(string) = 'treemap'
 
 {{ use: partial-component-id(
@@ -113,6 +107,96 @@ The behaviour when clicking a node. Optional values are:
 
 The treemap will be auto zoomed to a appropriate ratio when a node is clicked (when [nodeClick](~series-treemap.nodeClick) is set as `'zoomToNode'` and no drill down happens). This configuration item indicates the ratio.
 
+{{ use: partial-treemap-level-props(
+    prefix = "#"
+) }}
+
+{{ use: partial-selected-mode(
+    version = '5.0.0'
+) }}
+
+## breadcrumb(Object)
+
+breadcrumb, showing the path of the current node.
+
+### show(boolean) = true
+
+<ExampleUIControlBoolean default="true" />
+
+Whether to show the breadcrumb.
+
+{{ use: partial-rect-layout(
+    componentName = "asdf ",
+    prefix = "##",
+    noZ = true,
+    defaultLeft = "'center'",
+    defaultBottom = 0
+) }}
+
+### height(number) = 22
+
+<ExampleUIControlNumber min="0" default="22" step="1" />
+
+The height of breadcrumb.
+
+### emptyItemWidth(number) = 25
+
+<ExampleUIControlNumber min="0" default="25" step="1" />
+
+When is no content in breadcrumb, this minimal width need to be set up.
+
+### itemStyle(Object)
+
+{{ use: partial-item-style-desc() }}
+
+{{ use: partial-item-style(
+    prefix = "###",
+    name = "boxplot",
+    defaultColor = "rgba(0,0,0,0.7)",
+    defaultBorderColor = "rgba(255,255,255,0.7)",
+    defaultBorderWidth = 1,
+    defaultShadowColor = 'rgba(150,150,150,1)',
+    defaultShadowBlur = 3,
+    defaultShadowOffsetX = 0,
+    defaultShadowOffsetY = 0
+) }}
+
+#### textStyle(Object)
+
+{{ use: partial-text-style(
+    prefix = "####",
+    defaultColor = "#fff"
+) }}
+
+### emphasis(*)
+
+#### itemStyle(Object)
+
+{{ use: partial-item-style(
+    prefix = "####",
+    name = "boxplot",
+    defaultColor = "rgba(0,0,0,0.7)",
+    defaultBorderColor = "rgba(255,255,255,0.7)",
+    defaultBorderWidth = 1,
+    defaultShadowColor = 'rgba(150,150,150,1)',
+    defaultShadowBlur = 3,
+    defaultShadowOffsetX = 0,
+    defaultShadowOffsetY = 0
+) }}
+
+##### textStyle(Object)
+
+{{ use: partial-text-style(
+    prefix = "#####",
+    defaultColor = "#fff"
+) }}
+
+## labelLayout(Object|Function)
+
+{{ use: partial-label-layout(
+    prefix = "##"
+) }}
+
 ## levels(Array)
 
 **Multiple Levels Configuration**
@@ -156,7 +240,6 @@ levels: [
 ]
 ```
 
-<br>
 **The Rules about Visual Mapping**
 
 When designing a treemap, we primarily focus on how to visually distinguish "different levels", "different categories in the same level", which requires appropriate settings of "rectangular color", "border thickness", "border color" and even "color saturation of rectangular" and so on on each level.
@@ -169,7 +252,6 @@ In this way, this effect can be configured: set a `color` list on the parent lev
 
 
 
-<br>
 **Dimensions and "Extra Visual Mapping"**
 
 See the example below: every `value` field is set as an Array, in which each item in the array represents a dimension respectively.
@@ -204,11 +286,8 @@ See the example below: every `value` field is set as an Array, in which each ite
 
 `treemap` will map the first dimension (the first item of the array) to "area". If we want to express more information, we could map another dimension (specified by [series-treemap.visualDimension](~series-treemap.viusalDimension)) to another visual types, such as `colorSaturation` and so on. See the [example](${galleryEditorPath}treemap-obama&edit=1&reset=1) and select the legend 'Growth'.
 
-<br>
-
 {{ use: partial-treemap-borderColor-setting() }}
 
-<br>
 **Explanation about borderWidth, gapWidth, borderColor**
 
 ![500xauto](~treemap-border-gap.png)
@@ -217,92 +296,6 @@ See the example below: every `value` field is set as an Array, in which each ite
     prefix = "##"
 ) }}
 
-{{ use: partial-treemap-level-props(
-    prefix = "#"
-) }}
-
-## breadcrumb(Object)
-
-breadcrumb, showing the path of the current node.
-
-### show(boolean) = true
-
-<ExampleUIControlBoolean default="true" />
-
-Whether to show the breadcrumb.
-
-{{ use: partial-rect-layout(
-    componentName = "asdf ",
-    prefix = "##",
-    noZ = true,
-    defaultLeft = "'center'",
-    defaultBottom = 0
-) }}
-
-### height(number) = 22
-
-<ExampleUIControlNumber min="0" default="22" step="1" />
-
-The height of breadcrumb.
-
-### emptyItemWidth(number) = 25
-
-<ExampleUIControlNumber min="0" default="25" step="1" />
-
-When is no content in breadcrumb, this minimal width need to be set up.
-
-### itemStyle(Object)
-
-{{ use: partial-item-style-desc() }}
-
-{{ use: partial-item-style(
-    prefix = "###",
-    name = "boxplot",
-    defaultColor = "rgba(0,0,0,0.7)",
-    defaultBorderColor = "rgba(255,255,255,0.7)",
-    defaultBorderWidth = 1,
-    defaultShadowColor = 'rgba(150,150,150,1)',
-    defaultShadowBlur = 3,
-    defaultShadowOffsetX = 0,
-    defaultShadowOffsetY = 0
-) }}
-
-#### textStyle(Object)
-
-{{ use: partial-text-style(
-    prefix = "####",
-    defaultColor = "#fff"
-) }}
-
-### emphasis(*)
-
-#### itemStyle(Object)
-
-{{ use: partial-item-style(
-    prefix = "####",
-    name = "boxplot",
-    defaultColor = "rgba(0,0,0,0.7)",
-    defaultBorderColor = "rgba(255,255,255,0.7)",
-    defaultBorderWidth = 1,
-    defaultShadowColor = 'rgba(150,150,150,1)',
-    defaultShadowBlur = 3,
-    defaultShadowOffsetX = 0,
-    defaultShadowOffsetY = 0
-) }}
-
-##### textStyle(Object)
-
-{{ use: partial-text-style(
-    prefix = "#####",
-    defaultColor = "#fff"
-) }}
-
-## labelLayout(Object|Function)
-
-{{ use: partial-label-layout(
-    prefix = "##"
-) }}
-
 ## data(Array)
 
 the the data format of [series-treemap.data](~series-treemap.data) is a forest. For example:
@@ -550,8 +543,6 @@ This can hide the details of nodes when the rectangular area is not large enough
     name = "label"
 ) }}
 
-<br>
-
 {{ use: partial-label(
     prefix = ${prefix} + "#",
     defaultPosition = "'inside'",
@@ -574,8 +565,6 @@ See:
     name = "label"
 ) }}
 
-<br>
-
 {{ use: partial-label(
     prefix = ${prefix} + "#",
     defaultPosition = "'inside'",
@@ -594,8 +583,6 @@ Height of label area.
     name = "itemStyle"
 ) }}
 
-<br>
-
 {{ use: partial-treemap-item-style(
     prefix = ${prefix} + "#",
     itemStyleType = 'normal'
@@ -603,34 +590,38 @@ Height of label area.
 
 #${prefix} emphasis(Object)
 
-##${prefix} label(Object)
+Emphasis state.
 
-{{ use: partial-label(
-    prefix = ${prefix} + "##",
-    defaultPosition = "'inside'",
-    formatter = true
+{{ if: ${prefix} === '#' }}
+{{ use: partial-focus-blur-scope(
+    isTree = true
 ) }}
+{{ /if }}
 
-##${prefix} upperLabel(Object)
+{{ use: treemap-state(
+    prefix = "#" + ${prefix}
+) }}
 
-{{ use: partial-label(
-    prefix = ${prefix} + "##",
-    defaultPosition = "'inside'",
-    formatter = true
+#${prefix} blur(Object)
+
+Blur state.
+
+{{ use: treemap-state(
+    prefix = "#" + ${prefix}
 ) }}
 
-##${prefix} itemStyle(Object)
+#${prefix} select(Object)
 
-{{ use: partial-treemap-item-style(
-    prefix = ${prefix} + "##",
-    itemStyleType = 'emphasis'
+Select state.
+
+{{ use: treemap-state(
+    prefix = "#" + ${prefix}
 ) }}
 
 
 
 {{ target: partial-treemap-prop-location-desc }}
 
-<br>
 > Tps: In treemap, `${name}` attribute could appear in more than one places:
 
 {{ if: ${name} !== 'color' }}> * It could appear in [sereis-treemap](~series-treemap), indicating the unified setting of the series.{{ /if }}
@@ -668,6 +659,12 @@ The tranparent rate of a node, the range is between 0 ~ 1.
 
 The color saturation of a node. The range is between 0 ~ 1.
 
+#${prefix} borderRadius(number|Array) = 0
+
+<ExampleUIControlVector min="0" dims="LT,RT, RB, LB" clean="true"  />
+
+Border radius.
+
 #${prefix} borderWidth(number) = 0
 
 <ExampleUIControlNumber step="0.5" min="0" />
@@ -700,8 +697,6 @@ When `borderColorSaturation` is set, the `borderColor` is disabled, and, instead
 
 In this way, a effect can be implemented: different sections have different hue of gap color repectively, which makes users easy to distinguish both sections and levels.
 
-<br>
-
 {{ use: partial-treemap-borderColor-setting() }}
 
 {{ use: partial-style-shadow-opacity(
@@ -719,3 +714,30 @@ If all of the border/gaps are set with the same color, confusion might occur whe
 
 See the [example](${galleryEditorPath}doc-example/treemap-borderColor&edit=1&reset=1). Notice that the child rectangles in the red area are in the deeper level than rectangles that are saparated by white gap. So in the red area, basically we set gap color with red, and use `borderColorSaturation` to lift the saturation.
 
+
+
+{{ target: treemap-state }}
+
+#${prefix} label(Object)
+
+{{ use: partial-label(
+    prefix = ${prefix} + "#",
+    defaultPosition = "'inside'",
+    formatter = true
+) }}
+
+#${prefix} upperLabel(Object)
+
+{{ use: partial-label(
+    prefix = ${prefix} + "#",
+    defaultPosition = "'inside'",
+    formatter = true
+) }}
+
+#${prefix} itemStyle(Object)
+
+{{ use: partial-treemap-item-style(
+    prefix = ${prefix} + "#",
+    itemStyleType = 'emphasis'
+) }}
+
diff --git a/package.json b/package.json
index e4ba11f..48537c3 100644
--- a/package.json
+++ b/package.json
@@ -16,7 +16,6 @@
     "format": "node tool/format.js",
     "dev": "npx concurrently --kill-others \"npm run watch\" \"npm run watch:site\" \"npm run server\""
   },
-  "author": "shenyi",
   "license": "Apache License 2.0",
   "devDependencies": {
     "@babel/core": "^7.10.2",
@@ -64,7 +63,6 @@
     "vue-custom-scrollbar": "^1.2.0",
     "vue-i18n": "^8.18.2",
     "vue-text-highlight": "^2.0.10",
-    "whatwg-fetch": "^3.0.0",
-    "zrender": "^4.3.2"
+    "whatwg-fetch": "^3.0.0"
   }
 }
diff --git a/tool/patchLanguage.js b/tool/patchLanguage.js
index 5292fa6..0ac90eb 100644
--- a/tool/patchLanguage.js
+++ b/tool/patchLanguage.js
@@ -65,7 +65,7 @@ function applyArgsPatch(fromArgs, toArgs) {
             // A simple strategy to determine if the string is a term can be different in each language.
             // Or if it's a code.
             if (!isSimpleChar(fromArg[1]) || !isSimpleChar(toArg[1] + '')) {
-                // Keep the same if it's translated term.
+                // Keep the same if it's a translated term. For example componentName arg should always keep not changed.
                 return toArg.slice();
             }
             else {
diff --git a/zh/option/component/geo.md b/zh/option/component/geo.md
index a3b7d40..211dd61 100644
--- a/zh/option/component/geo.md
+++ b/zh/option/component/geo.md
@@ -90,7 +90,7 @@ geo 区域的颜色也可以被 map series 所控制,参见 [series-map.geoInd
 
 ### select(Object)
 
-高亮状态的设置。
+选中状态的设置。
 
 {{ use: geo-region-state() }}
 
diff --git a/zh/option/partial/label-layout.md b/zh/option/partial/label-layout.md
index fc32f4a..546d269 100644
--- a/zh/option/partial/label-layout.md
+++ b/zh/option/partial/label-layout.md
@@ -110,15 +110,15 @@ labelLayout(params) {
 
 #${prefix} align(string)
 
-标签水平对齐。可以设置`'left'`, `'center'`, `'right'`。
+标签水平对齐方式。可以设置`'left'`, `'center'`, `'right'`。
 
 #${prefix} verticalAlign(string)
 
-标签垂直对齐。可以设置`'top'`, `'middle'`, `'bottom'`。
+标签垂直对齐方式。可以设置`'top'`, `'middle'`, `'bottom'`。
 
 #${prefix} fontSize(number)
 
-标签的文本大小,可以根据
+The text size of the label.
 
 #${prefix} draggable(boolean)
 
diff --git a/zh/option/series/effectScatter.md b/zh/option/series/effectScatter.md
index 39939b5..a0cf6e2 100644
--- a/zh/option/series/effectScatter.md
+++ b/zh/option/series/effectScatter.md
@@ -129,16 +129,6 @@ const option = {
 
 ## emphasis(Object)
 
-高亮的标签和图形样式。
-
-{{ use: partial-focus-blur-scope() }}
-
-{{ use: effectScatter-state(
-    prefix = "##"
-) }}
-
-## emphasis(Object)
-
 高亮的图形和标签样式。
 
 ### scale(boolean) = true
@@ -147,6 +137,8 @@ const option = {
 
 是否开启高亮后的放大效果。
 
+{{ use: partial-focus-blur-scope() }}
+
 {{ use: effectScatter-state(
     prefix = "##"
 ) }}
diff --git a/zh/option/series/funnel.md b/zh/option/series/funnel.md
index 3556f75..d259acb 100644
--- a/zh/option/series/funnel.md
+++ b/zh/option/series/funnel.md
@@ -135,6 +135,10 @@ option = {
 
 {{ use: partial-focus-blur-scope() }}
 
+{{ use: partial-funnel-state(
+    prefix = "##"
+) }}
+
 ## blur(Object)
 
 淡出时的图形样式和标签样式。开启 [emphasis.focus](~series-funnel.emphasis.focus) 后有效


---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org