You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@echarts.apache.org by yu...@apache.org on 2020/10/14 08:03:02 UTC
[incubator-echarts-doc] 01/01: add content of gauge
This is an automated email from the ASF dual-hosted git repository.
yufeng04 pushed a commit to branch gauge5.0
in repository https://gitbox.apache.org/repos/asf/incubator-echarts-doc.git
commit b4a117c4a08a75b53be938a8de31a37e8ce6ba78
Author: yufeng04 <yu...@baidu.com>
AuthorDate: Wed Oct 14 15:59:16 2020 +0800
add content of gauge
---
en/option/partial/gauge-title-detail.md | 98 +++++++++++++
en/option/partial/roundCap.md | 15 ++
en/option/partial/text-style.md | 6 +-
en/option/series/bar.md | 12 +-
en/option/series/gauge.md | 244 +++++++++++++++++++------------
zh/option/partial/gauge-title-detail.md | 98 +++++++++++++
zh/option/partial/roundCap.md | 17 +++
zh/option/partial/text-style.md | 6 +-
zh/option/series/bar.md | 14 +-
zh/option/series/gauge.md | 245 ++++++++++++++++++++------------
10 files changed, 544 insertions(+), 211 deletions(-)
diff --git a/en/option/partial/gauge-title-detail.md b/en/option/partial/gauge-title-detail.md
new file mode 100644
index 0000000..56cfd4a
--- /dev/null
+++ b/en/option/partial/gauge-title-detail.md
@@ -0,0 +1,98 @@
+
+{{ target: partial-gauge-title-detail }}
+
+#${prefix|default('#')} title(Object)
+
+The title of gauge chart.
+
+##${prefix} show(boolean) = true
+
+<ExampleUIControlBoolean default="true" />
+
+Whether to show the title.
+
+##${prefix} offsetCenter(Array) = [0, '20%']
+
+<ExampleUIControlPercentVector default="0,20%" dims="x,y" />
+
+The offset position relative to the center of gauge chart. The first item of array is the horizontal offset; the second item of array is the vertical offset. It could be absolute value and also the percentage relative to the radius of gauge chart.
+
+{{ use: partial-text-style(
+ prefix = ${prefix} + '#',
+ defaultColor = "'#464646'",
+ defaultFontSize = 16,
+ noAlign = true,
+ noVerticalAlign = true
+) }}
+
+#${prefix|default('#')} detail(Object)
+
+The detail about gauge chart which is used to show data.
+
+##${prefix} show(boolean) = true
+
+<ExampleUIControlBoolean default="true" />
+
+Whether to show the details.
+
+{{ use: partial-text-style(
+ prefix = ${prefix} + '#',
+ defaultColor = "'#464646'",
+ defaultFontSize = 30,
+ defaultFontWeight = "'bold'",
+ defaultLineHeight = 30,
+ noAlign = true,
+ noVerticalAlign = true
+) }}
+
+##${prefix} width(number) = 100
+
+<ExampleUIControlPercent default="100" min="0" step="1" />
+
+The width of detail.
+
+##${prefix} height(number) = 40
+
+<ExampleUIControlPercent default="40" min="0" step="1" />
+
+The height of detail.
+
+##${prefix} color(Color) = '#464646'
+
+<ExampleUIControlColor />
+
+The text color. Defaults to use [the color of section](~series-gauge.axisLine.lineStyle.color) where the numerical value belongs to.
+
+##${prefix} backgroundColor(Color) = 'transparent'
+
+<ExampleUIControlColor />
+
+The background color of detail.
+
+##${prefix} borderWidth(number) = 0
+
+<ExampleUIControlNumber min="0" step="0.5" />
+
+The border width of detail.
+
+##${prefix} borderColor(Color) = '#ccc'
+
+<ExampleUIControlColor default="#ccc" />
+
+The border color of detail.
+
+##${prefix} offsetCenter(Array) = [0, '40%']
+
+<ExampleUIControlPercentVector default="0,40%" dims="x,y" />
+
+The offset position relative to the center of gauge chart. The first item of array is the horizontal offset; the second item of array is the vertical offset. It could be absolute value and also the percentage relative to the radius of gauge chart.
+
+##${prefix} formatter(Function|string)
+
+Formatter is used to format detail, which supports string template and callback function.
+
+```js
+formatter: function (value) {
+ return value.toFixed(0);
+}
+```
\ No newline at end of file
diff --git a/en/option/partial/roundCap.md b/en/option/partial/roundCap.md
new file mode 100644
index 0000000..c2724a4
--- /dev/null
+++ b/en/option/partial/roundCap.md
@@ -0,0 +1,15 @@
+{{ target: partial-roundCap }}
+
+#${prefix|default('#')} roundCap(boolean) = ${defaultRoundCap|default(false)}
+
+<ExampleUIControlBoolean default="${defaultRoundCap|default(false)}" />
+
+{{ use: partial-version(
+ version = "5.0"
+) }}
+
+<ExampleUIControlBoolean clean="true" />
+
+If to add round caps at the end of the bar sectors. Valid only for bar series on polar coordinates.
+
+~[800x500](${galleryViewPath}polar-roundCap&reset=1&edit=1)
\ No newline at end of file
diff --git a/en/option/partial/text-style.md b/en/option/partial/text-style.md
index 64b6af5..ece3a70 100644
--- a/en/option/partial/text-style.md
+++ b/en/option/partial/text-style.md
@@ -6,6 +6,8 @@
name = ${name},
defaultColor = ${defaultColor},
defaultFontSize = ${defaultFontSize},
+ defaultFontWeight = ${defaultFontWeight},
+ defaultLineHeight = ${defaultLineHeight},
noAlign = true,
noVerticalAlign = true,
noRich = true,
@@ -21,6 +23,8 @@
name = ${name},
defaultColor = ${defaultColor},
defaultFontSize = ${defaultFontSize},
+ defaultFontWeight = ${defaultFontWeight},
+ defaultLineHeight = ${defaultLineHeight},
defaultAlign = ${defaultAlign},
defaultVerticalAlign = ${defaultVerticalAlign},
noAlign = ${noAlign},
@@ -194,7 +198,7 @@ Options are:
) }}
{{ /if }}
-#${prefix} lineHeight(number)
+#${prefix} lineHeight(number) = ${defaultLineHeight|default('')}
<ExampleUIControlNumber min="0" step="1" default="12" />
diff --git a/en/option/series/bar.md b/en/option/series/bar.md
index 6e92ef0..4bde4cc 100644
--- a/en/option/series/bar.md
+++ b/en/option/series/bar.md
@@ -25,18 +25,10 @@ Bar chart shows different data through the height of a bar, which is used in [re
geo = false
) }}
-## roundCap(boolean) = false
-
-{{ use: partial-version(
- version = "4.5.0"
+{{ use: partial-roundCap(
+ prefix = "#"
) }}
-<ExampleUIControlBoolean clean="true" />
-
-If to add round caps at the end of the bar sectors. Valid only for bar series on polar coordinates.
-
-~[800x500](${galleryViewPath}polar-roundCap&reset=1&edit=1)
-
## showBackground(boolean) = false
{{ use: partial-version(
diff --git a/en/option/series/gauge.md b/en/option/series/gauge.md
index 68569b6..8d4a796 100644
--- a/en/option/series/gauge.md
+++ b/en/option/series/gauge.md
@@ -50,6 +50,10 @@ Whether the scale in gauge chart increases clockwise.
{{ use: partial-1d-data-desc() }}
+{{ use: partial-gauge-title-detail(
+ prefix = "##"
+) }}
+
### name(string)
Data name.
@@ -88,6 +92,10 @@ The related configuration about the axis line of gauge chart.
Whether to show the axis line of gauge chart.
+{{ use: partial-roundCap(
+ prefix = "##"
+) }}
+
### lineStyle(Object)
The style of the axis line of gauge chart.
@@ -98,10 +106,10 @@ The axis line of gauge chart can be divided to several segments in different col
Default value:
```js
-[[0.2, '#91c7ae'], [0.8, '#63869e'], [1, '#c23531']]
+[[1, '#E6EBF8']]
```
-#### width(number) = 30
+#### width(number) = 10
The width of axis line.
@@ -109,6 +117,56 @@ The width of axis line.
prefix = "###"
) }}
+## progress(Object)
+
+{{ use: partial-version(
+ version = "5.0"
+) }}
+
+Used to show current progress.
+
+### show(boolean) = false
+
+<ExampleUIControlBoolean default="true" />
+
+Whether to show the progress of gauge chart.
+
+### overlap(boolean) = true
+
+<ExampleUIControlBoolean default="true" />
+
+Whether the progress overlaps when there are multiple groups of data.
+
+### width(number) = 10
+
+<ExampleUIControlNumber default="10" min="0" step="0.5" />
+
+The width of progress.
+
+{{ use: partial-roundCap(
+ prefix = "##",
+ version = "5.0"
+) }}
+
+### silent(boolean) = true
+
+<ExampleUIControlBoolean default="true" />
+
+Set this to `false`, to allow interaction with the progress.
+
+{{ use: partial-clip(
+ prefix = "##",
+ version = "5.0"
+) }}
+
+### itemStyle(Object)
+
+The style of progress.
+
+{{ use: partial-item-style(
+ prefix = "###"
+) }}
+
## splitLine(Object)
The style of split line.
@@ -119,18 +177,28 @@ The style of split line.
Whether to show the split line.
-### length(number|string) = 30
+### length(number|string) = 10
-<ExampleUIControlPercent default="30" min="0" step="0.5" />
+<ExampleUIControlPercent default="10" min="0" step="0.5" />
The length of split line, can be a pecentage value relative to radius.
+### distance(number) = 10
+
+{{ use: partial-version(
+ version = "5.0"
+) }}
+
+<ExampleUIControlNumber default="10" min="0" step="0.5" />
+
+The distance between the split line and axis line.
+
### lineStyle(Object)
{{ use: partial-line-style(
prefix = '###',
- defaultColor = '#eee',
- defaultWidth = 2,
+ defaultColor = '#63677A',
+ defaultWidth = 3,
defaultType = "'solid'"
) }}
@@ -150,17 +218,27 @@ Whether to show the scale.
The split scale number between split line.
-### length(number|string) = 8
+### length(number|string) = 6
-<ExampleUIControlPercent default="8" min="0" step="0.5" />
+<ExampleUIControlPercent default="6" min="0" step="0.5" />
The length of tick line, can be a pecentage value relative to radius.
+### distance(number) = 10
+
+{{ use: partial-version(
+ version = "5.0"
+) }}
+
+<ExampleUIControlNumber default="10" min="0" step="0.5" />
+
+The distance between the tick line and axis line.
+
### lineStyle(Object)
{{ use: partial-line-style(
prefix = '###',
- defaultColor = '#eee',
+ defaultColor = '#63677A',
defaultWidth = 1,
defaultType = "'solid'"
) }}
@@ -175,9 +253,9 @@ Axis tick label.
Whether to show the label.
-### distance(number) = 5
+### distance(number) = 15
-<ExampleUIControlNumber default="5" min="0" step="0.5" />
+<ExampleUIControlNumber default="15" min="0" step="0.5" />
The distance between the label and tick line.
@@ -198,7 +276,8 @@ formatter: function (value) {
{{ use: partial-text-style(
prefix = "##",
noAlign = true,
- noVerticalAlign = true
+ noVerticalAlign = true,
+ defaultColor = "'#464646'"
) }}
## pointer(Object)
@@ -211,137 +290,116 @@ Gauge chart pointer.
Whether to show the pointer.
-### length(string|number) = '80%'
-
-<ExampleUIControlPercent default="80%" min="0" step="0.5" />
+### icon(string) = 'default'
-The length of pointer which could be absolute value and also the percentage relative to [radius](~series-gauge.radius).
+{{ use: partial-version(
+ version = "5.0"
+) }}
-### width(number) = 8
+{{ use: partial-icon-path() }}
-<ExampleUIControlNumber default="8" min="0" step="0.5" />
+### offsetCenter(Array) = [0, 0]
-The width of pointer.
+{{ use: partial-version(
+ version = "5.0"
+) }}
-## itemStyle(Object)
+<ExampleUIControlPercentVector default="0,0" dims="x,y" />
-The style of gauge chart.
+The offset position relative to the center of gauge chart. The first item of array is the horizontal offset; the second item of array is the vertical offset. It could be absolute value and also the percentage relative to the radius of gauge chart.
-{{ use: partial-item-style(
- prefix = "##"
-) }}
+### length(string|number) = '60%'
-<!-- overwrite color -->
+<ExampleUIControlPercent default="60%" min="0" step="0.5" />
-### color(Color) = 'auto'
+The length of pointer which could be absolute value and also the percentage relative to [radius](~series-gauge.radius).
-The color of pointer. Defaults to use [the color of section](~series-gauge.axisLine.lineStyle.color) where the numerical value belongs to.
+### width(number) = 6
-## emphasis(Object)
+<ExampleUIControlNumber default="6" min="0" step="0.5" />
-Configurations of emphasis state.
+The width of pointer.
-### itemStyle(*)
+### keepAspect(boolean) = false
-{{ use: partial-item-style(
- prefix = "###"
+{{ use: partial-version(
+ version = "5.0"
) }}
-## title(Object)
-
-The title of gauge chart.
-
-### show(boolean) = true
+<ExampleUIControlBoolean default="false" />
-<ExampleUIControlBoolean default="true" />
+Whether to keep aspect for icons in the form of `path://`.
-Whether to show the title.
+### itemStyle(Object)
-### offsetCenter(Array) = [0, '-40%']
+The style of pointer.
-<ExampleUIControlPercentVector default="0,-40%" dims="x,y" />
+{{ use: partial-item-style(
+ prefix = "###"
+) }}
-The offset position relative to the center of gauge chart. The first item of array is the horizontal offset; the second item of array is the vertical offset. It could be absolute value and also the percentage relative to the radius of gauge chart.
+## anchor(Object)
-{{ use: partial-text-style(
- prefix = "##",
- defaultColor = "'#333'",
- defaultFontSize = 15,
- noAlign = true,
- noVerticalAlign = true
+{{ use: partial-version(
+ version = "5.0"
) }}
-## detail(Object)
-
-The detail about gauge chart which is used to show data.
+The fixed point of a pointer in a dial.
### show(boolean) = true
<ExampleUIControlBoolean default="true" />
-Whether to show the details.
-
-### width(number) = 100
+Whether to show the anchor.
-<ExampleUIControlPercent default="100" min="0" step="1" />
+### anchorSize(number) = 6
-The width of detail.
+<ExampleUIControlNumber default="6" min="0" step="0.5" />
-### height(number) = 40
+The size of anchor.
-<ExampleUIControlPercent default="40" min="0" step="1" />
+### itemStyle(Object)
-The height of detail.
+The style of anchor.
-### backgroundColor(Color) = 'transparent'
-
-<ExampleUIControlColor />
-
-The background color of detail.
+{{ use: partial-item-style(
+ prefix = "###",
+ defaultColor = "'#fff'",
+) }}
-### borderWidth(number) = 0
+#### borderColor(Color) = '#5470c6'
-<ExampleUIControlNumber min="0" step="0.5" />
+<ExampleUIControlColor default="#5470c6" />
-The border width of detail.
+The border color of anchor.
-### borderColor(Color) = '#ccc'
+## itemStyle(Object)
-<ExampleUIControlColor default="#ccc" />
+The style of gauge chart.
-The border color of detail.
+{{ use: partial-item-style(
+ prefix = "##"
+) }}
-### offsetCenter(Array) = [0, '40%']
+<!-- overwrite color -->
-<ExampleUIControlPercentVector default="0,-40%" dims="x,y" />
+### color(Color) = 'auto'
-The offset position relative to the center of gauge chart. The first item of array is the horizontal offset; the second item of array is the vertical offset. It could be absolute value and also the percentage relative to the radius of gauge chart.
+The color of pointer. Defaults to use [the color of section](~series-gauge.axisLine.lineStyle.color) where the numerical value belongs to.
-### formatter(Function|string)
+## emphasis(Object)
-Formatter is used to format detail, which supports string template and callback function.
+Configurations of emphasis state.
-```js
-formatter: function (value) {
- return value.toFixed(0);
-}
-```
+### itemStyle(*)
-{{ use: partial-text-style(
- prefix = "##",
- defaultColor = "'auto'",
- defaultFontSize = 15,
- noAlign = true,
- noVerticalAlign = true
+{{ use: partial-item-style(
+ prefix = "###"
) }}
-<!-- overwrite color -->
-
-#### color(Color) = 'auto'
-
-<ExampleUIControlColor />
-
-The text color. Defaults to use [the color of section](~series-gauge.axisLine.lineStyle.color) where the numerical value belongs to.
+{{ use: partial-gauge-title-detail(
+ prefix = "#"
+) }}
{{ use: partial-marker(
prefix = "#",
diff --git a/zh/option/partial/gauge-title-detail.md b/zh/option/partial/gauge-title-detail.md
new file mode 100644
index 0000000..bdbcf82
--- /dev/null
+++ b/zh/option/partial/gauge-title-detail.md
@@ -0,0 +1,98 @@
+
+{{ target: partial-gauge-title-detail }}
+
+#${prefix|default('#')} title(Object)
+
+仪表盘标题。
+
+##${prefix} show(boolean) = true
+
+<ExampleUIControlBoolean default="true" />
+
+是否显示标题。
+
+##${prefix} offsetCenter(Array) = [0, '20%']
+
+<ExampleUIControlPercentVector default="0,20%" dims="x,y" />
+
+相对于仪表盘中心的偏移位置，数组第一项是水平方向的偏移，第二项是垂直方向的偏移。可以是绝对的数值，也可以是相对于仪表盘半径的百分比。
+
+{{ use: partial-text-style(
+ prefix = ${prefix} + '#',
+ defaultColor = "'#464646'",
+ defaultFontSize = 16,
+ noAlign = true,
+ noVerticalAlign = true
+) }}
+
+#${prefix|default('#')} detail(Object)
+
+仪表盘详情，用于显示数据。
+
+##${prefix} show(boolean) = true
+
+<ExampleUIControlBoolean default="true" />
+
+是否显示详情。
+
+{{ use: partial-text-style(
+ prefix = ${prefix} + '#',
+ defaultColor = "'#464646'",
+ defaultFontSize = 30,
+ defaultFontWeight = "'bold'",
+ defaultLineHeight = 30,
+ noAlign = true,
+ noVerticalAlign = true
+) }}
+
+##${prefix} width(number) = 100
+
+<ExampleUIControlPercent default="100" min="0" step="1" />
+
+详情宽度。
+
+##${prefix} height(number) = 40
+
+<ExampleUIControlPercent default="40" min="0" step="1" />
+
+详情高度。
+
+##${prefix} color(Color) = '#464646'
+
+<ExampleUIControlColor />
+
+文本颜色，默认取数值所在的[区间的颜色](~series-gauge.axisLine.lineStyle.color)
+
+##${prefix} backgroundColor(Color) = 'transparent'
+
+<ExampleUIControlColor />
+
+详情背景色。
+
+##${prefix} borderWidth(number) = 0
+
+<ExampleUIControlNumber min="0" step="0.5" />
+
+详情边框宽度。
+
+##${prefix} borderColor(Color) = '#ccc'
+
+<ExampleUIControlColor default="#ccc" />
+
+详情边框颜色。
+
+##${prefix} offsetCenter(Array) = [0, '40%']
+
+<ExampleUIControlPercentVector default="0,-40%" dims="x,y" />
+
+相对于仪表盘中心的偏移位置，数组第一项是水平方向的偏移，第二项是垂直方向的偏移。可以是绝对的数值，也可以是相对于仪表盘半径的百分比。
+
+##${prefix} formatter(Function|string)
+
+格式化函数或者字符串
+
+```js
+formatter: function (value) {
+ return value.toFixed(0);
+}
+```
diff --git a/zh/option/partial/roundCap.md b/zh/option/partial/roundCap.md
new file mode 100644
index 0000000..0a696d8
--- /dev/null
+++ b/zh/option/partial/roundCap.md
@@ -0,0 +1,17 @@
+{{ target: partial-roundCap }}
+
+#${prefix|default('#')} roundCap(boolean) = ${defaultRoundCap|default(false)}
+
+<ExampleUIControlBoolean default="${defaultRoundCap|default(false)}" />
+
+{{ use: partial-version(
+ version = "5.0"
+) }}
+
+<ExampleUIControlBoolean clean="true" />
+
+是否在环形柱条两侧使用圆弧效果。
+
+仅对极坐标系柱状图有效。
+
+~[800x500](${galleryViewPath}polar-roundCap&reset=1&edit=1)
\ No newline at end of file
diff --git a/zh/option/partial/text-style.md b/zh/option/partial/text-style.md
index 6e289d5..5a23e96 100644
--- a/zh/option/partial/text-style.md
+++ b/zh/option/partial/text-style.md
@@ -6,6 +6,8 @@
name = ${name},
defaultColor = ${defaultColor},
defaultFontSize = ${defaultFontSize},
+ defaultFontWeight = ${defaultFontWeight},
+ defaultLineHeight = ${defaultLineHeight},
noAlign = true,
noVerticalAlign = true,
noRich = true,
@@ -21,6 +23,8 @@
name = ${name},
defaultColor = ${defaultColor},
defaultFontSize = ${defaultFontSize},
+ defaultFontWeight = ${defaultFontWeight},
+ defaultLineHeight = ${defaultLineHeight},
defaultAlign = ${defaultAlign},
defaultVerticalAlign = ${defaultVerticalAlign},
noAlign = ${noAlign},
@@ -196,7 +200,7 @@ ${name}文字的字体大小。
) }}
{{ /if }}
-#${prefix} lineHeight(number)
+#${prefix} lineHeight(number) = ${defaultLineHeight|default('')}
<ExampleUIControlNumber min="0" step="1" default="12" />
diff --git a/zh/option/series/bar.md b/zh/option/series/bar.md
index d569320..dbe7fdc 100644
--- a/zh/option/series/bar.md
+++ b/zh/option/series/bar.md
@@ -101,20 +101,10 @@ option = {
geo = false
) }}
-## roundCap(boolean) = false
-
-{{ use: partial-version(
- version = "4.5.0"
+{{ use: partial-roundCap(
+ prefix = "#"
) }}
-<ExampleUIControlBoolean clean="true" />
-
-是否在环形柱条两侧使用圆弧效果。
-
-仅对极坐标系柱状图有效。
-
-~[800x500](${galleryViewPath}polar-roundCap&reset=1&edit=1)
-
## showBackground(boolean) = false
{{ use: partial-version(
diff --git a/zh/option/series/gauge.md b/zh/option/series/gauge.md
index d977278..db65b2f 100644
--- a/zh/option/series/gauge.md
+++ b/zh/option/series/gauge.md
@@ -63,6 +63,10 @@ const option = {
{{ use: partial-1d-data-desc() }}
+{{ use: partial-gauge-title-detail(
+ prefix = "##"
+) }}
+
### name(string)
数据项名称。
@@ -101,6 +105,10 @@ const option = {
是否显示仪表盘轴线。
+{{ use: partial-roundCap(
+ prefix = "##"
+) }}
+
### lineStyle(Object)
仪表盘轴线样式。
@@ -111,10 +119,10 @@ const option = {
默认取值：
```js
-[[0.2, '#91c7ae'], [0.8, '#63869e'], [1, '#c23531']]
+[[1, '#E6EBF8']]
```
-#### width(number) = 30
+#### width(number) = 10
轴线宽度。
@@ -122,6 +130,55 @@ const option = {
prefix = "###"
) }}
+## progress(Object)
+
+{{ use: partial-version(
+ version = "5.0"
+) }}
+
+展示当前进度。
+
+### show(boolean) = false
+
+<ExampleUIControlBoolean default="true" />
+
+是否显示进度条。
+
+### overlap(boolean) = true
+
+<ExampleUIControlBoolean default="true" />
+
+多组数据时进度条是否重叠。
+
+### width(number) = 10
+
+<ExampleUIControlBoolean default="true" />
+
+进度条宽度。
+
+{{ use: partial-roundCap(
+ prefix = "##"
+) }}
+
+### silent(boolean) = true
+
+<ExampleUIControlBoolean default="true" />
+
+收否响应鼠标事件。
+
+{{ use: partial-clip(
+ prefix = "##",
+ version = "5.0"
+) }}
+
+### itemStyle(Object)
+
+进度条样式。
+
+{{ use: partial-item-style(
+ prefix = "###"
+) }}
+
## splitLine(Object)
分隔线样式。
@@ -132,18 +189,28 @@ const option = {
是否显示分隔线。
-### length(number|string) = 30
+### length(number|string) = 10
-<ExampleUIControlPercent default="30" min="0" step="0.5" />
+<ExampleUIControlPercent default="10" min="0" step="0.5" />
分隔线线长。支持相对半径的百分比。
+### distance(number) = 10
+
+{{ use: partial-version(
+ version = "5.0"
+) }}
+
+<ExampleUIControlNumber default="10" min="0" step="0.5" />
+
+分隔线与轴线的距离。
+
### lineStyle(Object)
{{ use: partial-line-style(
prefix = '###',
- defaultColor = '#eee',
- defaultWidth = 2,
+ defaultColor = '#63677A',
+ defaultWidth = 3,
defaultType = "'solid'"
) }}
@@ -163,17 +230,27 @@ const option = {
分隔线之间分割的刻度数。
-### length(number|string) = 8
+### length(number|string) = 6
-<ExampleUIControlPercent default="8" min="0" step="0.5" />
+<ExampleUIControlPercent default="6" min="0" step="0.5" />
刻度线长。支持相对半径的百分比。
+### distance(number) = 10
+
+{{ use: partial-version(
+ version = "5.0"
+) }}
+
+<ExampleUIControlNumber default="10" min="0" step="0.5" />
+
+刻度线与轴线的距离。
+
### lineStyle(Object)
{{ use: partial-line-style(
prefix = '###',
- defaultColor = '#eee',
+ defaultColor = '#63677A',
defaultWidth = 1,
defaultType = "'solid'"
) }}
@@ -188,9 +265,9 @@ const option = {
是否显示标签。
-### distance(number) = 5
+### distance(number) = 15
-<ExampleUIControlNumber default="5" min="0" step="0.5" />
+<ExampleUIControlNumber default="15" min="0" step="0.5" />
标签与刻度线的距离。
@@ -211,7 +288,8 @@ formatter: function (value) {
{{ use: partial-text-style(
prefix = "##",
noAlign = true,
- noVerticalAlign = true
+ noVerticalAlign = true,
+ defaultColor = "'#464646'"
) }}
## pointer(Object)
@@ -224,137 +302,116 @@ formatter: function (value) {
是否显示指针。
-### length(string|number) = '80%'
-
-<ExampleUIControlPercent default="80%" min="0" step="0.5" />
+### icon(string) = 'default'
-指针长度，可以是绝对数值，也可以是相对于[半径](~series-gauge.radius)的半分比。
+{{ use: partial-version(
+ version = "5.0"
+) }}
-### width(number) = 8
+{{ use: partial-icon-path() }}
-<ExampleUIControlNumber default="8" min="0" step="0.5" />
+### offsetCenter(Array) = [0, 0]
-指针宽度。
+{{ use: partial-version(
+ version = "5.0"
+) }}
-## itemStyle(Object)
+<ExampleUIControlPercentVector default="0,0" dims="x,y" />
-仪表盘指针样式。
+相对于仪表盘中心的偏移位置，数组第一项是水平方向的偏移，第二项是垂直方向的偏移。可以是绝对的数值，也可以是相对于仪表盘半径的百分比。
-{{ use: partial-item-style(
- prefix = "##"
-) }}
+### length(string|number) = '60%'
-<!-- overwrite color -->
+<ExampleUIControlPercent default="60%" min="0" step="0.5" />
-### color(Color) = 'auto'
+指针长度，可以是绝对数值，也可以是相对于[半径](~series-gauge.radius)的半分比。
-指针颜色，默认取数值所在的[区间的颜色](~series-gauge.axisLine.lineStyle.color)
+### width(number) = 6
-## emphasis(Object)
+<ExampleUIControlNumber default="6" min="0" step="0.5" />
-高亮的仪表盘指针样式
+指针宽度。
-### itemStyle(*)
+### keepAspect(boolean) = false
-{{ use: partial-item-style(
- prefix = "###"
+{{ use: partial-version(
+ version = "5.0"
) }}
-## title(Object)
+<ExampleUIControlBoolean default="false" />
-仪表盘标题。
+如果图标是 `path://` 的形式，是否在缩放时保持该图形的长宽比。
-### show(boolean) = true
-
-<ExampleUIControlBoolean default="true" />
+### itemStyle(Object)
-是否显示标题。
+指针样式。
-### offsetCenter(Array) = [0, '-40%']
+{{ use: partial-item-style(
+ prefix = "###"
+) }}
-<ExampleUIControlPercentVector default="0,-40%" dims="x,y" />
+## anchor(Object)
-相对于仪表盘中心的偏移位置，数组第一项是水平方向的偏移，第二项是垂直方向的偏移。可以是绝对的数值，也可以是相对于仪表盘半径的百分比。
-
-{{ use: partial-text-style(
- prefix = "##",
- defaultColor = "'#333'",
- defaultFontSize = 15,
- noAlign = true,
- noVerticalAlign = true
+{{ use: partial-version(
+ version = "5.0"
) }}
-## detail(Object)
-
-仪表盘详情，用于显示数据。
+表盘中指针的固定点。
### show(boolean) = true
<ExampleUIControlBoolean default="true" />
-是否显示详情。
-
-### width(number) = 100
-
-<ExampleUIControlPercent default="100" min="0" step="1" />
+是否显示固定点。
-详情宽度。
+### anchorSize(number) = 6
-### height(number) = 40
+<ExampleUIControlNumber default="6" min="0" step="0.5" />
-<ExampleUIControlPercent default="40" min="0" step="1" />
+固定点大小。
-详情高度。
+### itemStyle(Object)
-### backgroundColor(Color) = 'transparent'
+指针固定点样式。
-<ExampleUIControlColor />
-
-详情背景色。
-
-### borderWidth(number) = 0
+{{ use: partial-item-style(
+ prefix = "###",
+ defaultColor = "'#fff'",
+) }}
+<!-- overwrite borderColor -->
+#### borderColor(Color) = '#5470c6'
-<ExampleUIControlNumber min="0" step="0.5" />
+<ExampleUIControlColor default="#5470c6" />
-详情边框宽度。
+固定点边框颜色。
-### borderColor(Color) = '#ccc'
+## itemStyle(Object)
-<ExampleUIControlColor default="#ccc" />
+仪表盘指针样式。
-详情边框颜色。
+{{ use: partial-item-style(
+ prefix = "##"
+) }}
-### offsetCenter(Array) = [0, '40%']
+<!-- overwrite color -->
-<ExampleUIControlPercentVector default="0,-40%" dims="x,y" />
+### color(Color) = 'auto'
-相对于仪表盘中心的偏移位置，数组第一项是水平方向的偏移，第二项是垂直方向的偏移。可以是绝对的数值，也可以是相对于仪表盘半径的百分比。
+指针颜色，默认取数值所在的[区间的颜色](~series-gauge.axisLine.lineStyle.color)
-### formatter(Function|string)
+## emphasis(Object)
-格式化函数或者字符串
+高亮的仪表盘指针样式
-```js
-formatter: function (value) {
- return value.toFixed(0);
-}
-```
+### itemStyle(*)
-{{ use: partial-text-style(
- prefix = "##",
- defaultColor = "'auto'",
- defaultFontSize = 15,
- noAlign = true,
- noVerticalAlign = true
+{{ use: partial-item-style(
+ prefix = "###"
) }}
-<!-- overwrite color -->
-
-#### color(Color) = 'auto'
-
-<ExampleUIControlColor />
-
-文本颜色，默认取数值所在的[区间的颜色](~series-gauge.axisLine.lineStyle.color)
+{{ use: partial-gauge-title-detail(
+ prefix = "#"
+) }}
{{ use: partial-marker(
prefix = "#",
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org