Skip to content

Commit

Permalink
Merge branch 'main' into dev
Browse files Browse the repository at this point in the history
* main:
  feat: figure `text` add attrs `width` and `height`
  rectText figure width corrected
  • Loading branch information
liihuu committed Aug 19, 2023
2 parents 7e9b817 + fdd4d85 commit 9ce5e8e
Show file tree
Hide file tree
Showing 25 changed files with 223 additions and 273 deletions.
44 changes: 9 additions & 35 deletions docs/en-US/guide/chart-api.md
Original file line number Diff line number Diff line change
Expand Up @@ -760,39 +760,6 @@ Draw a rectangle.
- `borderRadius` border radius


### utils.drawText(ctx, text, styles)
```typescript
(
ctx: CanvasRenderingContext2D,
text: {
x: number
y: number
text: any
align?: 'center' | 'end' | 'left' | 'right' | 'start'
baseline?: 'alphabetic' | 'bottom' | 'hanging' | 'ideographic' | 'middle' | 'top'
},
styles: {
color?: string
size?: number
family?: string
weight?: number | string
}
) => void
```
Draw text.
- `ctx` canvas context
- `text` text parameter
- `x` starting point x-axis value
- `y` starting point y-axis value
- `text` text content
- `align` horizontal alignment
- `baseline` vertical alignment
- `styles` styles
- `color` color
- `size` size
- `family` font
- `weight` weight

### utils.drawRectText(ctx, rectText, styles)
```typescript
(
Expand All @@ -801,6 +768,8 @@ Draw text.
x: number
y: number
text: any
width?: number
height?: number
align?: 'center' | 'end' | 'left' | 'right' | 'start'
baseline?: 'alphabetic' | 'bottom' | 'hanging' | 'ideographic' | 'middle' | 'top'
},
Expand All @@ -823,12 +792,14 @@ Draw text.
}
) => void
```
Draw text with background.
Draw text.
- `ctx` canvas context
- `rectText` text parameter
- `x` starting point x-axis value
- `y` starting point y-axis value
- `text` text content
- `width` width
- `height` height
- `align` horizontal alignment
- `baseline` vertical alignment
- `styles` styles
Expand All @@ -846,4 +817,7 @@ Draw text with background.
- `borderStyle` border style
- `borderRadius` border radius size
- `borderDashedValue` border dashed line parameter value
- `backgroundColor` background color
- `backgroundColor` background color

