Merge pull request #473 from mawsyh/rectTextWidth

klinecharts · Aug 19, 2023 · fdd4d85 · fdd4d85
2 parents 3239007 + 3d70972
commit fdd4d85
Show file tree

Hide file tree

Showing 25 changed files with 223 additions and 273 deletions.
diff --git a/docs/en-US/guide/chart-api.md b/docs/en-US/guide/chart-api.md
@@ -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
 (
@@ -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'
    },
@@ -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
@@ -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.
diff --git a/docs/en-US/guide/datasource.md b/docs/en-US/guide/datasource.md
@@ -20,4 +20,3 @@ The data required for the chart must be in a fixed format. Through the chart API
   turnover: number
 }
 ```
-```
diff --git a/docs/en-US/guide/figure.md b/docs/en-US/guide/figure.md
@@ -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
@@ -218,7 +194,7 @@ new ({
     // top padding
     paddingTop?: number
     // Bottom padding
-    paddingBootom?: number
+    paddingBottom?: number
     // border style
     borderStyle?: 'solid' | 'dashed'
     // border color
@@ -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.
 

diff --git a/docs/guide/chart-api.md b/docs/guide/chart-api.md
@@ -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'
   },
@@ -829,10 +798,12 @@
 ```
 绘制带背景的文字。
 - `ctx` 画布上下文
-- `rectText` 文字参数
+- `attrs` 文字参数
   - `x` 起始点x轴值
   - `y` 起始点y轴值
   - `text` 文字内容
+  - `width` 宽度
+  - `height` 高度
   - `align` 水平对齐方式
   - `baseline` 垂直对齐方式
 - `styles` 样式
@@ -851,3 +822,6 @@
   - `borderRadius` 边框圆角尺寸
   - `borderDashedValue` 边框虚线参数值
   - `backgroundColor` 背景色
+
+### utils.drawRectText(ctx, rectText, styles)
+同`utils.drawText(ctx, text, styles)`，已废弃，v10之后会删除，请用`utils.drawText(ctx, text, styles)`代替。
diff --git a/docs/guide/datasource.md b/docs/guide/datasource.md
@@ -17,7 +17,6 @@
   volume: number
   // 成交额，非必须字段，如果需要展示技术指标'EMV'和'AVP'，则需要为该字段填充数据。
   turnover: number
-
 }
 ```
 

diff --git a/docs/guide/figure.md b/docs/guide/figure.md
@@ -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`
@@ -218,7 +194,7 @@ new ({
     // 上内边距
     paddingTop?: number
     // 下内边距
-    paddingBootom?: number
+    paddingBottom?: number
     // 边框样式
     borderStyle?: 'solid' | 'dashed'
     // 边框颜色
@@ -235,6 +211,9 @@ new ({
 }) => Figure
 ```
 
+### rectText
+同`text`，已废弃，v10之后会删除，请用`text`代替。
+
 ## 自定义基础图形
 创建一个自定义基础图形，只需要生成基础图形信息，然后通过`klinecharts.registerFigure`全局添加，添加到图表即可和内置基础图形一样去使用。