Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

docs(legend): 图例分页导航器的主题样式设置 #2435

Merged
merged 1 commit into from
Mar 17, 2021
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 2 additions & 1 deletion docs/api/components/legend.en.md
Original file line number Diff line number Diff line change
Expand Up @@ -40,7 +40,8 @@ legend: {
| offsetX | _number_ | - | Legends offset in the x direction. | |
| offsetY | _number_ | - | Legends offset in the y direction. | |
| background | _object_ | - | Background box configuration item.reference  [background configuration](#background) | |
| flipPage | _boolean_ | false | Whether to page when there are too many legend items. | <tag color="green" text="Classification legend">Classification legend</tag> |
| flipPage | _boolean_ | false | Whether to page when there are too many legend items. | <tag color="green" text="Classification legend">Classification legend</tag> |
| pageNavigator | _object_ | - | Configure the style of page navigator。 | <tag color="green" text="Classification legend">Classification legend</tag> |
| itemWidth | _number \| null_ | null | The width of the legend item, default to null (automatically computed). | <tag color="green" text="Classification legend">Classification legend</tag> |
| itemHeight | _number \| null_ | null | The height of the legend, default to null. | <tag color="green" text="Classification legend">Classification legend</tag> |
| itemName | _object_ | - | Configure the legend item name text.reference  [itemName configuration](#itemname) | <tag color="green" text="Classification legend">Classification legend</tag> |
Expand Down
1 change: 1 addition & 0 deletions docs/api/components/legend.zh.md
Original file line number Diff line number Diff line change
Expand Up @@ -40,6 +40,7 @@ legend: {
| offsetY | _number_ | - | 图例 y 方向的偏移。 | |
| background | _object_ | - | 背景框配置项。详见 [background 配置](#background) | |
| flipPage | _boolean_ | false | 当图例项过多时是否进行分页。 | <tag color="green" text="分类图例">分类图例</tag> |
| pageNavigator | _object_ | - | 分页器的主题样式设置。 | <tag color="green" text="分类图例">分类图例</tag> |
| itemWidth | _number \| null_ | null | 图例项的宽度, 默认为 null(自动计算)。 | <tag color="green" text="分类图例">分类图例</tag> |
| itemHeight | _number \| null_ | null | 图例的高度, 默认为 null。 | <tag color="green" text="分类图例">分类图例</tag> |
| itemName | _object_ | - | 图例项 name 文本的配置。详见 [itemName 配置](#itemname) | <tag color="green" text="分类图例">分类图例</tag> |
Expand Down
53 changes: 53 additions & 0 deletions docs/common/legend-cfg.en.md
Original file line number Diff line number Diff line change
Expand Up @@ -40,6 +40,59 @@ Background box configuration item. _LegendBackgroundCFG_ is configured as follow

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

##### pageNavigator

<description>**optional** _object_ </description>

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:

| Properties | Type | Default | Description |
| ------ | --------------------- | ------ | -------------- |
| marker.style | _PageNavigatorMarkerStyle_ | - | 分页器指示箭头配置项 |
| text.style | _PageNavigatorTextStyle_ | - | The text style of page info. |

Types of **_PageNavigatorMarkerStyle_** are as follow:

| Properties | Type | Default | Description |
| ------ | --------------------- | ------ | -------------- |
| inactiveFill | _string_ | - | Fill color of arrow marker when unclickable (inactive status). |
| inactiveOpacity | _number_ | - | Fill opacity of arrow marker when unclickable (inactive status). |
| fill | _string_ | - | Default fill color of arrow marker (active status). |
| opacity | _number_ | - | Default fill opacity of arrow marker (active status). |
| size | _number_ | - | Size of arrow marker. |

Types of **_PageNavigatorTextStyle_** are as follow:

| Properties | Type | Default | Description |
| ------ | --------------------- | ------ | -------------- |
| fill | _string_ | - | Font color of page navigator info. |
| fontSize | _number_ | - | Font size of page navigator info. |

Example:

```ts
pageNavigator: {
marker: {
style: {
// 非激活,不可点击态时的填充色设置
inactiveFill: '#000',
inactiveOpacity: 0.45,
// 默认填充色设置
fill: '#000',
opacity: 0.8,
size: 12,
},
},
text: {
style: {
fill: '#ccc',
fontSize: 8,
},
},
},
```


##### handler

<description>**optional** _ContinueLegendHandlerCfg_ </description>
Expand Down
52 changes: 52 additions & 0 deletions docs/common/legend-cfg.zh.md
Original file line number Diff line number Diff line change
Expand Up @@ -40,6 +40,58 @@

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

##### pageNavigator

<description>**optional** _object_ </description>

适用于 <tag color="green" text="分类图例">分类图例</tag>,图例分页导航器的主题样式设置。_LegendPageNavigatorCfg_ 配置如下:

| 参数名 | 类型 | 默认值 | 描述 |
| ------ | --------------------- | ------ | -------------- |
| marker.style | _PageNavigatorMarkerStyle_ | - | 分页器指示箭头 样式配置 |
| text.style | _PageNavigatorTextStyle_ | - | 分页器页面信息 样式配置 |

**_PageNavigatorMarkerStyle_** 配置如下:

| 参数名 | 类型 | 默认值 | 描述 |
| ------ | --------------------- | ------ | -------------- |
| inactiveFill | _string_ | - | Fill color of arrow marker when unclickable (inactive status). |
| inactiveOpacity | _number_ | - | Fill opacity of arrow marker when unclickable (inactive status). |
| fill | _string_ | - | Default fill color of arrow marker (active status). |
| opacity | _number_ | - | Default fill opacity of arrow marker (active status). |
| size | _number_ | - | Size of arrow marker. |

**_PageNavigatorTextStyle_** 配置如下:

| 参数名 | 类型 | 默认值 | 描述 |
| ------ | --------------------- | ------ | -------------- |
| fill | _string_ | - | Font color of page navigator info. |
| fontSize | _number_ | - | Font size of page navigator info. |

示例:

```ts
pageNavigator: {
marker: {
style: {
// 非激活,不可点击态时的填充色设置
inactiveFill: '#000',
inactiveOpacity: 0.45,
// 默认填充色设置
fill: '#000',
opacity: 0.8,
size: 12,
},
},
text: {
style: {
fill: '#ccc',
fontSize: 8,
},
},
},
```

##### handler

<description>**optional** _ContinueLegendHandlerCfg_ </description>
Expand Down