Skip to content

Commit e18fbf3

Browse files
authored
docs(legend): 图例分页导航器的主题样式设置 (#2435)
1 parent fd9ad5a commit e18fbf3

File tree

4 files changed

+108
-1
lines changed

4 files changed

+108
-1
lines changed

docs/api/components/legend.en.md

+2-1
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,8 @@ legend: {
4040
| offsetX | _number_ | - | Legends offset in the x direction. | |
4141
| offsetY | _number_ | - | Legends offset in the y direction. | |
4242
| background | _object_ | - | Background box configuration item.reference  [background configuration](#background) | |
43-
| flipPage | _boolean_ | false | Whether to page when there are too many legend items. | <tag color="green" text="Classification legend">Classification legend</tag> |
43+
| flipPage | _boolean_ | false | Whether to page when there are too many legend items. | <tag color="green" text="Classification legend">Classification legend</tag> |
44+
| pageNavigator | _object_ | - | Configure the style of page navigator。 | <tag color="green" text="Classification legend">Classification legend</tag> |
4445
| itemWidth | _number \| null_ | null | The width of the legend item, default to null (automatically computed). | <tag color="green" text="Classification legend">Classification legend</tag> |
4546
| itemHeight | _number \| null_ | null | The height of the legend, default to null. | <tag color="green" text="Classification legend">Classification legend</tag> |
4647
| itemName | _object_ | - | Configure the legend item name text.reference  [itemName configuration](#itemname) | <tag color="green" text="Classification legend">Classification legend</tag> |

docs/api/components/legend.zh.md

+1
Original file line numberDiff line numberDiff line change
@@ -40,6 +40,7 @@ legend: {
4040
| offsetY | _number_ | - | 图例 y 方向的偏移。 | |
4141
| background | _object_ | - | 背景框配置项。详见 [background 配置](#background) | |
4242
| flipPage | _boolean_ | false | 当图例项过多时是否进行分页。 | <tag color="green" text="分类图例">分类图例</tag> |
43+
| pageNavigator | _object_ | - | 分页器的主题样式设置。 | <tag color="green" text="分类图例">分类图例</tag> |
4344
| itemWidth | _number \| null_ | null | 图例项的宽度, 默认为 null(自动计算)。 | <tag color="green" text="分类图例">分类图例</tag> |
4445
| itemHeight | _number \| null_ | null | 图例的高度, 默认为 null。 | <tag color="green" text="分类图例">分类图例</tag> |
4546
| itemName | _object_ | - | 图例项 name 文本的配置。详见 [itemName 配置](#itemname) | <tag color="green" text="分类图例">分类图例</tag> |

docs/common/legend-cfg.en.md

+53
Original file line numberDiff line numberDiff line change
@@ -40,6 +40,59 @@ Background box configuration item. _LegendBackgroundCFG_ is configured as follow
4040

4141
Apply to <tag color="green" text="Classification legend">Classification legend</tag>,whether to page when there are too many legend items.
4242

43+
##### pageNavigator
44+
45+
<description>**optional** _object_ </description>
46+
47+
Apply to <tag color="green" text="Classification legend">Classification legend</tag>, configure the style of page navigator, it works when legend is in flipPage. Types of _LegendPageNavigatorCfg_ are as follow:
48+
49+
| Properties | Type | Default | Description |
50+
| ------ | --------------------- | ------ | -------------- |
51+
| marker.style | _PageNavigatorMarkerStyle_ | - | 分页器指示箭头配置项 |
52+
| text.style | _PageNavigatorTextStyle_ | - | The text style of page info. |
53+
54+
Types of **_PageNavigatorMarkerStyle_** are as follow:
55+
56+
| Properties | Type | Default | Description |
57+
| ------ | --------------------- | ------ | -------------- |
58+
| inactiveFill | _string_ | - | Fill color of arrow marker when unclickable (inactive status). |
59+
| inactiveOpacity | _number_ | - | Fill opacity of arrow marker when unclickable (inactive status). |
60+
| fill | _string_ | - | Default fill color of arrow marker (active status). |
61+
| opacity | _number_ | - | Default fill opacity of arrow marker (active status). |
62+
| size | _number_ | - | Size of arrow marker. |
63+
64+
Types of **_PageNavigatorTextStyle_** are as follow:
65+
66+
| Properties | Type | Default | Description |
67+
| ------ | --------------------- | ------ | -------------- |
68+
| fill | _string_ | - | Font color of page navigator info. |
69+
| fontSize | _number_ | - | Font size of page navigator info. |
70+
71+
Example:
72+
73+
```ts
74+
pageNavigator: {
75+
marker: {
76+
style: {
77+
// 非激活,不可点击态时的填充色设置
78+
inactiveFill: '#000',
79+
inactiveOpacity: 0.45,
80+
// 默认填充色设置
81+
fill: '#000',
82+
opacity: 0.8,
83+
size: 12,
84+
},
85+
},
86+
text: {
87+
style: {
88+
fill: '#ccc',
89+
fontSize: 8,
90+
},
91+
},
92+
},
93+
```
94+
95+
4396
##### handler
4497

4598
<description>**optional** _ContinueLegendHandlerCfg_ </description>

docs/common/legend-cfg.zh.md

+52
Original file line numberDiff line numberDiff line change
@@ -40,6 +40,58 @@
4040

4141
适用于 <tag color="green" text="分类图例">分类图例</tag>,当图例项过多时是否进行分页。
4242

43+
##### pageNavigator
44+
45+
<description>**optional** _object_ </description>
46+
47+
适用于 <tag color="green" text="分类图例">分类图例</tag>,图例分页导航器的主题样式设置。_LegendPageNavigatorCfg_ 配置如下:
48+
49+
| 参数名 | 类型 | 默认值 | 描述 |
50+
| ------ | --------------------- | ------ | -------------- |
51+
| marker.style | _PageNavigatorMarkerStyle_ | - | 分页器指示箭头 样式配置 |
52+
| text.style | _PageNavigatorTextStyle_ | - | 分页器页面信息 样式配置 |
53+
54+
**_PageNavigatorMarkerStyle_** 配置如下:
55+
56+
| 参数名 | 类型 | 默认值 | 描述 |
57+
| ------ | --------------------- | ------ | -------------- |
58+
| inactiveFill | _string_ | - | Fill color of arrow marker when unclickable (inactive status). |
59+
| inactiveOpacity | _number_ | - | Fill opacity of arrow marker when unclickable (inactive status). |
60+
| fill | _string_ | - | Default fill color of arrow marker (active status). |
61+
| opacity | _number_ | - | Default fill opacity of arrow marker (active status). |
62+
| size | _number_ | - | Size of arrow marker. |
63+
64+
**_PageNavigatorTextStyle_** 配置如下:
65+
66+
| 参数名 | 类型 | 默认值 | 描述 |
67+
| ------ | --------------------- | ------ | -------------- |
68+
| fill | _string_ | - | Font color of page navigator info. |
69+
| fontSize | _number_ | - | Font size of page navigator info. |
70+
71+
示例:
72+
73+
```ts
74+
pageNavigator: {
75+
marker: {
76+
style: {
77+
// 非激活,不可点击态时的填充色设置
78+
inactiveFill: '#000',
79+
inactiveOpacity: 0.45,
80+
// 默认填充色设置
81+
fill: '#000',
82+
opacity: 0.8,
83+
size: 12,
84+
},
85+
},
86+
text: {
87+
style: {
88+
fill: '#ccc',
89+
fontSize: 8,
90+
},
91+
},
92+
},
93+
```
94+
4395
##### handler
4496

4597
<description>**optional** _ContinueLegendHandlerCfg_ </description>

0 commit comments

Comments
 (0)