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 2022/11/11 10:45:02 UTC
[echarts-handbook] branch master updated: remove deprecated `normal` level in example code
This is an automated email from the ASF dual-hosted git repository.
wangzx pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/echarts-handbook.git
The following commit(s) were added to refs/heads/master by this push:
new 24d06b4 remove deprecated `normal` level in example code
24d06b4 is described below
commit 24d06b4258df5b4e308806e2d5551285e861add1
Author: plainheart <yh...@all-my-life.cn>
AuthorDate: Fri Nov 11 18:44:29 2022 +0800
remove deprecated `normal` level in example code
---
contents/en/how-to/label/rich-text.md | 310 ++++++++++++++++-----------------
contents/zh/how-to/label/rich-text.md | 312 ++++++++++++++++------------------
2 files changed, 299 insertions(+), 323 deletions(-)
diff --git a/contents/en/how-to/label/rich-text.md b/contents/en/how-to/label/rich-text.md
index f0612b2..2b7db8a 100644
--- a/contents/en/how-to/label/rich-text.md
+++ b/contents/en/how-to/label/rich-text.md
@@ -14,7 +14,7 @@ At the beginning, the meanings of two terms that will be used below should be cl
For example:
-<md-example src="doc-example/text-block-fragment" width="400" height="300"></md-example>
+<md-example src="doc-example/text-block-fragment" width="450" height="300"></md-example>
## Options about Text
@@ -101,65 +101,63 @@ option = {
{
value: [0, 0],
label: {
- normal: {
- show: true,
- formatter: [
- 'Plain text',
- '{textBorder|textBorderColor + textBorderWidth}',
- '{textShadow|textShadowColor + textShadowBlur + textShadowOffsetX + textShadowOffsetY}',
- '{bg|backgroundColor + borderRadius + padding}',
- '{border|borderColor + borderWidth + borderRadius + padding}',
- '{shadow|shadowColor + shadowBlur + shadowOffsetX + shadowOffsetY}'
- ].join('\n'),
- backgroundColor: '#eee',
- borderColor: '#333',
- borderWidth: 2,
- borderRadius: 5,
- padding: 10,
- color: '#000',
- fontSize: 14,
- shadowBlur: 3,
- shadowColor: '#888',
- shadowOffsetX: 0,
- shadowOffsetY: 3,
- lineHeight: 30,
- rich: {
- textBorder: {
- fontSize: 20,
- textBorderColor: '#000',
- textBorderWidth: 3,
- color: '#fff'
- },
- textShadow: {
- fontSize: 16,
- textShadowBlur: 5,
- textShadowColor: '#000',
- textShadowOffsetX: 3,
- textShadowOffsetY: 3,
- color: '#fff'
- },
- bg: {
- backgroundColor: '#339911',
- color: '#fff',
- borderRadius: 15,
- padding: 5
- },
- border: {
- color: '#000',
- borderColor: '#449911',
- borderWidth: 1,
- borderRadius: 3,
- padding: 5
- },
- shadow: {
- backgroundColor: '#992233',
- padding: 5,
- color: '#fff',
- shadowBlur: 5,
- shadowColor: '#336699',
- shadowOffsetX: 6,
- shadowOffsetY: 6
- }
+ show: true,
+ formatter: [
+ 'Plain text',
+ '{textBorder|textBorderColor + textBorderWidth}',
+ '{textShadow|textShadowColor + textShadowBlur + textShadowOffsetX + textShadowOffsetY}',
+ '{bg|backgroundColor + borderRadius + padding}',
+ '{border|borderColor + borderWidth + borderRadius + padding}',
+ '{shadow|shadowColor + shadowBlur + shadowOffsetX + shadowOffsetY}'
+ ].join('\n'),
+ backgroundColor: '#eee',
+ borderColor: '#333',
+ borderWidth: 2,
+ borderRadius: 5,
+ padding: 10,
+ color: '#000',
+ fontSize: 14,
+ shadowBlur: 3,
+ shadowColor: '#888',
+ shadowOffsetX: 0,
+ shadowOffsetY: 3,
+ lineHeight: 30,
+ rich: {
+ textBorder: {
+ fontSize: 20,
+ textBorderColor: '#000',
+ textBorderWidth: 3,
+ color: '#fff'
+ },
+ textShadow: {
+ fontSize: 16,
+ textShadowBlur: 5,
+ textShadowColor: '#000',
+ textShadowOffsetX: 3,
+ textShadowOffsetY: 3,
+ color: '#fff'
+ },
+ bg: {
+ backgroundColor: '#339911',
+ color: '#fff',
+ borderRadius: 15,
+ padding: 5
+ },
+ border: {
+ color: '#000',
+ borderColor: '#449911',
+ borderWidth: 1,
+ borderRadius: 3,
+ padding: 5
+ },
+ shadow: {
+ backgroundColor: '#992233',
+ padding: 5,
+ color: '#fff',
+ shadowBlur: 5,
+ shadowColor: '#336699',
+ shadowOffsetX: 6,
+ shadowOffsetY: 6
}
}
}
@@ -195,27 +193,25 @@ option = {
symbol: 'roundRect',
data: [[1, 1]],
label: {
- normal: {
- // Options: 'left', 'right', 'top', 'bottom', 'inside', 'insideTop', 'insideLeft', 'insideRight', 'insideBottom', 'insideTopLeft', 'insideTopRight', 'insideBottomLeft', 'insideBottomRight'
- position: 'top',
- distance: 10,
-
- show: true,
- formatter: ['Label Text'].join('\n'),
- backgroundColor: '#eee',
- borderColor: '#555',
- borderWidth: 2,
- borderRadius: 5,
- padding: 10,
- fontSize: 18,
- shadowBlur: 3,
- shadowColor: '#888',
- shadowOffsetX: 0,
- shadowOffsetY: 3,
- textBorderColor: '#000',
- textBorderWidth: 3,
- color: '#fff'
- }
+ // Options: 'left', 'right', 'top', 'bottom', 'inside', 'insideTop', 'insideLeft', 'insideRight', 'insideBottom', 'insideTopLeft', 'insideTopRight', 'insideBottomLeft', 'insideBottomRight'
+ position: 'top',
+ distance: 10,
+
+ show: true,
+ formatter: ['Label Text'].join('\n'),
+ backgroundColor: '#eee',
+ borderColor: '#555',
+ borderWidth: 2,
+ borderRadius: 5,
+ padding: 10,
+ fontSize: 18,
+ shadowBlur: 3,
+ shadowColor: '#888',
+ shadowOffsetX: 0,
+ shadowOffsetY: 3,
+ textBorderColor: '#000',
+ textBorderWidth: 3,
+ color: '#fff'
}
}
],
@@ -326,17 +322,15 @@ option = {
{
value: [0, 0],
label: {
- normal: {
- formatter: [
- '{tc|Center Title}{titleBg|}',
- ' Content text xxxxxxxx {sunny|} xxxxxxxx {cloudy|} ',
- '{hr|}',
- ' xxxxx {showers|} xxxxxxxx xxxxxxxxx '
- ].join('\n'),
- rich: {
- titleBg: {
- align: 'right'
- }
+ formatter: [
+ '{tc|Center Title}{titleBg|}',
+ ' Content text xxxxxxxx {sunny|} xxxxxxxx {cloudy|} ',
+ '{hr|}',
+ ' xxxxx {showers|} xxxxxxxx xxxxxxxxx '
+ ].join('\n'),
+ rich: {
+ titleBg: {
+ align: 'right'
}
}
}
@@ -344,30 +338,26 @@ option = {
{
value: [0, 1],
label: {
- normal: {
- formatter: [
- '{titleBg|Left Title}',
- ' Content text xxxxxxxx {sunny|} xxxxxxxx {cloudy|} ',
- '{hr|}',
- ' xxxxx {showers|} xxxxxxxx xxxxxxxxx '
- ].join('\n')
- }
+ formatter: [
+ '{titleBg|Left Title}',
+ ' Content text xxxxxxxx {sunny|} xxxxxxxx {cloudy|} ',
+ '{hr|}',
+ ' xxxxx {showers|} xxxxxxxx xxxxxxxxx '
+ ].join('\n')
}
},
{
value: [0, 2],
label: {
- normal: {
- formatter: [
- '{titleBg|Right Title}',
- ' Content text xxxxxxxx {sunny|} xxxxxxxx {cloudy|} ',
- '{hr|}',
- ' xxxxx {showers|} xxxxxxxx xxxxxxxxx '
- ].join('\n'),
- rich: {
- titleBg: {
- align: 'right'
- }
+ formatter: [
+ '{titleBg|Right Title}',
+ ' Content text xxxxxxxx {sunny|} xxxxxxxx {cloudy|} ',
+ '{hr|}',
+ ' xxxxx {showers|} xxxxxxxx xxxxxxxxx '
+ ].join('\n'),
+ rich: {
+ titleBg: {
+ align: 'right'
}
}
}
@@ -375,56 +365,54 @@ option = {
],
symbolSize: 1,
label: {
- normal: {
- show: true,
- backgroundColor: '#ddd',
- borderColor: '#555',
- borderWidth: 1,
- borderRadius: 5,
- color: '#000',
- fontSize: 14,
- rich: {
- titleBg: {
- backgroundColor: '#000',
- height: 30,
- borderRadius: [5, 5, 0, 0],
- padding: [0, 10, 0, 10],
- width: '100%',
- color: '#eee'
- },
- tc: {
- align: 'center',
- color: '#eee'
- },
- hr: {
- borderColor: '#777',
- width: '100%',
- borderWidth: 0.5,
- height: 0
- },
- sunny: {
- height: 30,
- align: 'left',
- backgroundColor: {
- image:
- 'https://echarts.apache.org/examples/data/asset/img/weather/sunny_128.png'
- }
- },
- cloudy: {
- height: 30,
- align: 'left',
- backgroundColor: {
- image:
- 'https://echarts.apache.org/examples/data/asset/img/weather/cloudy_128.png'
- }
- },
- showers: {
- height: 30,
- align: 'left',
- backgroundColor: {
- image:
- 'https://echarts.apache.org/examples/data/asset/img/weather/showers_128.png'
- }
+ show: true,
+ backgroundColor: '#ddd',
+ borderColor: '#555',
+ borderWidth: 1,
+ borderRadius: 5,
+ color: '#000',
+ fontSize: 14,
+ rich: {
+ titleBg: {
+ backgroundColor: '#000',
+ height: 30,
+ borderRadius: [5, 5, 0, 0],
+ padding: [0, 10, 0, 10],
+ width: '100%',
+ color: '#eee'
+ },
+ tc: {
+ align: 'center',
+ color: '#eee'
+ },
+ hr: {
+ borderColor: '#777',
+ width: '100%',
+ borderWidth: 0.5,
+ height: 0
+ },
+ sunny: {
+ height: 30,
+ align: 'left',
+ backgroundColor: {
+ image:
+ 'https://echarts.apache.org/examples/data/asset/img/weather/sunny_128.png'
+ }
+ },
+ cloudy: {
+ height: 30,
+ align: 'left',
+ backgroundColor: {
+ image:
+ 'https://echarts.apache.org/examples/data/asset/img/weather/cloudy_128.png'
+ }
+ },
+ showers: {
+ height: 30,
+ align: 'left',
+ backgroundColor: {
+ image:
+ 'https://echarts.apache.org/examples/data/asset/img/weather/showers_128.png'
}
}
}
diff --git a/contents/zh/how-to/label/rich-text.md b/contents/zh/how-to/label/rich-text.md
index fe4ad81..89d6e2c 100644
--- a/contents/zh/how-to/label/rich-text.md
+++ b/contents/zh/how-to/label/rich-text.md
@@ -14,7 +14,7 @@ Apache ECharts<sup>TM</sup> 中的文本标签从 v3.7 开始支持富文本模
如下图示例：
-<md-example src="doc-example/text-block-fragment" width="400" height="300"></md-example>
+<md-example src="doc-example/text-block-fragment" width="450" height="300"></md-example>
## 文本样式相关的配置项
@@ -100,65 +100,63 @@ option = {
{
value: [0, 0],
label: {
- normal: {
- show: true,
- formatter: [
- 'Plain text',
- '{textBorder|textBorderColor + textBorderWidth}',
- '{textShadow|textShadowColor + textShadowBlur + textShadowOffsetX + textShadowOffsetY}',
- '{bg|backgroundColor + borderRadius + padding}',
- '{border|borderColor + borderWidth + borderRadius + padding}',
- '{shadow|shadowColor + shadowBlur + shadowOffsetX + shadowOffsetY}'
- ].join('\n'),
- backgroundColor: '#eee',
- borderColor: '#333',
- borderWidth: 2,
- borderRadius: 5,
- padding: 10,
- color: '#000',
- fontSize: 14,
- shadowBlur: 3,
- shadowColor: '#888',
- shadowOffsetX: 0,
- shadowOffsetY: 3,
- lineHeight: 30,
- rich: {
- textBorder: {
- fontSize: 20,
- textBorderColor: '#000',
- textBorderWidth: 3,
- color: '#fff'
- },
- textShadow: {
- fontSize: 16,
- textShadowBlur: 5,
- textShadowColor: '#000',
- textShadowOffsetX: 3,
- textShadowOffsetY: 3,
- color: '#fff'
- },
- bg: {
- backgroundColor: '#339911',
- color: '#fff',
- borderRadius: 15,
- padding: 5
- },
- border: {
- color: '#000',
- borderColor: '#449911',
- borderWidth: 1,
- borderRadius: 3,
- padding: 5
- },
- shadow: {
- backgroundColor: '#992233',
- padding: 5,
- color: '#fff',
- shadowBlur: 5,
- shadowColor: '#336699',
- shadowOffsetX: 6,
- shadowOffsetY: 6
- }
+ show: true,
+ formatter: [
+ 'Plain text',
+ '{textBorder|textBorderColor + textBorderWidth}',
+ '{textShadow|textShadowColor + textShadowBlur + textShadowOffsetX + textShadowOffsetY}',
+ '{bg|backgroundColor + borderRadius + padding}',
+ '{border|borderColor + borderWidth + borderRadius + padding}',
+ '{shadow|shadowColor + shadowBlur + shadowOffsetX + shadowOffsetY}'
+ ].join('\n'),
+ backgroundColor: '#eee',
+ borderColor: '#333',
+ borderWidth: 2,
+ borderRadius: 5,
+ padding: 10,
+ color: '#000',
+ fontSize: 14,
+ shadowBlur: 3,
+ shadowColor: '#888',
+ shadowOffsetX: 0,
+ shadowOffsetY: 3,
+ lineHeight: 30,
+ rich: {
+ textBorder: {
+ fontSize: 20,
+ textBorderColor: '#000',
+ textBorderWidth: 3,
+ color: '#fff'
+ },
+ textShadow: {
+ fontSize: 16,
+ textShadowBlur: 5,
+ textShadowColor: '#000',
+ textShadowOffsetX: 3,
+ textShadowOffsetY: 3,
+ color: '#fff'
+ },
+ bg: {
+ backgroundColor: '#339911',
+ color: '#fff',
+ borderRadius: 15,
+ padding: 5
+ },
+ border: {
+ color: '#000',
+ borderColor: '#449911',
+ borderWidth: 1,
+ borderRadius: 3,
+ padding: 5
+ },
+ shadow: {
+ backgroundColor: '#992233',
+ padding: 5,
+ color: '#fff',
+ shadowBlur: 5,
+ shadowColor: '#336699',
+ shadowOffsetX: 6,
+ shadowOffsetY: 6
}
}
}
@@ -194,28 +192,26 @@ option = {
symbol: 'roundRect',
data: [[1, 1]],
label: {
- normal: {
- // 修改 position 和 distance 的值试试
- // 支持：'left', 'right', 'top', 'bottom', 'inside', 'insideTop', 'insideLeft', 'insideRight', 'insideBottom', 'insideTopLeft', 'insideTopRight', 'insideBottomLeft', 'insideBottomRight'
- position: 'top',
- distance: 10,
-
- show: true,
- formatter: ['Label Text'].join('\n'),
- backgroundColor: '#eee',
- borderColor: '#555',
- borderWidth: 2,
- borderRadius: 5,
- padding: 10,
- fontSize: 18,
- shadowBlur: 3,
- shadowColor: '#888',
- shadowOffsetX: 0,
- shadowOffsetY: 3,
- textBorderColor: '#000',
- textBorderWidth: 3,
- color: '#fff'
- }
+ // 修改 position 和 distance 的值试试
+ // 支持：'left', 'right', 'top', 'bottom', 'inside', 'insideTop', 'insideLeft', 'insideRight', 'insideBottom', 'insideTopLeft', 'insideTopRight', 'insideBottomLeft', 'insideBottomRight'
+ position: 'top',
+ distance: 10,
+
+ show: true,
+ formatter: ['Label Text'].join('\n'),
+ backgroundColor: '#eee',
+ borderColor: '#555',
+ borderWidth: 2,
+ borderRadius: 5,
+ padding: 10,
+ fontSize: 18,
+ shadowBlur: 3,
+ shadowColor: '#888',
+ shadowOffsetX: 0,
+ shadowOffsetY: 3,
+ textBorderColor: '#000',
+ textBorderWidth: 3,
+ color: '#fff'
}
}
],
@@ -326,17 +322,15 @@ option = {
{
value: [0, 0],
label: {
- normal: {
- formatter: [
- '{tc|Center Title}{titleBg|}',
- ' Content text xxxxxxxx {sunny|} xxxxxxxx {cloudy|} ',
- '{hr|}',
- ' xxxxx {showers|} xxxxxxxx xxxxxxxxx '
- ].join('\n'),
- rich: {
- titleBg: {
- align: 'right'
- }
+ formatter: [
+ '{tc|Center Title}{titleBg|}',
+ ' Content text xxxxxxxx {sunny|} xxxxxxxx {cloudy|} ',
+ '{hr|}',
+ ' xxxxx {showers|} xxxxxxxx xxxxxxxxx '
+ ].join('\n'),
+ rich: {
+ titleBg: {
+ align: 'right'
}
}
}
@@ -344,30 +338,26 @@ option = {
{
value: [0, 1],
label: {
- normal: {
- formatter: [
- '{titleBg|Left Title}',
- ' Content text xxxxxxxx {sunny|} xxxxxxxx {cloudy|} ',
- '{hr|}',
- ' xxxxx {showers|} xxxxxxxx xxxxxxxxx '
- ].join('\n')
- }
+ formatter: [
+ '{titleBg|Left Title}',
+ ' Content text xxxxxxxx {sunny|} xxxxxxxx {cloudy|} ',
+ '{hr|}',
+ ' xxxxx {showers|} xxxxxxxx xxxxxxxxx '
+ ].join('\n')
}
},
{
value: [0, 2],
label: {
- normal: {
- formatter: [
- '{titleBg|Right Title}',
- ' Content text xxxxxxxx {sunny|} xxxxxxxx {cloudy|} ',
- '{hr|}',
- ' xxxxx {showers|} xxxxxxxx xxxxxxxxx '
- ].join('\n'),
- rich: {
- titleBg: {
- align: 'right'
- }
+ formatter: [
+ '{titleBg|Right Title}',
+ ' Content text xxxxxxxx {sunny|} xxxxxxxx {cloudy|} ',
+ '{hr|}',
+ ' xxxxx {showers|} xxxxxxxx xxxxxxxxx '
+ ].join('\n'),
+ rich: {
+ titleBg: {
+ align: 'right'
}
}
}
@@ -375,56 +365,54 @@ option = {
],
symbolSize: 1,
label: {
- normal: {
- show: true,
- backgroundColor: '#ddd',
- borderColor: '#555',
- borderWidth: 1,
- borderRadius: 5,
- color: '#000',
- fontSize: 14,
- rich: {
- titleBg: {
- backgroundColor: '#000',
- height: 30,
- borderRadius: [5, 5, 0, 0],
- padding: [0, 10, 0, 10],
- width: '100%',
- color: '#eee'
- },
- tc: {
- align: 'center',
- color: '#eee'
- },
- hr: {
- borderColor: '#777',
- width: '100%',
- borderWidth: 0.5,
- height: 0
- },
- sunny: {
- height: 30,
- align: 'left',
- backgroundColor: {
- image:
- 'https://echarts.apache.org/examples/data/asset/img/weather/sunny_128.png'
- }
- },
- cloudy: {
- height: 30,
- align: 'left',
- backgroundColor: {
- image:
- 'https://echarts.apache.org/examples/data/asset/img/weather/cloudy_128.png'
- }
- },
- showers: {
- height: 30,
- align: 'left',
- backgroundColor: {
- image:
- 'https://echarts.apache.org/examples/data/asset/img/weather/showers_128.png'
- }
+ show: true,
+ backgroundColor: '#ddd',
+ borderColor: '#555',
+ borderWidth: 1,
+ borderRadius: 5,
+ color: '#000',
+ fontSize: 14,
+ rich: {
+ titleBg: {
+ backgroundColor: '#000',
+ height: 30,
+ borderRadius: [5, 5, 0, 0],
+ padding: [0, 10, 0, 10],
+ width: '100%',
+ color: '#eee'
+ },
+ tc: {
+ align: 'center',
+ color: '#eee'
+ },
+ hr: {
+ borderColor: '#777',
+ width: '100%',
+ borderWidth: 0.5,
+ height: 0
+ },
+ sunny: {
+ height: 30,
+ align: 'left',
+ backgroundColor: {
+ image:
+ 'https://echarts.apache.org/examples/data/asset/img/weather/sunny_128.png'
+ }
+ },
+ cloudy: {
+ height: 30,
+ align: 'left',
+ backgroundColor: {
+ image:
+ 'https://echarts.apache.org/examples/data/asset/img/weather/cloudy_128.png'
+ }
+ },
+ showers: {
+ height: 30,
+ align: 'left',
+ backgroundColor: {
+ image:
+ 'https://echarts.apache.org/examples/data/asset/img/weather/showers_128.png'
}
}
}
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org