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 a0d9a52 add en for group id and universal transition description
a0d9a52 is described below
commit a0d9a52471ccd951d10a1e14b2bbdb58aa3c3c1c
Author: pissang <[email protected]>
AuthorDate: Tue Jul 6 19:27:11 2021 +0800
add en for group id and universal transition description
---
en/option/partial/group-id.md | 4 +++
en/option/partial/universal-transition.md | 49 +++++++++++++++++++++++++++++++
2 files changed, 53 insertions(+)
diff --git a/en/option/partial/group-id.md b/en/option/partial/group-id.md
index 79d6363..3d482e3 100644
--- a/en/option/partial/group-id.md
+++ b/en/option/partial/group-id.md
@@ -2,9 +2,13 @@
## dataGroupId(string)
+A groupID common to all data in the series. the groupID will be used to
classify the data and determine how merge and split animations are performed in
the universal transition animation.
+If you are using the [dataset](~dataset) component to represent the data, it
is recommended to use `encode.itemGroupID` to specify which dimension is
encoded as the groupID.
{{ target: partial-data-group-id }}
#${prefix} groupId(string)
+
+The groupID of this data item. groupID will be used to classify the data.
\ No newline at end of file
diff --git a/en/option/partial/universal-transition.md
b/en/option/partial/universal-transition.md
index 0cb1f46..d6ed1d2 100644
--- a/en/option/partial/universal-transition.md
+++ b/en/option/partial/universal-transition.md
@@ -1,2 +1,51 @@
{{ target: partial-universal-transition }}
+#${prefix} universalTransition(object)
+
+Configuration related to universal transition animation.
+
+Universal Transition provides the ability to morph between any series. With
this feature enabled, each time `setOption`, transitions between series with
the same `id` will be automatically associated with each other.
+
+One-to-many or many-to-one animations such as drill-down, aggregation, etc.
can also be achieved by specifying groups of data such as `encode.itemGroupId`
or `dataGroupId`.
+
+This can be enabled directly by configuring `universalTransition: true` in the
series. It is also possible to provide an object for more detailed
configuration.
+
+##${prefix} enabled(boolean) = false
+
+Wheather to enable the universal transition animation.
+
+
+##${prefix} seriesKey(string | Array)
+
+The `seriesKey` determines how the series to be animated is associated, it
defaults to the `id` of the series when not configured.
+
+Usually this is configured as a string, and transitions between series with
the same `seriesKey` will be applied. It can also be configured as an array
like the following.
+
+```js
+seriesKey: ['male', 'female']
+```
+
+Configuring to an array means that all series specified by the array item will
be merged into the current series when animating. For example, this
configuration means that series with `id` or `seriesKey` of `'male'` and
`'female'` will be merged into the current series.
+
+##${prefix} divideShape(string)
+
+`divideShape` determines how the elements in the current series will split
into multiple elements in a one-to-many or many-to-one animation. Currently
supports
+
++ `'split'` Split the shape into multiple shapes.
++ `'clone'` Get multiple clones from the current element.
+
+For better results, different series will have different configurations by
default, for example, [scatter](~series-scatter) with smaller and more complex
element uses `'clone'` by default, while more regular ones like bar charts
default to `'split'`. You can set this to the desired splitting strategy
according to the needs of your own scenario.
+
+##${prefix} delay(Function)
+
+```ts
+(index: number, count: number) => number
+```
+
+Configure the animation delay for each shape in a one-to-many or many-to-one
animation. Setting different animation delays can bring a more instereting
animation. For example, the following code creates a staggered effect with a
random delay for each shape.
+
+```js
+delay: function (index, count) {
+ return Math.random() * 1000;
+}
+```
\ No newline at end of file
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]