### utils.drawRectText(ctx, rectText, styles)
Same as `utils.drawRectText(ctx, text, styles)`, it is deprecated and will be deleted after v10. Please use `utils.drawRectText(ctx, text, styles)` instead.
1 change: 0 additions & 1 deletion docs/en-US/guide/datasource.md
Original file line number Diff line number Diff line change
Expand Up @@ -20,4 +20,3 @@ The data required for the chart must be in a fixed format. Through the chart API
turnover: number
}
```
```
37 changes: 8 additions & 29 deletions docs/en-US/guide/figure.md
Original file line number Diff line number Diff line change
Expand Up @@ -165,34 +165,10 @@ new ({
x: number
// The y-axis coordinate value of the starting point
y: number
// text content
text: any
// alignment
align: CanvasTextAlign
// benchmark
baseline: CanvasTextBaseline
},
styles: {
// color
color?: string
// size
size?: number
// font
family?: string
// thickness
weight?: string | number
}
}) => Figure
```

### rectText
```typescript
new ({
attrs: {
// The x-axis coordinate value of the starting point
x: number
// The y-axis coordinate value of the starting point
y: number
// Fixed width
width: number
// Fixed height
height: number
// text content
text: any
// alignment
Expand All @@ -218,7 +194,7 @@ new ({
// top padding
paddingTop?: number
// Bottom padding
paddingBootom?: number
paddingBottom?: number
// border style
borderStyle?: 'solid' | 'dashed'
// border color
Expand All @@ -235,6 +211,9 @@ new ({
}) => Figure
```

### rectText
Same as `text`, it is deprecated and will be deleted after v10. Please use `text` instead.

## Customize figure
To create a custom figure, you only need to generate the figure information, and then add it globally through `klinecharts.registerFigure`, and add it to the chart to use it like the built-in figures.

Expand Down
42 changes: 8 additions & 34 deletions docs/guide/chart-api.md
Original file line number Diff line number Diff line change
Expand Up @@ -772,39 +772,8 @@
x: number
y: number
text: any
align?: 'center' | 'end' | 'left' | 'right' | 'start'
baseline?: 'alphabetic' | 'bottom' | 'hanging' | 'ideographic' | 'middle' | 'top'
},
styles: {
color?: string
size?: number
family?: string
weight?: number | string
}
) => void
```
绘制文字。
- `ctx` 画布上下文
- `text` 文字参数
- `x` 起始点x轴值
- `y` 起始点y轴值
- `text` 文字内容
- `align` 水平对齐方式
- `baseline` 垂直对齐方式
- `styles` 样式
- `color` 颜色
- `size` 尺寸
- `family` 字体
- `weight` 权重

### utils.drawRectText(ctx, rectText, styles)
```typescript
(
ctx: CanvasRenderingContext2D,
rectText: {
x: number
y: number
text: any
width?: number
height?: number
align?: 'center' | 'end' | 'left' | 'right' | 'start'
baseline?: 'alphabetic' | 'bottom' | 'hanging' | 'ideographic' | 'middle' | 'top'
},
Expand All @@ -829,10 +798,12 @@
```
绘制带背景的文字。
- `ctx` 画布上下文
- `rectText` 文字参数
- `attrs` 文字参数
- `x` 起始点x轴值
- `y` 起始点y轴值
- `text` 文字内容
- `width` 宽度
- `height` 高度
- `align` 水平对齐方式
- `baseline` 垂直对齐方式
- `styles` 样式
Expand All @@ -851,3 +822,6 @@
- `borderRadius` 边框圆角尺寸
- `borderDashedValue` 边框虚线参数值
- `backgroundColor` 背景色

### utils.drawRectText(ctx, rectText, styles)
`utils.drawText(ctx, text, styles)`,已废弃,v10之后会删除,请用`utils.drawText(ctx, text, styles)`代替。
1 change: 0 additions & 1 deletion docs/guide/datasource.md
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,6 @@
volume: number
// 成交额,非必须字段,如果需要展示技术指标'EMV'和'AVP',则需要为该字段填充数据。
turnover: number

}
```

Expand Down
41 changes: 10 additions & 31 deletions docs/guide/figure.md
Original file line number Diff line number Diff line change
Expand Up @@ -167,38 +167,14 @@ new ({
y: number
// 文字内容
text: any
// 指定宽
width?: number
// 指定高
height?: number
// 对齐方式
align: CanvasTextAlign
align?: CanvasTextAlign
// 基准
baseline: CanvasTextBaseline
},
styles: {
// 颜色
color?: string
// 尺寸
size?: number
// 字体
family?: string
// 粗细
weight?: string | number
}
}) => Figure
```

### rectText
```typescript
new ({
attrs: {
// 起始点x轴坐标值
x: number
// 起始点y轴坐标值
y: number
// 文字内容
text: any
// 对齐方式
align: CanvasTextAlign
// 基准
baseline: CanvasTextBaseline
baseline?: CanvasTextBaseline
},
styles: {
// 样式,可选项`fill`,`stroke`,`stroke_fill`
Expand All @@ -218,7 +194,7 @@ new ({
// 上内边距
paddingTop?: number
// 下内边距
paddingBootom?: number
paddingBottom?: number
// 边框样式
borderStyle?: 'solid' | 'dashed'
// 边框颜色
Expand All @@ -235,6 +211,9 @@ new ({
}) => Figure
```

### rectText
`text`,已废弃,v10之后会删除,请用`text`代替。

## 自定义基础图形
创建一个自定义基础图形,只需要生成基础图形信息,然后通过`klinecharts.registerFigure`全局添加,添加到图表即可和内置基础图形一样去使用。

Expand Down
Loading

0 comments on commit 9ce5e8e

Please sign in to comment.