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 2021/02/05 02:41:04 UTC
[echarts-doc] branch master updated: fix wrong place of focus
blurScope in custom series
This is an automated email from the ASF dual-hosted git repository.
shenyi pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/echarts-doc.git
The following commit(s) were added to refs/heads/master by this push:
new 35498b5 fix wrong place of focus blurScope in custom series
35498b5 is described below
commit 35498b59a180eca424d2c905d49aee05832efc04
Author: pissang <bm...@gmail.com>
AuthorDate: Fri Feb 5 10:40:40 2021 +0800
fix wrong place of focus blurScope in custom series
---
en/option/partial/zr-graphic.md | 143 ++++++++++++++++++----------------------
zh/option/partial/zr-graphic.md | 70 +++++++++++++++++---
2 files changed, 123 insertions(+), 90 deletions(-)
diff --git a/en/option/partial/zr-graphic.md b/en/option/partial/zr-graphic.md
index faaf6c6..1c8da22 100644
--- a/en/option/partial/zr-graphic.md
+++ b/en/option/partial/zr-graphic.md
@@ -1,9 +1,6 @@
{{ target: partial-zr-graphic-elements }}
-
-
-
#${prefix} ${hostName}${symbolDeclare}group(Object)
`group` is the only type that can contain children, so that a group of elements can be positioned and transformed together.
@@ -63,11 +60,6 @@ A list of children, each item is a declaration of an element.
symbolDeclare = ${symbolDeclare}
) }}
-
-
-
-
-
{{ if: ${usageType} === 'customSeries' }}
#${prefix} ${hostName}${symbolDeclare}path(Object)
@@ -147,7 +139,6 @@ Optional value:
symbolDeclare = ${symbolDeclare}
) }}
-
##${prefix} style(Object)
{{ use: partial-graphic-cpt-style-prop-common(
@@ -159,6 +150,10 @@ Optional value:
symbolDeclare = ${symbolDeclare}
) }}
+{{ use: partial-graphic-cpt-focus-blur(
+ prefix = ${prefix}
+) }}
+
{{ use: partial-graphic-cpt-style-emphasis(
prefix = ${prefix},
optionPath = ${optionPath},
@@ -176,13 +171,8 @@ Optional value:
symbolVisit = ${symbolVisit},
symbolDeclare = ${symbolDeclare}
) }}
-
{{ /if }}
-
-
-
-
#${prefix} ${hostName}${symbolDeclare}image(Object)
{{ use: partial-graphic-cpt-common-props(
@@ -228,6 +218,10 @@ Specify content of the image, can be a URL, or [dataURI](https://tools.ietf.org/
symbolDeclare = ${symbolDeclare}
) }}
+{{ use: partial-graphic-cpt-focus-blur(
+ prefix = ${prefix}
+) }}
+
{{ use: partial-graphic-cpt-style-emphasis(
prefix = ${prefix},
optionPath = ${optionPath},
@@ -246,10 +240,6 @@ Specify content of the image, can be a URL, or [dataURI](https://tools.ietf.org/
symbolDeclare = ${symbolDeclare}
) }}
-
-
-
-
#${prefix} ${hostName}${symbolDeclare}text(Object)
Text block.
@@ -314,6 +304,10 @@ Text vertical alignment. Optional values: `'top'`, `'middle'`, `'bottom'`.
symbolDeclare = ${symbolDeclare}
) }}
+{{ use: partial-graphic-cpt-focus-blur(
+ prefix = ${prefix}
+) }}
+
{{ use: partial-graphic-cpt-style-emphasis(
prefix = ${prefix},
optionPath = ${optionPath},
@@ -332,10 +326,6 @@ Text vertical alignment. Optional values: `'top'`, `'middle'`, `'bottom'`.
symbolDeclare = ${symbolDeclare}
) }}
-
-
-
-
#${prefix} ${hostName}${symbolDeclare}rect(Object)
Rectangle element.
@@ -391,7 +381,6 @@ Abbreviation is enabled, for example:
symbolDeclare = ${symbolDeclare}
) }}
-
##${prefix} style(Object)
{{ use: partial-graphic-cpt-style-prop-common(
@@ -403,6 +392,10 @@ Abbreviation is enabled, for example:
symbolDeclare = ${symbolDeclare}
) }}
+{{ use: partial-graphic-cpt-focus-blur(
+ prefix = ${prefix}
+) }}
+
{{ use: partial-graphic-cpt-style-emphasis(
prefix = ${prefix},
optionPath = ${optionPath},
@@ -421,10 +414,6 @@ Abbreviation is enabled, for example:
symbolDeclare = ${symbolDeclare}
) }}
-
-
-
-
#${prefix} ${hostName}${symbolDeclare}circle(Object)
Circle element.
@@ -481,6 +470,10 @@ Circle element.
symbolDeclare = ${symbolDeclare}
) }}
+{{ use: partial-graphic-cpt-focus-blur(
+ prefix = ${prefix}
+) }}
+
{{ use: partial-graphic-cpt-style-emphasis(
prefix = ${prefix},
optionPath = ${optionPath},
@@ -499,10 +492,6 @@ Circle element.
symbolDeclare = ${symbolDeclare}
) }}
-
-
-
-
#${prefix} ${hostName}${symbolDeclare}ring(Object)
Ring element.
@@ -559,6 +548,10 @@ Ring element.
symbolDeclare = ${symbolDeclare}
) }}
+{{ use: partial-graphic-cpt-focus-blur(
+ prefix = ${prefix}
+) }}
+
{{ use: partial-graphic-cpt-style-emphasis(
prefix = ${prefix},
optionPath = ${optionPath},
@@ -577,10 +570,6 @@ Ring element.
symbolDeclare = ${symbolDeclare}
) }}
-
-
-
-
#${prefix} ${hostName}${symbolDeclare}sector(Object)
Sector element.
@@ -646,6 +635,10 @@ Sector element.
symbolDeclare = ${symbolDeclare}
) }}
+{{ use: partial-graphic-cpt-focus-blur(
+ prefix = ${prefix}
+) }}
+
{{ use: partial-graphic-cpt-style-emphasis(
prefix = ${prefix},
optionPath = ${optionPath},
@@ -664,10 +657,6 @@ Sector element.
symbolDeclare = ${symbolDeclare}
) }}
-
-
-
-
#${prefix} ${hostName}${symbolDeclare}arc(Object)
Arc element.
@@ -736,6 +725,10 @@ Arc element.
symbolDeclare = ${symbolDeclare}
) }}
+{{ use: partial-graphic-cpt-focus-blur(
+ prefix = ${prefix}
+) }}
+
{{ use: partial-graphic-cpt-style-emphasis(
prefix = ${prefix},
optionPath = ${optionPath},
@@ -754,10 +747,6 @@ Arc element.
symbolDeclare = ${symbolDeclare}
) }}
-
-
-
-
#${prefix} ${hostName}${symbolDeclare}polygon(Object)
Polygon element.
@@ -805,6 +794,10 @@ Polygon element.
symbolDeclare = ${symbolDeclare}
) }}
+{{ use: partial-graphic-cpt-focus-blur(
+ prefix = ${prefix}
+) }}
+
{{ use: partial-graphic-cpt-style-emphasis(
prefix = ${prefix},
optionPath = ${optionPath},
@@ -823,10 +816,6 @@ Polygon element.
symbolDeclare = ${symbolDeclare}
) }}
-
-
-
-
#${prefix} ${hostName}${symbolDeclare}polyline(Object)
Polyline element.
@@ -877,6 +866,10 @@ Polyline element.
symbolDeclare = ${symbolDeclare}
) }}
+{{ use: partial-graphic-cpt-focus-blur(
+ prefix = ${prefix}
+) }}
+
{{ use: partial-graphic-cpt-style-emphasis(
prefix = ${prefix},
optionPath = ${optionPath},
@@ -895,10 +888,6 @@ Polyline element.
symbolDeclare = ${symbolDeclare}
) }}
-
-
-
-
#${prefix} ${hostName}${symbolDeclare}line(Object)
Line element.
@@ -955,6 +944,10 @@ Value range: [0, 1].
symbolDeclare = ${symbolDeclare}
) }}
+{{ use: partial-graphic-cpt-focus-blur(
+ prefix = ${prefix}
+) }}
+
{{ use: partial-graphic-cpt-style-emphasis(
prefix = ${prefix},
optionPath = ${optionPath},
@@ -973,10 +966,6 @@ Value range: [0, 1].
symbolDeclare = ${symbolDeclare}
) }}
-
-
-
-
#${prefix} ${hostName}${symbolDeclare}bezierCurve(Object)
Quadratic bezier curve or cubic bezier curve.
@@ -1050,6 +1039,10 @@ Value range: [0, 1].
symbolDeclare = ${symbolDeclare}
) }}
+{{ use: partial-graphic-cpt-focus-blur(
+ prefix = ${prefix}
+) }}
+
{{ use: partial-graphic-cpt-style-emphasis(
prefix = ${prefix},
optionPath = ${optionPath},
@@ -1070,11 +1063,6 @@ Value range: [0, 1].
-
-
-
-
-
{{ target: partial-graphic-cpt-common-props }}
##${prefix} type(string) = ${type}
@@ -1119,9 +1107,7 @@ Optional values:
symbolDeclare = ${symbolDeclare}
) }}
-
{{ if: ${usageType} === 'customSeries' }}
-
##${prefix} transition(string|Array) = ['x', 'y']
Can be a single property name or an array of property names.
@@ -1187,11 +1173,8 @@ transition: [] // Am empty array.
```
See this [example](${galleryEditorPath}doc-example/custom-transition-simple&edit=1&reset=1) please.
-
{{ /if }}
-
-
{{ if: ${usageType} === 'customSeries' && ${enableMorph} }}
##${prefix} morph(boolean) = false
@@ -1214,11 +1197,8 @@ Then custom series find graphic elements that has `morph: true` declared in thes
See examples: [custom-one-to-one-morph](${galleryEditorPath}custom-one-to-one-morph&edit=1&reset=1) and
[custom-combine-separate-morph](${galleryEditorPath}custom-combine-separate-morph&edit=1&reset=1).
-
{{ /if }}
-
-
{{ if: ${usageType} === 'graphicComponent' }}
##${prefix} left(number|string) = undefined
@@ -1333,6 +1313,7 @@ Whether the element is totally ignored (neither render nor listen events).
##${prefix} textContent(Object)
Text block attached to an element and layout based on the element by `textConfig`.
+
{{ if: ${usageType} === 'customSeries' }}
The props the the same as [text](option.html#series-custom.renderItem.return_text).
{{ else }}
@@ -1456,11 +1437,11 @@ The rule of getting "auto-calculated-stroke":
Tell echarts that I can make sure this text is inside or not.
-
{{ if: ${usageType} === 'customSeries' }}
{{ use: partial-custom-series-during(
prefix = ${prefix}
) }}
+
{{ use: partial-custom-series-extra(
prefix = ${prefix},
optionPath = ${optionPath},
@@ -1539,7 +1520,6 @@ color of shadow.
-
{{ target: partial-graphic-cpt-path-common }}
###${prefix} points(Array)
@@ -1589,7 +1569,6 @@ If [top](~${optionPath}.${hostName}${symbolVisit}${type}.top) or [bottom](~${opt
{{ target: partial-graphic-cpt-sub-prop-transition }}
{{ if: ${usageType} === 'customSeries' }}
-
###${prefix} transition(string|Array) = undefined
Can be a single property name or an array of property names.
@@ -1629,7 +1608,6 @@ renderItem: function (params, api) {
};
}
```
-
{{ /if }}
@@ -1861,14 +1839,9 @@ Notice:
-{{ target: partial-graphic-cpt-style-emphasis }}
+{{ target: partial-graphic-cpt-focus-blur }}
-{{ if: ${usageType} === 'customSeries' }}
-##${prefix} emphasis(Object)
-
-Emphasis state of the element.
-
-###${prefix} focus(string) = 'none'
+##${prefix} focus(string) = 'none'
{{ use: partial-version(
version = "5.0.0"
@@ -1880,7 +1853,7 @@ When it's highlighted, whether to fade out of other data to focus the highlighte
+ `'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'
+##${prefix} blurScope(string) = 'coordinateSystem'
{{ use: partial-version(
version = "5.0.0"
@@ -1892,6 +1865,15 @@ The range of fade out when `focus` is enabled. Support the following configurati
+ `'series'`
+ `'global'`
+
+
+{{ target: partial-graphic-cpt-style-emphasis }}
+
+{{ if: ${usageType} === 'customSeries' }}
+##${prefix} emphasis(Object)
+
+Emphasis state of the element.
+
###${prefix} style(Object)
Same to [style](~${optionPath}.${hostName}${symbolVisit}polygon.style).
@@ -2040,3 +2022,4 @@ Although the points will be interpolated, the consequent animation will be like
```
See this example [example](${galleryEditorPath}custom-spiral-race&edit=1&reset=1).
+
diff --git a/zh/option/partial/zr-graphic.md b/zh/option/partial/zr-graphic.md
index 7beecf1..9b871db 100644
--- a/zh/option/partial/zr-graphic.md
+++ b/zh/option/partial/zr-graphic.md
@@ -157,6 +157,10 @@ group 是唯一的可以有子节点的容器。group 可以用来整体定位
symbolDeclare = ${symbolDeclare}
) }}
+{{ use: partial-graphic-cpt-focus-blur(
+ prefix = ${prefix}
+) }}
+
{{ use: partial-graphic-cpt-style-emphasis(
prefix = ${prefix},
optionPath = ${optionPath},
@@ -226,6 +230,11 @@ group 是唯一的可以有子节点的容器。group 可以用来整体定位
symbolDeclare = ${symbolDeclare}
) }}
+
+{{ use: partial-graphic-cpt-focus-blur(
+ prefix = ${prefix}
+) }}
+
{{ use: partial-graphic-cpt-style-emphasis(
prefix = ${prefix},
optionPath = ${optionPath},
@@ -312,6 +321,10 @@ font: 'bolder 2em "Microsoft YaHei", sans-serif'
symbolDeclare = ${symbolDeclare}
) }}
+{{ use: partial-graphic-cpt-focus-blur(
+ prefix = ${prefix}
+) }}
+
{{ use: partial-graphic-cpt-style-emphasis(
prefix = ${prefix},
optionPath = ${optionPath},
@@ -402,6 +415,10 @@ font: 'bolder 2em "Microsoft YaHei", sans-serif'
symbolDeclare = ${symbolDeclare}
) }}
+{{ use: partial-graphic-cpt-focus-blur(
+ prefix = ${prefix}
+) }}
+
{{ use: partial-graphic-cpt-style-emphasis(
prefix = ${prefix},
optionPath = ${optionPath},
@@ -480,6 +497,10 @@ font: 'bolder 2em "Microsoft YaHei", sans-serif'
symbolDeclare = ${symbolDeclare}
) }}
+{{ use: partial-graphic-cpt-focus-blur(
+ prefix = ${prefix}
+) }}
+
{{ use: partial-graphic-cpt-style-emphasis(
prefix = ${prefix},
optionPath = ${optionPath},
@@ -558,6 +579,10 @@ font: 'bolder 2em "Microsoft YaHei", sans-serif'
symbolDeclare = ${symbolDeclare}
) }}
+{{ use: partial-graphic-cpt-focus-blur(
+ prefix = ${prefix}
+) }}
+
{{ use: partial-graphic-cpt-style-emphasis(
prefix = ${prefix},
optionPath = ${optionPath},
@@ -645,6 +670,10 @@ font: 'bolder 2em "Microsoft YaHei", sans-serif'
symbolDeclare = ${symbolDeclare}
) }}
+{{ use: partial-graphic-cpt-focus-blur(
+ prefix = ${prefix}
+) }}
+
{{ use: partial-graphic-cpt-style-emphasis(
prefix = ${prefix},
optionPath = ${optionPath},
@@ -735,6 +764,10 @@ font: 'bolder 2em "Microsoft YaHei", sans-serif'
symbolDeclare = ${symbolDeclare}
) }}
+{{ use: partial-graphic-cpt-focus-blur(
+ prefix = ${prefix}
+) }}
+
{{ use: partial-graphic-cpt-style-emphasis(
prefix = ${prefix},
optionPath = ${optionPath},
@@ -804,6 +837,10 @@ font: 'bolder 2em "Microsoft YaHei", sans-serif'
symbolDeclare = ${symbolDeclare}
) }}
+{{ use: partial-graphic-cpt-focus-blur(
+ prefix = ${prefix}
+) }}
+
{{ use: partial-graphic-cpt-style-emphasis(
prefix = ${prefix},
optionPath = ${optionPath},
@@ -876,6 +913,10 @@ font: 'bolder 2em "Microsoft YaHei", sans-serif'
symbolDeclare = ${symbolDeclare}
) }}
+{{ use: partial-graphic-cpt-focus-blur(
+ prefix = ${prefix}
+) }}
+
{{ use: partial-graphic-cpt-style-emphasis(
prefix = ${prefix},
optionPath = ${optionPath},
@@ -952,6 +993,10 @@ font: 'bolder 2em "Microsoft YaHei", sans-serif'
symbolDeclare = ${symbolDeclare}
) }}
+{{ use: partial-graphic-cpt-focus-blur(
+ prefix = ${prefix}
+) }}
+
{{ use: partial-graphic-cpt-style-emphasis(
prefix = ${prefix},
optionPath = ${optionPath},
@@ -1041,6 +1086,10 @@ font: 'bolder 2em "Microsoft YaHei", sans-serif'
symbolDeclare = ${symbolDeclare}
) }}
+{{ use: partial-graphic-cpt-focus-blur(
+ prefix = ${prefix}
+) }}
+
{{ use: partial-graphic-cpt-style-emphasis(
prefix = ${prefix},
optionPath = ${optionPath},
@@ -1840,16 +1889,9 @@ renderItem: function (params, api) {
+ transform 中设定的坐标，都是相对于图形元素的父元素的（即 [group](~${optionPath}.${hostName}${symbolVisit}group) 元素或者顶层画布）的 `[0, 0]` 点。也就是说，我们可以使用 [group](~${optionPath}.${hostName}${symbolVisit}group) 来组织多个图形元素，并且 [group](~${optionPath}.${hostName}${symbolVisit}group) 可以嵌套。
+ 对于一个图形元素，`transform` 执行的顺序是：先缩放（依照 `scaleX`，`scaleY`），再旋转（依照 `rotation`），再平移（依照 `x`，`y`）。
+{{ target: partial-graphic-cpt-focus-blur }}
-
-{{ target: partial-graphic-cpt-style-emphasis }}
-
-{{ if: ${usageType} === 'customSeries' }}
-##${prefix} emphasis(Object)
-
-图形元素的高亮状态
-
-###${prefix} focus(string) = 'none'
+##${prefix} focus(string) = 'none'
{{ use: partial-version(
version = "5.0.0"
@@ -1861,7 +1903,7 @@ renderItem: function (params, api) {
+ `'self'` 只聚焦（不淡出）当前高亮的数据的图形。
+ `'series'` 聚焦当前高亮的数据所在的系列的所有图形。
-###${prefix} blurScope(string) = 'coordinateSystem'
+##${prefix} blurScope(string) = 'coordinateSystem'
{{ use: partial-version(
version = "5.0.0"
@@ -1873,6 +1915,14 @@ renderItem: function (params, api) {
+ `'series'` 淡出范围为系列。
+ `'global'` 淡出范围为全局。
+
+{{ target: partial-graphic-cpt-style-emphasis }}
+
+{{ if: ${usageType} === 'customSeries' }}
+##${prefix} emphasis(Object)
+
+图形元素的高亮状态
+
###${prefix} style(Object)
结构同 [style](~${optionPath}.${hostName}${symbolVisit}polygon.style)。
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org