Skip to content

Commit 76745f5

Browse files
visikyvisiky
committed
docs(tooltip): 完善 tooltip crosshairs 文档
1 parent 2c2ce3c commit 76745f5

File tree

5 files changed

+119
-17
lines changed

5 files changed

+119
-17
lines changed

‎docs/api/graphic-style.zh.md

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -64,7 +64,7 @@ lineStyle: {
6464
shadowOffsetY: 5,
6565
cursor: 'pointer'
6666
}
67-
````
67+
```
6868

6969
效果：
7070

@@ -73,13 +73,13 @@ lineStyle: {
7373
## 配置文字样式
7474

7575
| 属性名 | 类型 | 介绍 |
76-
| ------------- | --------------- | ------------------------------------------------------------------------------------------------------------ | -------- | -------- | ------------ | --------------------------- |
76+
| ------------- | --------------- | ------------------------------------------------------------------------------------------------------------ |
7777
| fontSize | number | 文字大小 |
7878
| fontFamily | string | 文字字体 |
7979
| fontWeight | number | 字体粗细 |
8080
| lineHeight | number | 文字的行高 |
81-
| textAlign | string | 设置文本内容的当前对齐方式, 支持的属性：`center` | `end` | `left` | `right` | `start`，默认值为`start` |
82-
| textBaseline | string | 设置在绘制文本时使用的当前文本基线, 支持的属性:`top` | `middle` | `bottom` | `alphabetic` | `hanging`。默认值为`bottom` |
81+
| textAlign | string | 设置文本内容的当前对齐方式, 支持的属性：`center` \| `end` \| `left` \| `right` \| `start`，默认值为`start` |
82+
| textBaseline | string | 设置在绘制文本时使用的当前文本基线, 支持的属性:`top` \| `middle` \| `bottom` \| `alphabetic` \| `hanging`。默认值为`bottom` |
8383
| fill | string | 文字的填充色 |
8484
| fillOpacity | number | 文字的填充透明度 |
8585
| stroke | string | 文字的描边 |

‎docs/common/crosshairs-text.en.md

Lines changed: 55 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,55 @@
1+
<!-- 类型定义 -->
2+
3+
Types of **_TooltipCrosshairsText_** are as follow:
4+
5+
```ts
6+
/** 辅助线文本配置 */
7+
type TooltipCrosshairsText = {
8+
/**
9+
* position of text, only support: 'start' | 'end'
10+
* @type {string}
11+
*/
12+
position?: string;
13+
/**
14+
* 文本内容
15+
*/
16+
content?: string;
17+
/**
18+
* 距离线的距离
19+
* @type {number}
20+
*/
21+
offset?: number;
22+
/**
23+
* @type {boolean}
24+
*/
25+
autoRotate?: boolean;
26+
/**
27+
* 文本的配置项
28+
* @type {ShapeAttrs}
29+
*/
30+
style?: TextStyle;
31+
};
32+
```
33+
34+
Details about types of **_TextStyle_** see: [通用文本样式](/zh/docs/api/graphic-style#%E9%85%8D%E7%BD%AE%E6%96%87%E5%AD%97%E6%A0%B7%E5%BC%8F)
35+
36+
Types of **_TooltipCrosshairsTextCallback_** are as follow:
37+
38+
```ts
39+
/**
40+
* 辅助线文本回调函数
41+
* @param type 对应当前 crosshairs 的类型，值为 'x' 或者 'y'
42+
* @param defaultContent 对应当前 crosshairs 默认的文本内容
43+
* @param items 对应当前 tooltip 内容框中的数据
44+
* @param currentPoint 对应当前坐标点
45+
* @returns 返回当前 crosshairs 对应的辅助线文本配置
46+
*/
47+
type TooltipCrosshairsTextCallback = (
48+
type: string,
49+
defaultContent: any,
50+
items: any[],
51+
currentPoint: Point
52+
) => TooltipCrosshairsText;
53+
```
54+
55+
<playground path="more-plots/stock/custom-crosshairs.ts" rid="crosshairs"></playground>

‎docs/common/crosshairs-text.zh.md

Lines changed: 51 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,51 @@
1+
<!-- 类型定义 -->
2+
3+
**_TooltipCrosshairsText_** 类型定义如下：
4+
5+
```ts
6+
/** 辅助线文本配置 */
7+
type TooltipCrosshairsText = {
8+
/**
9+
* 文本位置，只支持 start， end
10+
* @type {string}
11+
*/
12+
position?: string;
13+
/**
14+
* 文本内容
15+
*/
16+
content?: string;
17+
/**
18+
* 距离线的距离
19+
* @type {number}
20+
*/
21+
offset?: number;
22+
/**
23+
* 是否自动旋转
24+
* @type {boolean}
25+
*/
26+
autoRotate?: boolean;
27+
/**
28+
* 文本的配置项
29+
* @type {ShapeAttrs}
30+
*/
31+
style?: TextStyle;
32+
}
33+
```
34+
35+
其中，**_TextStyle_** 类型定义详见: [通用文本样式](/zh/docs/api/graphic-style#%E9%85%8D%E7%BD%AE%E6%96%87%E5%AD%97%E6%A0%B7%E5%BC%8F)
36+
37+
**_TooltipCrosshairsTextCallback_** 类型定义如下：
38+
39+
```ts
40+
/**
41+
* 辅助线文本回调函数
42+
* @param type 对应当前 crosshairs 的类型，值为 'x' 或者 'y'
43+
* @param defaultContent 对应当前 crosshairs 默认的文本内容
44+
* @param items 对应当前 tooltip 内容框中的数据
45+
* @param currentPoint 对应当前坐标点
46+
* @returns 返回当前 crosshairs 对应的辅助线文本配置
47+
*/
48+
type TooltipCrosshairsTextCallback = (type: string, defaultContent: any, items: any[], currentPoint: Point) => TooltipCrosshairsText;
49+
```
50+
51+
<playground path="more-plots/stock/custom-crosshairs.ts" rid="crosshairs"></playground>

‎docs/common/tooltip.en.md

Lines changed: 4 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -74,17 +74,15 @@ Configure tooltip crosshairs to work if and only if 'showCrosshairs' is true.
7474

7575
| Properties | Type | Description |
7676
| -------------- | ---------------------- | --------------------------------------------------------------------------------------------- |
77-
| type | \_`x` \| `y` \| `xy`\_ | Crosshairs Type: 'X' represents the auxiliary line on the X axis, 'Y' on the Y axis |
77+
| type | _'x' \| 'y' \| 'xy'_ | Crosshairs Type: 'X' represents the auxiliary line on the X axis, 'Y' on the Y axis |
7878
| line | _lineStyle_ | The configuration item for line, see more [_ShapeAttrs_](/en/docs/api/graphic-style#configure-line-styles) |
79-
| text | _textStyle_ | Guideline text configuration, support callback |
79+
| text | _TooltipCrosshairsText \| TooltipCrosshairsTextCallback_ | Text configuration of crosshairs pointer, support callback |
8080
| textBackground | _textBackgroundStyle_ | Guideline text background configuration |
8181
| follow | _boolean_ | Whether the guide line follows the mouse. Default is false, that is, to locate the data point |
8282

83-
**_*textStyle*_**
83+
`markdown:docs/common/crosshairs-text.zh.md`
8484

85-
`markdown:docs/common/text-style.en.md`
86-
87-
**_textBackgroundStyle_**
85+
**_TextBackgroundStyle_**
8886

8987
| Properties | Type | Description |
9088
| ---------- | -------------------- | ------------------------------------------- |

‎docs/common/tooltip.zh.md

Lines changed: 5 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -74,17 +74,15 @@ true 表示合并当前点对应的所有数据并展示，false 表示只展示
7474

7575
| 细分配置项名称 | 类型 | 功能描述 |
7676
| -------------- | --------------------- | ------------------------------------------------------------------- |
77-
| type | _`x` \| `y` \| `xy`_ | crosshairs 的类型: `x` 表示 x 轴上的辅助线，`y` 表示 y 轴上的辅助项 |
77+
| type | _'x' \| 'y' \| 'xy'_ | crosshairs 的类型: `x` 表示 x 轴上的辅助线，`y` 表示 y 轴上的辅助项 |
7878
| line | _lineStyle_ | 线的配置项，详细可见 [_ShapeAttrs_](/zh/docs/api/graphic-style#configure-line-styles) |
79-
| text | _textStyle_ | 辅助线文本配置，支持回调 |
80-
| textBackground | _textBackgroundStyle_ | 辅助线文本背景配置 |
79+
| text | _TooltipCrosshairsText \| TooltipCrosshairsTextCallback_ | 辅助线文本配置，支持回调 |
80+
| textBackground | _TextBackgroundStyle_ | 辅助线文本背景配置 |
8181
| follow | _boolean_ | 辅助线是否跟随鼠标移动，默认为 false，即定位到数据点 |
8282

83-
**_textStyle_**
83+
`markdown:docs/common/crosshairs-text.zh.md`
8484

85-
`markdown:docs/common/text-style.zh.md`
86-
87-
**_textBackgroundStyle_**
85+
**_TextBackgroundStyle_**
8886

8987
| 细分配置项名称 | 类型 | 功能描述 |
9088
| -------------- | -------------------- | ------------------ |

0 commit comments

Comments
 (0)