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/11/22 03:35:23 UTC
[echarts-doc] branch master updated: optimize docs
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 862b06d optimize docs
862b06d is described below
commit 862b06dc3c317e8f3c0b8882fffa833c7aeba749
Author: pissang <bm...@gmail.com>
AuthorDate: Mon Nov 22 11:35:17 2021 +0800
optimize docs
---
en/option/component/graphic.md | 56 ++++++------------------------------
en/option/partial/zr-graphic.md | 63 +++++------------------------------------
zh/option/component/graphic.md | 45 ++++++-----------------------
zh/option/partial/zr-graphic.md | 63 +++++------------------------------------
4 files changed, 30 insertions(+), 197 deletions(-)
diff --git a/en/option/component/graphic.md b/en/option/component/graphic.md
index e68dcd9..33d5498 100644
--- a/en/option/component/graphic.md
+++ b/en/option/component/graphic.md
@@ -21,12 +21,6 @@ This example shows how to make a watermark and text block:
This example use hidden graphic elements to implement dragging:
~[600x400](${galleryViewPath}line-draggable&edit=1&reset=1)
-
-
-<br>
-
----
-
**Graphic Component Configuration**
A simple way to define a graphic element:
@@ -102,12 +96,6 @@ Notice, when using `setOption` to modify existing elements, if id is not specifi
-<br>
-
----
-
-
-
**Graphic Element Configuration**
Different types of graphic elements has their own configuration respectively, but they have these common configuration below:
@@ -164,12 +152,6 @@ Different types of graphic elements has their own configuration respectively, bu
-
-
-<br>
-
----
-
**Event Handlers of Graphic Element**
These events are supported:
@@ -177,12 +159,6 @@ These events are supported:
-
-
-<br>
-
----
-
**Hierarchy of Graphic Elements**
Only `group` element has children, which enable a group of elements to be positioned and transformed together.
@@ -190,12 +166,6 @@ Only `group` element has children, which enable a group of elements to be positi
-
-
-<br>
-
----
-
**Shape Configuration of Graphic Element**
Elements with different types have different shape setting repectively. For example:
@@ -240,12 +210,6 @@ Elements with different types have different shape setting repectively. For exam
```
-
-
-<br>
-
----
-
**Transforming and Absolutely Positioning of Graphic Element**
Element can be transformed (translation, rotation, scale). See [position](~graphic.elements.position), [rotation](~graphic.elements.rotation), [scale](~graphic.elements.scale), [origin](~graphic.elements.origin)
@@ -274,23 +238,19 @@ For example:
}
```
-+ Each element is transformed in the coordinate system of its parent, namely, transform of a element and its parent can be "stacked".
-
-+ Transformation is performed by this order:
- 1. Translate [-el.origin[0], -el.origin[1]].
- 2. Scale according to el.scale.
- 3. Rotate according to el.rotation.
- 4. Translate back according to el.origin.
- 5. Translate according to el.position.
-+ Namely, scaling and rotating firstly, and then translate. By this mechanism, translation does not affect origin of scale and rotation.
-
+Each element is transformed in the coordinate system of its parent, namely, transform of a element and its parent can be "stacked".
+Transformation is performed by this order:
+1. Translate [-el.origin[0], -el.origin[1]].
+2. Scale according to el.scale.
+3. Rotate according to el.rotation.
+4. Translate back according to el.origin.
+5. Translate according to el.position.
+Namely, scaling and rotating firstly, and then translate. By this mechanism, translation does not affect origin of scale and rotation.
-<br>
----
**Relatively Positioning**
diff --git a/en/option/partial/zr-graphic.md b/en/option/partial/zr-graphic.md
index 14f28b7..4f14c15 100644
--- a/en/option/partial/zr-graphic.md
+++ b/en/option/partial/zr-graphic.md
@@ -1747,81 +1747,32 @@ Whether draw clockwise.
##${prefix} x(number) = 0
-{{ use: partial-graphic-transform-common-desc(
- type = ${type},
- optionPath = ${optionPath},
- usageType = ${usageType},
- hostName = ${hostName},
- symbolVisit = ${symbolVisit},
- symbolDeclare = ${symbolDeclare}
-) }}
+x position of element. In pixels.
##${prefix} y(number) = 0
-{{ use: partial-graphic-transform-common-desc(
- type = ${type},
- optionPath = ${optionPath},
- usageType = ${usageType},
- hostName = ${hostName},
- symbolVisit = ${symbolVisit},
- symbolDeclare = ${symbolDeclare}
-) }}
+y position of element. In pixels.
##${prefix} rotation(number) = 0
-{{ use: partial-graphic-transform-common-desc(
- type = ${type},
- optionPath = ${optionPath},
- usageType = ${usageType},
- hostName = ${hostName},
- symbolVisit = ${symbolVisit},
- symbolDeclare = ${symbolDeclare}
-) }}
+Degree value of rotation.
##${prefix} scaleX(number) = 1
-{{ use: partial-graphic-transform-common-desc(
- type = ${type},
- optionPath = ${optionPath},
- usageType = ${usageType},
- hostName = ${hostName},
- symbolVisit = ${symbolVisit},
- symbolDeclare = ${symbolDeclare}
-) }}
+Scale on x.
##${prefix} scaleY(number) = 1
-{{ use: partial-graphic-transform-common-desc(
- type = ${type},
- optionPath = ${optionPath},
- usageType = ${usageType},
- hostName = ${hostName},
- symbolVisit = ${symbolVisit},
- symbolDeclare = ${symbolDeclare}
-) }}
+Scale on y.
##${prefix} originX(number) = 0
-{{ use: partial-graphic-transform-common-desc(
- type = ${type},
- optionPath = ${optionPath},
- usageType = ${usageType},
- hostName = ${hostName},
- symbolVisit = ${symbolVisit},
- symbolDeclare = ${symbolDeclare}
-) }}
+x value of element scale and rotation origin. In pixels
##${prefix} originY(number) = 0
-{{ use: partial-graphic-transform-common-desc(
- type = ${type},
- optionPath = ${optionPath},
- usageType = ${usageType},
- hostName = ${hostName},
- symbolVisit = ${symbolVisit},
- symbolDeclare = ${symbolDeclare}
-) }}
+y value of element scale and rotation origin. In pixels.
{{ target: partial-graphic-transform-common-desc }}
diff --git a/zh/option/component/graphic.md b/zh/option/component/graphic.md
index bc87e62..e6370e7 100644
--- a/zh/option/component/graphic.md
+++ b/zh/option/component/graphic.md
@@ -20,11 +20,6 @@
~[600x400](${galleryViewPath}line-draggable&edit=1&reset=1)
-
-<br>
-
----
-
**graphic 设置介绍**
只配一个图形元素时的简写方法：
@@ -98,12 +93,6 @@ myChart.setOption({
-<br>
-
----
-
-
-
**图形元素设置介绍**
介绍每个图形元素的配置。不同类型的图形元素的设置有这些共性：
@@ -152,10 +141,6 @@ myChart.setOption({
```
-<br>
-
----
-
**图形元素的事件**
支持这些事件配置：
@@ -163,10 +148,6 @@ myChart.setOption({
-<br>
-
----
-
**图形元素的层级关系**
只有 `group` 元素可以有子节点，从而以该 `group` 元素为根的元素树可以共同定位（共同移动）。
@@ -175,10 +156,6 @@ myChart.setOption({
-<br>
-
----
-
**图形元素的基本形状设置**
每个图形元素本身有自己的图形基本的位置和尺寸设置，例如：
@@ -225,10 +202,6 @@ myChart.setOption({
-<br>
-
----
-
**图形元素的定位和 transfrom**
@@ -248,22 +221,20 @@ myChart.setOption({
}
```
-+ 每个图形元素在父节点的坐标系中进行 transform，也就是说父子节点的 transform 能『叠加』。
-+ 每个图形元素进行 transform 顺序是：
- 1. 平移 [-el.origin[0], -el.origin[1]]。
- 2. 根据 el.scale 缩放。
- 3. 根据 el.rotation 旋转。
- 4. 根据 el.origin 平移。
- 5. 根据 el.position 平移。
-+ 也就是说先缩放旋转后平移，这样平移不会影响缩放旋转的 origin。
+每个图形元素在父节点的坐标系中进行 transform，也就是说父子节点的 transform 能『叠加』。
+每个图形元素进行 transform 顺序是：
+1. 平移 [-el.origin[0], -el.origin[1]]。
+2. 根据 el.scale 缩放。
+3. 根据 el.rotation 旋转。
+4. 根据 el.origin 平移。
+5. 根据 el.position 平移。
+也就是说先缩放旋转后平移，这样平移不会影响缩放旋转的 origin。
-<br>
----
**图形元素相对定位**
diff --git a/zh/option/partial/zr-graphic.md b/zh/option/partial/zr-graphic.md
index c5ef1db..c95f19d 100644
--- a/zh/option/partial/zr-graphic.md
+++ b/zh/option/partial/zr-graphic.md
@@ -1729,80 +1729,31 @@ renderItem: function (params, api) {
##${prefix} x(number) = 0
-{{ use: partial-graphic-transform-common-desc(
- type = ${type},
- optionPath = ${optionPath},
- usageType = ${usageType},
- hostName = ${hostName},
- symbolVisit = ${symbolVisit},
- symbolDeclare = ${symbolDeclare}
-) }}
+元素的 x 像素位置。
##${prefix} y(number) = 0
-{{ use: partial-graphic-transform-common-desc(
- type = ${type},
- optionPath = ${optionPath},
- usageType = ${usageType},
- hostName = ${hostName},
- symbolVisit = ${symbolVisit},
- symbolDeclare = ${symbolDeclare}
-) }}
+元素的 y 像素位置。
##${prefix} rotation(number) = 0
-{{ use: partial-graphic-transform-common-desc(
- type = ${type},
- optionPath = ${optionPath},
- usageType = ${usageType},
- hostName = ${hostName},
- symbolVisit = ${symbolVisit},
- symbolDeclare = ${symbolDeclare}
-) }}
+元素的旋转
##${prefix} scaleX(number) = 1
-{{ use: partial-graphic-transform-common-desc(
- type = ${type},
- optionPath = ${optionPath},
- usageType = ${usageType},
- hostName = ${hostName},
- symbolVisit = ${symbolVisit},
- symbolDeclare = ${symbolDeclare}
-) }}
+元素在 x 方向上的缩放。
##${prefix} scaleY(number) = 1
-{{ use: partial-graphic-transform-common-desc(
- type = ${type},
- optionPath = ${optionPath},
- usageType = ${usageType},
- hostName = ${hostName},
- symbolVisit = ${symbolVisit},
- symbolDeclare = ${symbolDeclare}
-) }}
+元素在 y 方向上的缩放。
##${prefix} originX(number) = 0
-{{ use: partial-graphic-transform-common-desc(
- type = ${type},
- optionPath = ${optionPath},
- usageType = ${usageType},
- hostName = ${hostName},
- symbolVisit = ${symbolVisit},
- symbolDeclare = ${symbolDeclare}
-) }}
+元素旋转和缩放原点的 x 像素位置。
##${prefix} originY(number) = 0
-{{ use: partial-graphic-transform-common-desc(
- type = ${type},
- optionPath = ${optionPath},
- usageType = ${usageType},
- hostName = ${hostName},
- symbolVisit = ${symbolVisit},
- symbolDeclare = ${symbolDeclare}
-) }}
+元素旋转和缩放原点的 y 像素位置。
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org