You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@echarts.apache.org by wa...@apache.org on 2021/03/08 09:27:13 UTC
[echarts-doc] 02/02: feat(border): add new border options brought
by v5.(en)
This is an automated email from the ASF dual-hosted git repository.
wangzx pushed a commit to branch feat/new-border-options
in repository https://gitbox.apache.org/repos/asf/echarts-doc.git
commit c2793dc85fa9592eaa846a883a04750aed9e1bf5
Author: plainheart <yh...@all-my-life.cn>
AuthorDate: Mon Mar 8 17:25:48 2021 +0800
feat(border): add new border options brought by v5.(en)
---
en/option/partial/item-style.md | 11 +--
en/option/partial/line-border-style.md | 147 +++++++++++++++++++++++++++++++++
en/option/partial/line-style.md | 15 ++--
en/option/partial/text-style.md | 17 ++++
4 files changed, 175 insertions(+), 15 deletions(-)
diff --git a/en/option/partial/item-style.md b/en/option/partial/item-style.md
index 9c2369b..d2cb08f 100644
--- a/en/option/partial/item-style.md
+++ b/en/option/partial/item-style.md
@@ -35,11 +35,12 @@ ${name} border color, whose format is similar to that of `color`.
${name} border width. No border when it is set to be 0.
-#${prefix} borderType(string) = 'solid'
-
-<ExampleUIControlEnum default="solid" options="solid,dashed,dotted" />
-
-Border type, which can be `'solid'`, `'dashed'`, or `'dotted'`. `'solid'` by default.
+{{ use: partial-line-border-style(
+ prefix = ${prefix},
+ name = ${name},
+ type = 'border',
+ defaultType = ${defaultType}
+) }}
{{ use: partial-style-shadow-opacity(
prefix = ${prefix},
diff --git a/en/option/partial/line-border-style.md b/en/option/partial/line-border-style.md
new file mode 100644
index 0000000..7a7aa23
--- /dev/null
+++ b/en/option/partial/line-border-style.md
@@ -0,0 +1,147 @@
+{{ target: partial-line-border-style }}
+
+{{ if: ${type} === 'border' }}
+#${prefix} borderType(string|number|Array) = ${defaultType|default("'solid'")}
+{{ elif: ${type} === 'text' }}
+#${prefix} textBorderType(string|number|Array) = ${defaultType|default("'solid'")}
+{{ else }}
+#${prefix} type(string|number|Array) = ${defaultType|default("'solid'")}
+{{ /if }}
+
+<ExampleUIControlEnum default="solid" options="solid,dashed,dotted" />
+
+{{ if: ${type} === 'border' }}
+${name} border type.
+{{ elif: ${type} === 'text' }}
+Stroke line type of the text.
+{{ else }}
+line type.
+{{ /if }}
+
+Possible values are:
++ `'solid'`
++ `'dashed'`
++ `'dotted'`
+
+Since `v5.0.0`, it can also be a number or a number array to specify the [dash array](https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-dasharray) of the line. With {{ if: ${type} === 'border' }}
+`borderDashOffset`
+{{ elif: ${type} === 'text' }}
+`textBorderDashOffset`
+{{ else }}
+`dashOffset`
+{{ /if }}, we can make the line style more flexible.
+
+For example:
+```js
+{
+ {{ if: ${type} === 'border' }}borderType{{ elif: ${type} === 'text' }}textBorderType{{ else }}type{{ /if }}: [5, 10],
+ {{ if: ${type} === 'border' }}borderDashOffset{{ elif: ${type} === 'text' }}textBorderDashOffset{{ else }}dashOffset{{ /if }}: 5
+}
+```
+
+
+{{ if: ${type} === 'border' }}
+#${prefix} borderDashOffset(number) = 0
+{{ elif: ${type} === 'text' }}
+#${prefix} textBorderDashOffset(number) = 0
+{{ else }}
+#${prefix} dashOffset(number) = 0
+{{ /if }}
+
+{{ use: partial-version(
+ version = "5.0.0"
+) }}
+
+<ExampleUIControlNumber min="0" step="1" default="0" />
+
+To set the line dash offset. With {{ if: ${type} === 'border' }}
+`borderType`
+{{ elif: ${type} === 'text' }}
+`textBorderType`
+{{ else }}
+`type`
+{{ /if }}, we can make the line style more flexible.
+
+Refer to MDN [lineDashOffset](https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/lineDashOffset) for more details.
+
+
+{{ if: !${noCap} }}
+
+{{ if: ${type} === 'border' }}
+#${prefix} borderCap(string) = 'butt'
+{{ else }}
+#${prefix} cap(string) = 'butt'
+{{ /if }}
+
+{{ use: partial-version(
+ version = "5.0.0"
+) }}
+
+<ExampleUIControlEnum default="butt" options="butt,round,square" />
+
+To specify how to draw the end points of the line.
+Possible values are:
++ `'butt'`: The ends of lines are squared off at the endpoints.
++ `'round'`: The ends of lines are rounded.
++ `'square'`: The ends of lines are squared off by adding a box with an equal width and half the height of the line's thickness.
+
+Default value is `'butt'`. Refer to MDN [lineCap](https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/lineCap) for more details.
+
+{{ /if }}
+
+
+{{ if: !${noJoin} }}
+
+{{ if: ${type} === 'border' }}
+#${prefix} borderJoin(string) = 'bevel'
+{{ else }}
+#${prefix} join(string) = 'bevel'
+{{ /if }}
+
+{{ use: partial-version(
+ version = "5.0.0"
+) }}
+
+<ExampleUIControlEnum default="bevel" options="bevel,round,miter" />
+
+To determine the shape used to join two line segments where they meet.
+
+Possible values are:
++ `'bevel'`: Fills an additional triangular area between the common endpoint of connected segments, and the separate outside rectangular corners of each segment.
++ `'round'`: Rounds off the corners of a shape by filling an additional sector of disc centered at the common endpoint of connected segments. The radius for these rounded corners is equal to the line width.
++ `'miter'`: Connected segments are joined by extending their outside edges to connect at a single point, with the effect of filling an additional lozenge-shaped area. This setting is affected by the {{ if: ${type} === 'border' }}
+`borderMiterLimit`
+{{ else }}
+`miterLimit`
+{{ /if }} property.
+
+Default value is `'bevel'`. Refer to MDN [lineJoin](https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/lineJoin) for more details.
+
+{{ /if }}
+
+
+{{ if: !${noMiterLimit} }}
+
+{{ if: ${type} === 'border' }}
+#${prefix} borderMiterLimit(number) = 10
+{{ else }}
+#${prefix} miterLimit(number) = 10
+{{ /if }}
+
+{{ use: partial-version(
+ version = "5.0.0"
+) }}
+
+<ExampleUIControlNumber min="0" step="1" default="10" />
+
+To set the miter limit ratio. Only works when {{ if: ${type} === 'border' }}
+`borderJoin`
+{{ else }}
+`join`
+{{ /if }} is set as `miter`.
+
+Default value is `10`. Negative、`0`、`Infinity` and `NaN` values are ignored.
+
+Refer to MDN [miterLimit](https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/miterLimit) for more details.
+
+{{ /if }}
\ No newline at end of file
diff --git a/en/option/partial/line-style.md b/en/option/partial/line-style.md
index 9d12c96..54178c9 100644
--- a/en/option/partial/line-style.md
+++ b/en/option/partial/line-style.md
@@ -23,16 +23,11 @@ Input parameters are `seriesIndex`, `dataIndex`, `data`, `value`, and etc. of da
${name} line width.
-#${prefix} type(string) = ${defaultType|default('solid')}
-
-<ExampleUIControlEnum default="solid" options="solid,dashed,dotted" />
-
-${name} line type.
-
-Options are:
-+ `'solid'`
-+ `'dashed'`
-+ `'dotted'`
+{{ use: partial-line-border-style(
+ prefix = ${prefix},
+ name = ${name},
+ defaultType = ${defaultType}
+) }}
{{ use: partial-style-shadow-opacity(
prefix = ${prefix},
diff --git a/en/option/partial/text-style.md b/en/option/partial/text-style.md
index bb3d73b..08e6f2e 100644
--- a/en/option/partial/text-style.md
+++ b/en/option/partial/text-style.md
@@ -257,6 +257,13 @@ Border color of the text fragment.
Border width of the text fragment.
+{{ use: partial-line-border-style(
+ prefix = ${prefix},
+ type = 'border',
+ name = 'the text fragment',
+ defaultType = ${defaultType}
+) }}
+
#${prefix} borderRadius(number) = 0
<ExampleUIControlVector min="0" dims="LT,RT, RB, LB" />
@@ -335,6 +342,16 @@ Storke color of the text.
Storke line width of the text.
+{{ use: partial-line-border-style(
+ prefix = ${prefix},
+ name = ${name},
+ type = 'text',
+ defaultType = ${defaultType},
+ noCap = true,
+ noJoin = true,
+ noMiterLimit = true
+) }}
+
#${prefix} textShadowColor(Color) = 'transparent'
<ExampleUIControlColor default="#000" />
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org