From 020862a46a77363b28c5d98309b25fddff98db44 Mon Sep 17 00:00:00 2001 From: zhouxinyu Date: Thu, 21 Nov 2024 19:52:46 +0800 Subject: [PATCH 01/21] fix: fix issue with insertAfter and insertBefore --- .../vrender-core/feat-vstory_2024-11-21-11-50.json | 10 ++++++++++ packages/vrender-core/src/graphic/node-tree.ts | 6 +++--- 2 files changed, 13 insertions(+), 3 deletions(-) create mode 100644 common/changes/@visactor/vrender-core/feat-vstory_2024-11-21-11-50.json diff --git a/common/changes/@visactor/vrender-core/feat-vstory_2024-11-21-11-50.json b/common/changes/@visactor/vrender-core/feat-vstory_2024-11-21-11-50.json new file mode 100644 index 000000000..a592fcdcf --- /dev/null +++ b/common/changes/@visactor/vrender-core/feat-vstory_2024-11-21-11-50.json @@ -0,0 +1,10 @@ +{ + "changes": [ + { + "packageName": "@visactor/vrender-core", + "comment": "fix: fix issue with insertAfter and insertBefore", + "type": "none" + } + ], + "packageName": "@visactor/vrender-core" +} \ No newline at end of file diff --git a/packages/vrender-core/src/graphic/node-tree.ts b/packages/vrender-core/src/graphic/node-tree.ts index d13969f6c..57bc6861a 100644 --- a/packages/vrender-core/src/graphic/node-tree.ts +++ b/packages/vrender-core/src/graphic/node-tree.ts @@ -181,7 +181,7 @@ export class Node extends EventEmitter implements INode { if (!referenceNode) { return this.appendChild(newNode); } - if (this._uid === newNode._uid) { + if (this === newNode || newNode === referenceNode) { return null; } if (newNode.isAncestorsOf(this)) { @@ -225,7 +225,7 @@ export class Node extends EventEmitter implements INode { if (!referenceNode) { return this.appendChild(newNode); } - if (this._uid === newNode._uid) { + if (this === newNode || newNode === referenceNode) { return null; } if (newNode.isAncestorsOf(this)) { @@ -272,7 +272,7 @@ export class Node extends EventEmitter implements INode { if (idx >= this.childrenCount) { return this.appendChild(newNode); } - if (this._uid === newNode._uid) { + if (this === newNode) { return null; } if (newNode.isAncestorsOf(this)) { From 33f8b814cbcec43b060179414f2efd9f3d522775 Mon Sep 17 00:00:00 2001 From: skie1997 Date: Mon, 2 Dec 2024 01:44:18 +0800 Subject: [PATCH 02/21] fix: end symbol angle when arc line in markpoint. fix @VisActor/VChart#3427 --- ...k-point-symbol-angle_2024-12-01-17-44.json | 10 +++++++++ .../vrender-components/src/marker/point.ts | 22 ++++++++++++++++--- 2 files changed, 29 insertions(+), 3 deletions(-) create mode 100644 common/changes/@visactor/vrender-components/fix-mark-point-symbol-angle_2024-12-01-17-44.json diff --git a/common/changes/@visactor/vrender-components/fix-mark-point-symbol-angle_2024-12-01-17-44.json b/common/changes/@visactor/vrender-components/fix-mark-point-symbol-angle_2024-12-01-17-44.json new file mode 100644 index 000000000..371640cae --- /dev/null +++ b/common/changes/@visactor/vrender-components/fix-mark-point-symbol-angle_2024-12-01-17-44.json @@ -0,0 +1,10 @@ +{ + "changes": [ + { + "packageName": "@visactor/vrender-components", + "comment": "fix: end symbol angle when arc line in markpoint. fix @VisActor/VChart#3427", + "type": "none" + } + ], + "packageName": "@visactor/vrender-components" +} \ No newline at end of file diff --git a/packages/vrender-components/src/marker/point.ts b/packages/vrender-components/src/marker/point.ts index 071373873..90065d05c 100644 --- a/packages/vrender-components/src/marker/point.ts +++ b/packages/vrender-components/src/marker/point.ts @@ -243,9 +243,19 @@ export class MarkPoint extends Marker { this._isStraightLine = fuzzyEqualNumber(itemOffsetX, 0, FUZZY_EQUAL_DELTA) || fuzzyEqualNumber(itemOffsetY, 0, FUZZY_EQUAL_DELTA); if (this._isArcLine) { - const { x: x1, y: y1 } = newPosition; + // 思路: + // 1. 以数据位置为起点, 标记内容的位置为终点绘制圆弧 + // - 在起点与终点的垂直平分线上找圆心 + // - 根据圆心计算半径 + // - 根据圆心计算起始角度和结束角度 + // 2. 根据数据位置上要绘制的targetSymbol调整起始角度, 保证标记线上的startSymbol紧贴在targetSymbol上 + // ps: 计算时将targetSymbol看作圆, 如果是其他不规则形状, 无法保证 + // - 直接计算圆弧与targetSymbol的交点 到 圆心 的角度(也可以先计算交点的准确坐标, 但需解二元二次方程, 可行却没必要) + // - 用计算好的起始角度 - 交点到圆心的角度, 得到最终起始角度 + // 3. 根据是否为凹凸圆弧, 进行角度的进一步加工 + + const { x: x1, y: y1 } = this.attribute.position; const { x: x2, y: y2 } = newItemPosition; - // 得到中点和斜率 const x0 = (x1 + x2) / 2; const y0 = (y1 + y2) / 2; @@ -254,14 +264,20 @@ export class MarkPoint extends Marker { const line = (x: number) => k * (x - x0) + y0; // 在垂直平分线上找圆心 const direction = y2 > y1 ? -1 : 1; - const deltaX = arcRatio * direction * x0; // 数值决定曲率, 符号决定法向, 可通过配置自定义 const centerX = x0 + deltaX; const centerY = line(centerX); + // 计算半径和角度 startAngle = deltaXYToAngle(y1 - centerY, x1 - centerX); endAngle = deltaXYToAngle(y2 - centerY, x2 - centerX); center = { x: centerX, y: centerY }; + // 圆弧与symbol交点的角度 + const R = Math.sqrt((centerX - x1) * (centerX - x1) + (centerY - y1) * (centerY - y1)); + const r = this.attribute.targetSymbol.style.size / 2; + const deltaAngle = Math.acos(Math.sqrt(1 - (r * r) / (4 * R * R))) * 2; + startAngle = startAngle + deltaAngle; + if (arcRatio > 0) { // 此时绘制凹圆弧, 顺时针绘制 // 根据arc图元绘制逻辑, 需要保证endAngle > startAngle, 才能顺时针绘制 From 76d419418df238a4af2908399228a8087ee68c11 Mon Sep 17 00:00:00 2001 From: zhouxinyu Date: Mon, 2 Dec 2024 12:57:06 +0800 Subject: [PATCH 03/21] fix: fix the issue when line is configured to connect, closed #3238 --- .../vrender-core/fix-line-link_2024-12-02-04-56.json | 10 ++++++++++ packages/vrender-core/src/common/render-curve.ts | 4 +++- 2 files changed, 13 insertions(+), 1 deletion(-) create mode 100644 common/changes/@visactor/vrender-core/fix-line-link_2024-12-02-04-56.json diff --git a/common/changes/@visactor/vrender-core/fix-line-link_2024-12-02-04-56.json b/common/changes/@visactor/vrender-core/fix-line-link_2024-12-02-04-56.json new file mode 100644 index 000000000..26ac318c4 --- /dev/null +++ b/common/changes/@visactor/vrender-core/fix-line-link_2024-12-02-04-56.json @@ -0,0 +1,10 @@ +{ + "changes": [ + { + "packageName": "@visactor/vrender-core", + "comment": "fix: fix the issue when line is configured to connect, closed #3238", + "type": "none" + } + ], + "packageName": "@visactor/vrender-core" +} diff --git a/packages/vrender-core/src/common/render-curve.ts b/packages/vrender-core/src/common/render-curve.ts index 6bd59bb8d..b22abd04e 100644 --- a/packages/vrender-core/src/common/render-curve.ts +++ b/packages/vrender-core/src/common/render-curve.ts @@ -37,7 +37,9 @@ function drawEachCurve( // 找到合法的点 const { originP1, originP2 } = curve; let validP: IPointLike; - if (originP1 && originP1.defined !== false) { + // 只能第一个curve才可以用p0作为合法点，后面的curve都不应该算p1，因为已经算在前面了 + // lastCurve只在第一个curve不存在 + if (originP1 && originP1.defined !== false && !lastCurve) { validP = p0; } else if (originP1 && originP2.defined !== false) { validP = curve.p3 ?? curve.p1; From 2f428279f0c96b4c1a2b20ea76a1e09624acbc3b Mon Sep 17 00:00:00 2001 From: zhouxinyu Date: Mon, 2 Dec 2024 11:21:06 +0800 Subject: [PATCH 04/21] fix: fix issue with richtext setAttribute, closed #1578 --- ...ix-richtext-attribute-opacity_2024-12-02-05-00.json | 10 ++++++++++ packages/vrender-core/src/graphic/richtext.ts | 7 +++++++ 2 files changed, 17 insertions(+) create mode 100644 common/changes/@visactor/vrender-core/fix-richtext-attribute-opacity_2024-12-02-05-00.json diff --git a/common/changes/@visactor/vrender-core/fix-richtext-attribute-opacity_2024-12-02-05-00.json b/common/changes/@visactor/vrender-core/fix-richtext-attribute-opacity_2024-12-02-05-00.json new file mode 100644 index 000000000..eb0cddf3b --- /dev/null +++ b/common/changes/@visactor/vrender-core/fix-richtext-attribute-opacity_2024-12-02-05-00.json @@ -0,0 +1,10 @@ +{ + "changes": [ + { + "packageName": "@visactor/vrender-core", + "comment": "fix: fix issue with richtext setAttribute, closed #1578", + "type": "none" + } + ], + "packageName": "@visactor/vrender-core" +} \ No newline at end of file diff --git a/packages/vrender-core/src/graphic/richtext.ts b/packages/vrender-core/src/graphic/richtext.ts index a2e94ebd1..e7fe6d0a5 100644 --- a/packages/vrender-core/src/graphic/richtext.ts +++ b/packages/vrender-core/src/graphic/richtext.ts @@ -41,6 +41,13 @@ const RICHTEXT_UPDATE_TAG_KEY = [ 'fill', 'stroke', 'fontSize', + 'fontFamily', + 'fontStyle', + 'fontWeight', + 'lineWidth', + 'opacity', + 'fillOpacity', + 'strokeOpacity', ...GRAPHIC_UPDATE_TAG_KEY ]; From b09a397d6d86a30e42f4b3dd17c2b66a70eb5ae6 Mon Sep 17 00:00:00 2001 From: skie1997 Date: Mon, 2 Dec 2024 20:44:19 +0800 Subject: [PATCH 05/21] fix: do & op & po type angle problem --- packages/vrender-components/src/marker/point.ts | 16 +++++++++++++--- 1 file changed, 13 insertions(+), 3 deletions(-) diff --git a/packages/vrender-components/src/marker/point.ts b/packages/vrender-components/src/marker/point.ts index 90065d05c..1f77dea05 100644 --- a/packages/vrender-components/src/marker/point.ts +++ b/packages/vrender-components/src/marker/point.ts @@ -453,7 +453,7 @@ export class MarkPoint extends Marker { } protected computeNewPositionAfterTargetItem(position: Point) { - const { itemContent = {}, targetSymbol } = this.attribute as MarkPointAttrs; + const { itemContent = {}, targetSymbol, itemLine } = this.attribute as MarkPointAttrs; const { offsetX: itemContentOffsetX = 0, offsetY: itemContentOffsetY = 0 } = itemContent; const { offset: targetSymbolOffset = 0, @@ -462,7 +462,18 @@ export class MarkPoint extends Marker { size: targetSymbolSize } = targetSymbol; const targetSize = targetItemvisible ? targetSymbolStyle.size ?? targetSymbolSize ?? 20 : 0; - const targetOffsetAngle = deltaXYToAngle(itemContentOffsetY, itemContentOffsetX); + + let targetOffsetAngle; + if (itemLine.type === 'type-do') { + targetOffsetAngle = deltaXYToAngle(itemContentOffsetY, itemContentOffsetX / 2); + } else if (itemLine.type === 'type-po') { + targetOffsetAngle = deltaXYToAngle(0, itemContentOffsetX); + } else if (itemLine.type === 'type-op') { + targetOffsetAngle = deltaXYToAngle(itemContentOffsetY, 0); + } else { + targetOffsetAngle = deltaXYToAngle(itemContentOffsetY, itemContentOffsetX); + } + const newPosition: Point = { x: position.x + (targetSize / 2 + targetSymbolOffset) * Math.cos(targetOffsetAngle), y: position.y + (targetSize / 2 + targetSymbolOffset) * Math.sin(targetOffsetAngle) @@ -471,7 +482,6 @@ export class MarkPoint extends Marker { x: position.x + (targetSize / 2 + targetSymbolOffset) * Math.cos(targetOffsetAngle) + itemContentOffsetX, // 偏移量 = targetItem size + targetItem space + 用户配置offset y: position.y + (targetSize / 2 + targetSymbolOffset) * Math.sin(targetOffsetAngle) + itemContentOffsetY // 偏移量 = targetItem size + targetItem space + 用户配置offset }; - return { newPosition, newItemPosition }; } From 831c94a39bff1e4939873e3e486efa42dd7af048 Mon Sep 17 00:00:00 2001 From: skie1997 Date: Tue, 3 Dec 2024 14:49:35 +0800 Subject: [PATCH 06/21] feat: support vertex point of marker area label. close @VisActor/VChart#3442 --- ...at-marker-area-label_2024-12-03-06-49.json | 10 ++++++ .../vrender-components/src/marker/config.ts | 33 +++++++++++++++++++ .../vrender-components/src/marker/type.ts | 12 ++++++- 3 files changed, 54 insertions(+), 1 deletion(-) create mode 100644 common/changes/@visactor/vrender-components/feat-marker-area-label_2024-12-03-06-49.json diff --git a/common/changes/@visactor/vrender-components/feat-marker-area-label_2024-12-03-06-49.json b/common/changes/@visactor/vrender-components/feat-marker-area-label_2024-12-03-06-49.json new file mode 100644 index 000000000..14aebc2b0 --- /dev/null +++ b/common/changes/@visactor/vrender-components/feat-marker-area-label_2024-12-03-06-49.json @@ -0,0 +1,10 @@ +{ + "changes": [ + { + "packageName": "@visactor/vrender-components", + "comment": "feat: support vertex point of marker area label. close @VisActor/VChart#3442", + "type": "none" + } + ], + "packageName": "@visactor/vrender-components" +} \ No newline at end of file diff --git a/packages/vrender-components/src/marker/config.ts b/packages/vrender-components/src/marker/config.ts index 73a6df366..f24bc5123 100644 --- a/packages/vrender-components/src/marker/config.ts +++ b/packages/vrender-components/src/marker/config.ts @@ -364,6 +364,39 @@ export const DEFAULT_CARTESIAN_MARK_AREA_TEXT_STYLE_MAP: { middle: { textAlign: 'center', textBaseline: 'middle' + }, + + topLeft: { + textAlign: 'right', + textBaseline: 'top' + }, + insideTopLeft: { + textAlign: 'left', + textBaseline: 'top' + }, + topRight: { + textAlign: 'left', + textBaseline: 'top' + }, + insideTopRight: { + textAlign: 'right', + textBaseline: 'top' + }, + bottomLeft: { + textAlign: 'right', + textBaseline: 'bottom' + }, + insideBottomLeft: { + textAlign: 'left', + textBaseline: 'bottom' + }, + bottomRight: { + textAlign: 'left', + textBaseline: 'bottom' + }, + insideBottomRight: { + textAlign: 'right', + textBaseline: 'bottom' } }; diff --git a/packages/vrender-components/src/marker/type.ts b/packages/vrender-components/src/marker/type.ts index 981d8c7f8..45b09818e 100644 --- a/packages/vrender-components/src/marker/type.ts +++ b/packages/vrender-components/src/marker/type.ts @@ -42,11 +42,21 @@ export enum IMarkAreaLabelPosition { right = 'right', top = 'top', bottom = 'bottom', + topLeft = 'topLeft', + topRight = 'topRight', + bottomLeft = 'bottomLeft', + bottomRight = 'bottomRight', + middle = 'middle', + insideLeft = 'insideLeft', insideRight = 'insideRight', insideTop = 'insideTop', - insideBottom = 'insideBottom' + insideBottom = 'insideBottom', + insideTopLeft = 'insideTopLeft', + insideTopRight = 'insideTopRight', + insideBottomLeft = 'insideBottomLeft', + insideBottomRight = 'insideBottomRight' } export enum IMarkCommonArcLabelPosition { From cf1d2054057305e440bba2c6267cceb852726eec Mon Sep 17 00:00:00 2001 From: zhouxinyu Date: Tue, 3 Dec 2024 16:34:53 +0800 Subject: [PATCH 07/21] docs: add vrender contributing docs --- ...-Setting-Up-the-Development-Environment.md | 117 ++++++ .../en/2-Howto Submit an Issue.md | 61 ++++ .../en/3-How to Contribute Documentation.md | 248 +++++++++++++ .../en/4-How to Contribute to a Demo.md | 240 +++++++++++++ .../en/5-How to Contribute Code.md | 244 +++++++++++++ .../contributing/en/6-How to upload image.md | 39 ++ docs/assets/contributing/menu.json | 47 +++ ...-Setting-Up-the-Development-Environment.md | 122 +++++++ .../zh/2-Howto Submit an Issue.md | 61 ++++ .../zh/3-How to Contribute Documentation.md | 259 ++++++++++++++ .../zh/4-How to Contribute to a Demo.md | 332 ++++++++++++++++++ .../zh/5-How to Contribute Code.md | 244 +++++++++++++ .../contributing/zh/6-How to upload image.md | 45 +++ .../examples/en/graphic-arc/basic-arc.md | 8 + .../examples/en/graphic-area/basic-area.md | 4 + .../en/graphic-circle/basic-circle.md | 7 + .../en/graphic-circle/circle-gradient.md | 2 + .../examples/en/graphic-glyph/basic-glyph.md | 1 + .../examples/en/graphic-line/basic-line.md | 7 + .../examples/en/graphic-path/basic-path.md | 2 + .../examples/en/graphic-rect/basic-rect.md | 7 + .../en/graphic-richtext/basic-richtext.md | 2 + .../en/graphic-symbol/basic-symbol.md | 2 + .../examples/en/graphic-symbol/symbol-wave.md | 2 + .../examples/en/graphic-text/basic-text.md | 7 + .../examples/en/graphic-text/text-blend.md | 6 +- .../examples/zh/graphic-arc/basic-arc.md | 8 + docs/assets/examples/zh/graphic-arc/fan.md | 2 + .../examples/zh/graphic-area/basic-area.md | 4 + .../zh/graphic-circle/basic-circle.md | 7 + .../zh/graphic-circle/circle-gradient.md | 4 +- .../examples/zh/graphic-glyph/basic-glyph.md | 2 + .../examples/zh/graphic-line/basic-line.md | 7 + .../examples/zh/graphic-path/basic-path.md | 2 + .../examples/zh/graphic-rect/basic-rect.md | 7 + .../zh/graphic-rect/morphing-animate.md | 2 +- .../zh/graphic-richtext/basic-richtext.md | 2 + .../zh/graphic-symbol/basic-symbol.md | 2 + .../examples/zh/graphic-symbol/symbol-wave.md | 2 + .../examples/zh/graphic-text/basic-text.md | 7 + .../examples/zh/graphic-text/text-blend.md | 6 +- docs/menu.json | 5 + 42 files changed, 2179 insertions(+), 6 deletions(-) create mode 100644 docs/assets/contributing/en/1-Setting-Up-the-Development-Environment.md create mode 100644 docs/assets/contributing/en/2-Howto Submit an Issue.md create mode 100644 docs/assets/contributing/en/3-How to Contribute Documentation.md create mode 100644 docs/assets/contributing/en/4-How to Contribute to a Demo.md create mode 100644 docs/assets/contributing/en/5-How to Contribute Code.md create mode 100644 docs/assets/contributing/en/6-How to upload image.md create mode 100644 docs/assets/contributing/menu.json create mode 100644 docs/assets/contributing/zh/1-Setting-Up-the-Development-Environment.md create mode 100644 docs/assets/contributing/zh/2-Howto Submit an Issue.md create mode 100644 docs/assets/contributing/zh/3-How to Contribute Documentation.md create mode 100644 docs/assets/contributing/zh/4-How to Contribute to a Demo.md create mode 100644 docs/assets/contributing/zh/5-How to Contribute Code.md create mode 100644 docs/assets/contributing/zh/6-How to upload image.md diff --git a/docs/assets/contributing/en/1-Setting-Up-the-Development-Environment.md b/docs/assets/contributing/en/1-Setting-Up-the-Development-Environment.md new file mode 100644 index 000000000..307ccf046 --- /dev/null +++ b/docs/assets/contributing/en/1-Setting-Up-the-Development-Environment.md @@ -0,0 +1,117 @@ +--- +title: 1. Setting up Development Environment + +key words: VisActor, VChart, VTable, VStory, VMind, VGrammar, VRender, Visualization, Chart, Data, Table, Graph, Gis, LLM +--- + +# Github + +## 1.1 Register an Account + +The VisActor team usually develops and maintains issues on Github. Please open the [Github website](https://github.com/), click the `Sign up` button in the top right corner, register your own account, and take the first step on your open-source journey. + +If, due to special circumstances, you are unable to access the Github site, please inform us and proceed with project development through [Gitee](https://gitee.com/VisActor/VRender). + +## 1.2 Fork the Project + +First, you need to fork this project. Go to the [VRender project page](https://github.com/VisActor/VRender) and click the Fork button in the top right corner. + + + +Your github account will show the project xxxx(your github username)/vrender. + + + +# Local Development Environment + +## 2.1 Install Git + +Since the code is hosted on Github, we use git for version control. + +Git is a version control system used to track and manage code changes in software development projects. It helps developers record and manage the history of code, facilitating team collaboration, code version control, code merging, and other operations. With Git, you can track every version of each file and easily switch and compare between different versions. Git also provides branch management functionality, allowing multiple parallel development tasks to be carried out simultaneously. + +- Visit the Git official website: [https://git-scm.com/](https://git-scm.com/) + +- Download the latest version of the Git installer. + +- Run the downloaded installer and follow the installation wizard instructions. + +- After installation, you can confirm the successful installation by using the `git version` command in the command line. + +``` +git version +**git version 2.39.2 (Apple Git-143)** +``` + +## 2.2 Install Development Tools (Recommended: VSCode) + +VisActor is mainly in the front-end technology stack, and there are many tools available for front-end development. We recommend using VSCode. Of course, you can also use your preferred development tool. + +If you are not familiar with VSCode, it is recommended to read the official documentation: [https://vscode.js.cn/docs/setup/setup-overview](https://vscode.js.cn/docs/setup/setup-overview) + +## 2.3 Install Marscode AI Programming Assistant + +[Marscode AI Programming Assistant](https://www.marscode.cn/home?utm_source=developer&utm_medium=oss&utm_campaign=visactor_a) + +Marscode AI Programming Assistant is an AI programming assistant provided by Marscode, offering AI features such as intelligent code completion. It supports mainstream programming languages and IDEs, providing suggestions for writing single lines of code or entire functions during development. Additionally, it supports functions such as code interpretation, unit test generation, and issue fixing, improving development efficiency and quality. For more information, please refer to the [documentation of Marscode AI Programming Assistant](https://www.marscode.cn/home?utm_source=developer&utm_medium=oss&utm_campaign=visactor_a). + + + +With Marscode, VisActor developers can more conveniently perform tasks such as code understanding, document writing, feature development, and unit testing. Detailed examples will be provided in the contribution guidelines for various tasks. + + + +## 2.4 Clone the Code to Local + +Navigate to the VRender folder and add the remote address of VRender. + +``` +git remote add upstream https://github.com/VisActor/VRender.git +``` + +Get the latest source code of VRender. + +``` +git pull upstream develop +``` + +# Initialize the Project + +First, globally install [@microsoft/rush](https://rushjs.io/pages/intro/get_started/) + +``` +$ npm i --global @microsoft/rush +``` + +Next, run the command to view the demo. + +``` +# Install dependencies +$ rush update +# Start the demo page of vrender +$ rush run -p @visactor/vrender -s start +# Start the local document site +$ rush docs +``` + +# Next Steps + +So far, you have prepared for developing code. Please continue reading the next section of the tutorial to start different types of tasks. + +Github: [github.com/VisActor](https://link.juejin.cn/?target=https%3A%2F%2Fgithub.com%2FVisActor) + +VisActor WeChat subscription account (you can join the WeChat group through the subscription account menu): + + + +VisActor official website: [www.visactor.io/](https://link.juejin.cn/?target=https%3A%2F%2Fwww.visactor.io%2Fvtable) + +Feishu group: + + + +Discord: [https://discord.com/invite/3wPyxVyH6m](https://discord.com/invite/3wPyxVyH6m) + +# This document is contributed by the following individuals + +[Xuanhun](https://github.com/xuanhun) diff --git a/docs/assets/contributing/en/2-Howto Submit an Issue.md b/docs/assets/contributing/en/2-Howto Submit an Issue.md new file mode 100644 index 000000000..c6445b09f --- /dev/null +++ b/docs/assets/contributing/en/2-Howto Submit an Issue.md @@ -0,0 +1,61 @@ +--- +title: 2. How to Raise an Issue + +key words: VisActor, VChart, VTable, VStory, VMind, VGrammar, VRender, Visualization, Chart, Data, Table, Graph, Gis, LLM +--- + +Under the issues section of each project, you can create and search for issues. + +For example, VRender issues: [https://github.com/VisActor/VRender/issues](https://github.com/VisActor/VRender/issues) + + + +# Check for Existing Issues + +You can use the search filter to check the details of existing issues to see if a similar issue already exists. + +# Create an Issue + +If you don't find a similar issue, you can click the "New issue" button. + + + +Select "**Documentation Request**," click the "Get Start" button, and fill out the issue form. + + + +# Submit the Issue + +After filling out the issue form, click the "Submit new issue" button to submit your issue. + +# Follow Up on the Issue + +Once you have submitted the issue, you can check the status of your issue in the repository's "Issues" tab. The project developers may ask for more information or inform you that they are working on the issue. + +# Close the Issue + +If your problem has been resolved or your request has been fulfilled, the project developers will close the issue. You can also close the issue yourself if you believe the problem has been resolved or no longer need further assistance. + +By following these steps, you can successfully raise an issue for an open-source project on GitHub. Remember to describe the issue in as much detail and clarity as possible, as this will help the project developers understand and address your problem more quickly. + +# Next Steps + +By now, you are familiar with the concept of raising issues. Next, please continue reading the next section of the tutorial to start different types of tasks. + +GitHub: [github.com/VisActor](https://link.juejin.cn/?target=https%3A%2F%2Fgithub.com%2FVisActor) + +VisActor WeChat subscription account (you can join the WeChat group through the subscription account menu): + + + +VisActor Official Website: [www.visactor.io/](https://link.juejin.cn/?target=https%3A%2F%2Fwww.visactor.io%2Fvtable) + +Feishu Group: + + + +Discord: [https://discord.com/invite/3wPyxVyH6m](https://discord.com/invite/3wPyxVyH6m) + +# Contributors to this Document + +[玄魂](https://github.com/xuanhun) diff --git a/docs/assets/contributing/en/3-How to Contribute Documentation.md b/docs/assets/contributing/en/3-How to Contribute Documentation.md new file mode 100644 index 000000000..62f0708bc --- /dev/null +++ b/docs/assets/contributing/en/3-How to Contribute Documentation.md @@ -0,0 +1,248 @@ +--- +title: 3. How to Contribute to Documentation + +key words: VisActor, VChart, VTable, VStory, VMind, VGrammar, VRender, Visualization, Chart, Data, Table, Graph, Gis, LLM +--- + +# Create a Branch + +The default branch for VRender is the develop branch. Whether it's for feature development, bug fixes, or documentation writing, please create a new branch and then merge it into the develop branch. Use the following code to create a branch: + +``` +// Create a documentation or demo branch +git checkout -b docs/add-funnel-demo +``` + +# Find or Create an Issue + +In principle, we require that every PR has a corresponding issue. Before starting development, please make sure there is a corresponding issue that has not been claimed. + +## Search for Documentation Issues + +You can search for documentation-related issues using the following method: + +``` +is:open label:docs +``` + +![Search for Documentation Issues](https://cdn.jsdelivr.net/gh/xuanhun/articles/visactor/img/JkscbtGcbo9iQRxuAR2clnx6n9J.gif) + +Some features may be associated with the "doc" label, so you can further check if the issue is purely a documentation task. + +## Create a Documentation Issue + +Click on "NEW ISSUE", open the issue selection page, and choose "**Documentation Request**". + +![Create a Documentation Issue](https://cdn.jsdelivr.net/gh/xuanhun/articles/visactor/img/Xs7nbpfaCo479XxGRq5cONJ3nye.gif) + +Fill in the relevant information for the documentation issue you want to submit. + +![Fill in Documentation Issue Information](https://cdn.jsdelivr.net/gh/xuanhun/articles/visactor/img/KXsCbe7XYo0puWxn3oGczfXInbc.gif) + +# Claim an Issue + +If you want to write or modify documentation, you can leave a message under the issue to claim it. An administrator will contact you, confirm, and then assign the issue to you. + +For example: + +![Claim an Issue](https://cdn.jsdelivr.net/gh/xuanhun/articles/visactor/img/V9UTb3w08oJcj6xUSUKc32gTnrh.gif) + +# Create or Modify Documentation + +The location of VRender documentation and demos in the project is as follows: + +![VRender Directory Structure](https://lf9-dp-fe-cms-tos.byteorg.com/obj/bit-cloud/vrender/vrender-dir.png) + +Currently, the types of documentation are as follows: + +- examples: Element examples, corresponding to the site: + +https://www.visactor.io/vrender/example + +- guide: Tutorials, corresponding to the site: https://www.visactor.io/vrender/guide/asd/VRender_Website_Guide + +Find the corresponding location of the documentation for additions or modifications. It is important to note that some documentation also requires maintenance of the "menu.json" file. + +![Maintain menu.json File](https://cdn.jsdelivr.net/gh/xuanhun/articles/visactor/img/TxwTb83S5oOnqMx5VI7cqzjXnkg.gif) + +This file corresponds to the final display location and name of the documentation on the site. For example: + +![Example of menu.json File](https://cdn.jsdelivr.net/gh/xuanhun/articles/visactor/img/L6WpbXlFEo15F4xSIsMch9YTnof.gif) + +# Use Marscode AI Programming Assistant for Documentation Writing + +[Marscode AI Programming Assistant](https://www.marscode.cn/home?utm_source=developer&utm_medium=oss&utm_campaign=visactor_a) can provide comprehensive assistance throughout the documentation creation process. + +If you have not installed [Marscode AI Programming Assistant](https://www.marscode.cn/home?utm_source=developer&utm_medium=oss&utm_campaign=visactor_a) yet, please download it from this link: https://www.marscode.cn/home?utm_source=developer&utm_medium=oss&utm_campaign=visactor_a + +In documentation writing, using the context command appropriately can enhance the accuracy of the content. + +`**⭐️ #Workspace**` + +Select global code in Workspace as context, and AI will automatically find relevant code context based on your query. + +![Use Workspace for Context](https://cdn.jsdelivr.net/gh/xuanhun/articles/visactor/img/WiikbC26FovfN8xiDrkc5jDGn4b.gif) + +`**⭐️ #Files**` + +Search and select files in the code repository as context. + +![Use Files for Context](https://cdn.jsdelivr.net/gh/xuanhun/articles/visactor/img/OG15bVGdAoghaux6QlUckffVnfg.gif) + +`**⭐️ #Code**` + +Search and select functions or classes in the code repository as context. + +![Use Code for Context](https://cdn.jsdelivr.net/gh/xuanhun/articles/visactor/img/BEaXbdXyUoik0WxoWqHcz0A6nCg.gif) + +Here are examples of how to use [Marscode AI Programming Assistant](https://www.marscode.cn/home?utm_source=developer&utm_medium=oss&utm_campaign=visactor_a) for documentation writing. + +## 5.1 Provide Documentation Writing Ideas + +Here, **invoke #Workspace** and ask for help in generating an outline for developer documentation. + +![Generate Documentation Outline](https://cdn.jsdelivr.net/gh/xuanhun/articles/visactor/img/GnctbsyzWo6OBFxLFFNcjXh9n22.gif) + +## 5.2 Generate Project Structure Explanation + +Here, **invoke #Workspace** and ask for help in generating a document explaining the project structure. + +![Generate Project Structure Explanation](https://cdn.jsdelivr.net/gh/xuanhun/articles/visactor/img/RI9sb17ygoL2JMxwpqrcDLD3nVh.gif) + +You can further inquire about subfolders for more detailed explanations. + +![Inquire About Subfolders](https://cdn.jsdelivr.net/gh/xuanhun/articles/visactor/img/Za3MbDf4FoEnQKx5vUUcpB34nZg.gif) + +## 5.3 Generate File or Code Explanations + +### 5.3.1 Generate Code Explanations + +When selecting a piece of code in a file, you can choose the Explain command from the floating menu, and [Marscode](https://www.marscode.cn/home?utm_source=developer&utm_medium=oss&utm_campaign=visactor_a) will generate a detailed code explanation. You can then review and adapt it as needed. + +![Generate Code Explanation](https://cdn.jsdelivr.net/gh/xuanhun/articles/visactor/img/BQurb7A6fo7UVJxxuqHcSLIdnzc.gif) + +You can also directly input the Explain command in the dialog box. + +![Directly Input Explain Command](https://cdn.jsdelivr.net/gh/xuanhun/articles/visactor/img/FtYLb95EEoCXGOx835tc3X2Zn7g.gif) + +You can also use the #Code context mentioned earlier to combine Explain with your instructions for more detailed tasks. + +### 5.3.2 Generate File-Specific Explanations + +Explain can be used in conjunction with Context or Files commands to generate explanations for the entire file. + +![Generate File Explanation](https://cdn.jsdelivr.net/gh/xuanhun/articles/visactor/img/HoqGbdBxyolQodx2uhdcquven0g.gif) + +## 5.4 Generate Sample Code + +To better explain principles and usage, it is often necessary to provide runnable demos. You can use the code generation capabilities of [Marscode](https://www.marscode.cn/home?utm_source=developer&utm_medium=oss&utm_campaign=visactor_a) to generate sample code. However, it is important to verify the accuracy of the generated code as AI-generated code may not always be precise. + +## 5.5 Content Retrieval + +Typically, each Q&A session with [Marscode](https://www.marscode.cn/home?utm_source=developer&utm_medium=oss&utm_campaign=visactor_a) will provide reference documents that can offer more context for further analysis. + +![Retrieve Content](https://cdn.jsdelivr.net/gh/xuanhun/articles/visactor/img/QMD7b5mQgoyNYtxNK5jcNTL4n7c.gif) + +You can also directly search for files: + +![Search for Files](https://cdn.jsdelivr.net/gh/xuanhun/articles/visactor/img/ZBPmb7fn5oK3DAxLQAxcBP1An5d.gif) + +## 5.6 Translate Documentation + +VisActor's documentation needs to be provided in both Chinese and English, and Marscode can assist with translation. + +# Commit Code + +After completing the documentation, push the code to your remote branch. For example: + +``` +git commit -a -m "docs: add custom funnel demo and related docs" +``` + +VisActor's commit messages follow the [Conventional Commits](https://www.conventionalcommits.org/en/v1.0.0/) specification: + +`[optional scope]: ` + +Common `type` values include docs (documentation, log changes), feat (new feature), fix (bug fix), refactor (code refactoring), etc. Please choose accordingly based on the actual situation. + +Before submitting the commit, we will perform commit lint checks. You can refer to the [check rules](https://github.com/VisActor/VRender/blob/develop/common/autoinstallers/lint/commitlint.config.js) for more details. + +A common issue is when the upstream (@visactor/vrender) has new updates, which may cause conflicts when submitting a Pull Request. Therefore, before submitting, merge the commits from other developers with your own. Switch to the develop branch using the following code: + +``` +git checkout develop +``` + +Pull the latest code from the remote: + +``` +git pull upstream develop +``` + +Switch back to your development branch: + +``` +git checkout docs/add-funnel-demo +``` + +Merge the commits from develop into your branch: + +``` +git rebase develop +``` + +Push the updated code to your branch: + +``` +git push origin docs/add-funnel-demo +``` + +# Submit a PR + +You can click on the `Compare & pull request` button on your GitHub repository page. + +![Create a Pull Request](https://cdn.jsdelivr.net/gh/xuanhun/articles/visactor/img/S8hebTyczoKfg7x4ZTncy8uenX9.gif) + +Or create one through the `contribute` button: + +Fill in the modifications for this submission using the template: + +- Check the type of modification + +![Select Modification Type](https://cdn.jsdelivr.net/gh/xuanhun/articles/visactor/img/J9z9biTukokoJBx846zcIOVqnsh.gif) + +- Fill in the associated issue + +![Fill in Associated Issue](https://cdn.jsdelivr.net/gh/xuanhun/articles/visactor/img/Oxl7bkBuEoHdssxxfRHc11IAnsg.gif) + +- If there are complex changes, explain the background and solution + +![Explain Background and Solution](https://cdn.jsdelivr.net/gh/xuanhun/articles/visactor/img/RUeebaBA8oGMZNxWdi1cstXWn1d.gif) + +After filling in the relevant information, click on Create pull request to submit. + +An administrator will review the PR and decide whether to approve it. If not approved, modifications will be required before resubmitting. + +# Next Steps + +Different types of documentation have specific requirements for demo documentation, which can be found in the "How to Contribute to Demos" section. + +You can continue to explore different types of tasks. + +GitHub: [github.com/VisActor](https://link.juejin.cn/?target=https%3A%2F%2Fgithub.com%2FVisActor) + +VisActor WeChat subscription account (join the WeChat group through the subscription account menu): + +![VisActor WeChat Subscription Account](https://cdn.jsdelivr.net/gh/xuanhun/articles/visactor/img/Cj40bjDrxoEDnZxrBl4cEfs9nyc.gif) + +VisActor Official Website: [www.visactor.io/](https://link.juejin.cn/?target=https%3A%2F%2Fwww.visactor.io%2Fvtable) + +Feishu Group: + +![Feishu Group](https://cdn.jsdelivr.net/gh/xuanhun/articles/visactor/img/VeKlb1t5sogCmExPAFmcbtmgndb.gif) + +Discord: https://discord.com/invite/3wPyxVyH6m + +# Contributors to this Documentation + +[玄魂](https://github.com/xuanhun) diff --git a/docs/assets/contributing/en/4-How to Contribute to a Demo.md b/docs/assets/contributing/en/4-How to Contribute to a Demo.md new file mode 100644 index 000000000..c34ba953a --- /dev/null +++ b/docs/assets/contributing/en/4-How to Contribute to a Demo.md @@ -0,0 +1,240 @@ +--- +title: 4. How to Contribute Demo + +key words: VisActor, VChart, VTable, VStory, VMind, VGrammar, VRender, Visualization, Chart, Data, Table, Graph, Gis, LLM +--- + +# Create a Branch + +The default branch for VRender is the `develop` branch. Whether it's for feature development, bug fixes, or documentation writing, please create a new branch and then merge it into the `develop` branch. Use the following code to create a branch: + +``` +// Create a branch for documentation and demo +git checkout -b docs/add-funnel-demo +``` + +# Find or Create an Issue + +In principle, we require that each PR has a corresponding issue. Before starting development, please make sure there is a corresponding issue that has not been claimed. + +## Search for Demo Issues + +You can search for demo-related issues using the following method: + +``` +label:demos +``` + +![Search Demo Issues](https://cdn.jsdelivr.net/gh/xuanhun/articles/visactor/img/RDQZbKyEYomaIRx7jwJccGoMnId.gif) + +Some features may be associated with the `doc` label, so you can further check if the issue is purely a demo task. + +## Create a Demo Issue + +Click on "NEW ISSUE", open the issue selection page, and choose "**Others**". + +![Create Demo Issue](https://cdn.jsdelivr.net/gh/xuanhun/articles/visactor/img/VNGhbVirmoaQTIxhOlFc61w3nqb.gif) + +Fill in the relevant information for the document issue you want to submit, and tag it with the "demos" label. + +![Fill in Demo Issue](https://cdn.jsdelivr.net/gh/xuanhun/articles/visactor/img/Cc8SbSAFFoCvQ2xJFd6cjv17nyc.gif) + +# Claim the Issue + +If you want to submit a demo or fix a demo bug, you can leave a message under that issue to claim it. The administrator will contact you, confirm, and then assign the issue to you. + +For example: + +![Claim Issue](https://cdn.jsdelivr.net/gh/xuanhun/articles/visactor/img/Q2vGbhmevorebJxa8Toc1hmtnMc.gif) + +# Create or Modify Demo + +The location of VRender documentation and demos in the project is as follows (examples): + +![VRender Examples Location](https://cdn.jsdelivr.net/gh/xiaoluoHe/articles/visactor/img/SCR-20241202-oujh.png) + +Taking the example document of `basic-arc` as an example (currently one example contains both Chinese and English versions, located in the `zh` & `en` paths): + +![Example Markdown Content](https://lf9-dp-fe-cms-tos.byteorg.com/obj/bit-cloud/vrender/vrender-contributing-basic-arc.png) + +The example Markdown content is divided into several parts: + +- Metadata: Defines the attributes of the example content, including chart category, cover image, keywords, etc. +- Title: The content under the first-level title corresponds to the description of the example. +- Key Configurations: Key configuration explanations included in the example, which will be displayed in the "Key Configurations" section on the example page. +- Code Demo: The specific code content executed in the example, currently only supports native JavaScript code. + +```js +// Code example +``` + +The fields defined in the metadata of Markdown are: + +- group: The classification information of the example, describing which chart category the current example belongs to. +- title: The title of the example. +- keywords: Keywords of the example. +- order: The sorting basis of the example under the same group. +- cover: The cover image of the example. +- tutorial: Link to the tutorial (the default example tutorial will jump to the tutorial corresponding to the example group). + +Currently, the group of the chart example contains multiple categories, such as `graphic-arc`, `graphic-area`, etc., corresponding to the categories under all charts in the VRender example gallery. You can refer to existing example documents to fill in the specific category fields. + +![Example Categories](https://lf9-dp-fe-cms-tos.byteorg.com/obj/bit-cloud/vrender/vrender-contributing-examples-page.png) + +After completing the new demo writing, you can add the demo path and title to the `docs/assets/examples/menu.json` file: + +![Add Demo Path and Title](https://cdn.jsdelivr.net/gh/xiaoluoHe/articles/visactor/img/SCR-20241202-skwm.png) + +> For image resources that need to be uploaded during demo creation, please refer to the chapter [6. How to upload image resources](./6-How%20to%20upload%20image). + +# Use Marscode AI Programming Assistant for Demo Writing + +With the help of the [Marscode AI Programming Assistant](https://www.marscode.cn/home?utm_source=developer&utm_medium=oss&utm_campaign=visactor_a), you can provide comprehensive assistance throughout the document creation process. + +If you haven't installed the [Marscode AI Programming Assistant](https://www.marscode.cn/home?utm_source=developer&utm_medium=oss&utm_campaign=visactor_a) yet, please download it from this link: [Download Marscode AI Programming Assistant](https://www.marscode.cn/home?utm_source=developer&utm_medium=oss&utm_campaign=visactor_a) + +In demo writing, using context commands appropriately can improve the accuracy of the content. + +`**⭐️ #Workspace**` + +Select global code in Workspace as context, and AI will automatically find relevant code context based on your query. + +![Workspace Context](https://cdn.jsdelivr.net/gh/xuanhun/articles/visactor/img/XQaqbAX59oLBKOxR7ngctRbQnXb.gif) + +`**⭐️ #Files**` + +Search and select files in the code repository as context. + +![Files Context](https://cdn.jsdelivr.net/gh/xuanhun/articles/visactor/img/MhZTbAAD2oj1XJxil8WcHYSWn6d.gif) + +`**⭐️ #Code**` + +Search and select functions or classes in the code repository as context. + +![Code Context](https://cdn.jsdelivr.net/gh/xuanhun/articles/visactor/img/V4M7bX87hoHOxOxM1Nfc9of0nhL.gif) + +Here are examples of how to use the [Marscode AI Programming Assistant](https://www.marscode.cn/home?utm_source=developer&utm_medium=oss&utm_campaign=visactor_a) for demo writing. + +## 5.1 Provide Document Framework + +Here **invoke #Workspace**, then ask a question, select the content of an example document, and request it to generate a new example document based on that. + +![Provide Document Framework](https://cdn.jsdelivr.net/gh/xuanhun/articles/visactor/img/TUHVbTez5o6IjtxmCLhcWnGHnZg.gif) + +You can continue to adjust the details based on this generated framework. + +## 5.2 Generate Descriptive Text + +The descriptive text for each demo can be generated first using [Marscode](https://www.marscode.cn/home?utm_source=developer&utm_medium=oss&utm_campaign=visactor_a), and then proofread and adjusted. For example: + +![Generate Descriptive Text](https://cdn.jsdelivr.net/gh/xuanhun/articles/visactor/img/U6n7bEo0DoaCGyxtiVVc1GBGnrg.gif) + +## 5.3 Generate Example Code + +To better explain the principles and usage, it is usually necessary to provide a demo that can be actually run. You can use the code generation capability of [Marscode](https://www.marscode.cn/home?utm_source=developer&utm_medium=oss&utm_campaign=visactor_a) to generate example code for us. However, the code generation capabilities of various AIs cannot guarantee accuracy, so further verification is needed. + +## 5.4 Content Retrieval + +Usually, each of our Q&A in [Marscode](https://www.marscode.cn/home?utm_source=developer&utm_medium=oss&utm_campaign=visactor_a) will provide reference documents, which can provide more context for further analysis. + +![Content Retrieval](https://cdn.jsdelivr.net/gh/xuanhun/articles/visactor/img/DGyBbfi99oucAYxxkyJcfka3nJa.gif) + +You can also directly search for files: + +![File Search](https://cdn.jsdelivr.net/gh/xuanhun/articles/visactor/img/WM9Ubr9JYoYAjOxFQ6tc8cW3nLd.gif) + +# Submit Code + +After completing the document, push the code to your remote branch. For example: + +``` +git commit -a -m "docs: add custom funnel demo and related docs" +``` + +VisActor's commit messages follow the [Conventional Commits](https://www.conventionalcommits.org/en/v1.0.0/) specification, with **docs used for demos**. + +`[optional scope]: ` + +Common `type` values include docs (documentation, log changes), feat (new feature), fix (bug fix), refactor (code refactoring), etc. Please choose according to the actual situation. + +Write a concise and accurate description in English before committing. + +Before submitting the commit, we will perform a commit lint check. You can check the [lint rules](https://github.com/VisActor/VRender/blob/develop/common/autoinstallers/lint/commitlint.config.js) for more details. + +A common issue is that the remote upstream (@visactor/vrender) has been updated, which may cause conflicts when submitting a Pull Request. Therefore, you can merge the commits from other developers and your commits before submitting the PR. Switch to the `develop` branch using the following code: + +``` +git checkout develop +``` + +Pull the latest code from the remote: + +``` +git pull upstream develop +``` + +Switch back to your development branch: + +``` +git checkout docs/add-funnel-demo +``` + +Merge the commits from `develop` into your branch: + +``` +git rebase develop +``` + +Push the updated code to your branch: + +``` +git push origin docs/add-funnel-demo +``` + +# Submit PR + +You can click on the `Compare & pull request` button on your GitHub repository page. + +![Compare & Pull Request](https://cdn.jsdelivr.net/gh/xuanhun/articles/visactor/img/FWm3bZjbnoaqUOxiygXcFdLznwf.gif) + +Or create one through the `contribute` button: + +Fill in the modifications for this submission according to the template: + +- Check the type of modification + +![Select Modification Type](https://cdn.jsdelivr.net/gh/xuanhun/articles/visactor/img/V7xpbJhhEoSoCExC31WcyKvHnDe.gif) + +- Fill in the associated issue + +![Fill in Associated Issue](https://cdn.jsdelivr.net/gh/xuanhun/articles/visactor/img/O6YqbpdxgodBjfxHXEpcwob4n5E.gif) + +- If there are complex changes, explain the background and solution + +![Explain Changes](https://cdn.jsdelivr.net/gh/xuanhun/articles/visactor/img/QsnYbfLCio4u3MxK2uIc8epKnXh.gif) + +After filling in the relevant information, click on Create pull request to submit. + +The administrator will review the PR and decide whether to approve it. If it is not approved, you will need to make modifications and resubmit. + +# Next Steps + +You can continue to try different types of tasks. + +GitHub: [github.com/VisActor](https://link.juejin.cn/?target=https%3A%2F%2Fgithub.com%2FVisActor) + +VisActor WeChat subscription account (you can join the WeChat group through the subscription account menu): + +![VisActor WeChat](https://cdn.jsdelivr.net/gh/xuanhun/articles/visactor/img/I8OdbhGfkort6oxqHW6cR492n7d.gif) + +VisActor Official Website: [www.visactor.io/](https://link.juejin.cn/?target=https%3A%2F%2Fwww.visactor.io%2Fvtable) + +Feishu Group: + +![Feishu Group](https://cdn.jsdelivr.net/gh/xuanhun/articles/visactor/img/DdEAbEU9yoFq9IxjrN4curJnnyf.gif) + +Discord: [Join Discord](https://discord.com/invite/3wPyxVyH6m) + +# This Document is Contributed by the Following Individuals + +[玄魂](https://github.com/xuanhun) diff --git a/docs/assets/contributing/en/5-How to Contribute Code.md b/docs/assets/contributing/en/5-How to Contribute Code.md new file mode 100644 index 000000000..3bb35c0b3 --- /dev/null +++ b/docs/assets/contributing/en/5-How to Contribute Code.md @@ -0,0 +1,244 @@ +--- +title: 5. How to Contribute Code + +key words: VisActor, VChart, VTable, VStory, VMind, VGrammar, VRender, Visualization, Chart, Data, Table, Graph, Gis, LLM +--- + +# Create a Branch + +The default branch for VRender is the develop branch. Whether it's for feature development, bug fixes, or documentation writing, please create a new branch and then merge it into the develop branch. Use the following code to create a branch: + +``` +// Create a branch for documentation and demo +git checkout -b docs/add-funnel-demo +``` + +# Find or Create an Issue + +In principle, we require that every PR has a corresponding issue. Before starting development, please make sure there is a corresponding issue that has not been claimed. + +## Search for an Issue + +You can search for bug or feature-related issues in the following ways: + + + +## Create a Code-Related Issue + +Click on "NEW ISSUE" to open the issue selection page, then choose either "Bug Report" or "Feature Request". + + + +Fill in the relevant information for the documentation issue and add appropriate tags. + + + +# Claim an Issue + +If you want to contribute code, you can leave a message under the issue to claim it. An administrator will contact you, confirm, and then assign the issue to you. + +For example: + + + +# Write Code + +All components in the VRender ecosystem are located in the same directory, divided by package names. Developers need to develop code on their own code branch and then commit it. + +# Use Marscode AI Programming Assistant for Code Writing + +By using the [Marscode AI Programming Assistant](https://www.marscode.cn/home?utm_source=developer&utm_medium=oss&utm_campaign=visactor_a), you can receive comprehensive assistance throughout the code writing process. + +If you haven't installed the [Marscode AI Programming Assistant](https://www.marscode.cn/home?utm_source=developer&utm_medium=oss&utm_campaign=visactor_a) yet, please download it from this link: https://www.marscode.cn/home?utm_source=developer&utm_medium=oss&utm_campaign=visactor_a + +During code writing, using the context command appropriately can enhance the accuracy of the content. + +`**⭐️ #Workspace**` + +Select global code in Workspace as context, and AI will automatically find relevant code context based on your query. + + + +`**⭐️ #Files**` + +Search and select files in the code repository as context. + + + +`**⭐️ #Code**` + +Search and select functions or classes in the code repository as context. + + + +The following examples demonstrate how to use the [Marscode AI Programming Assistant](https://www.marscode.cn/home?utm_source=developer&utm_medium=oss&utm_campaign=visactor_a) for code writing. + +## 5.1 Quickly Familiarize Yourself with the Entire Repository + +Here, **use #Workspace to invoke it**, then ask it to generate a project structure explanation document. + + + +You can also ask further questions about subfolders. + + + +## 5.2 Explain Code + +### 5.2.1 Generate Code Explanations + +When selecting a piece of code in a file, you can choose the Explain command from the floating menu, and [Marscode](https://www.marscode.cn/home?utm_source=developer&utm_medium=oss&utm_campaign=visactor_a) will generate detailed code explanations for you. You can then review and modify based on this. + + + +You can also directly input the Explain command in the dialog box. + + + +You can also use the #Code context mentioned above to combine Explain with your instructions for more detailed tasks. + +### 5.2.2 Generate Explanations for the Entire File + +Explain can be used in conjunction with Context or Files commands to generate explanations for the entire file. + + + +## 5.3 Content Retrieval + +Usually, each Q&A session with [Marscode](https://www.marscode.cn/home?utm_source=developer&utm_medium=oss&utm_campaign=visactor_a) will provide reference documents, which can provide more context for further analysis. + + + +You can also directly search for files: + + + +## 5.4 Code Generation + +In daily coding, you may often encounter scenarios where you need to use repetitive code, and sometimes you may not know if a certain function for a feature is already implemented. In such cases, use `#Workspace` to ask questions. For example: + + + +## 5.5 Add Comments + +Use the "/doc" command to generate code comments. + + + +## 5.6 Generate Unit Tests + +VRender unit test code is located in the "**tests**" directory of each package. + + + +You can quickly generate unit test code using the "/test" command in [Marscode](https://www.marscode.cn/home?utm_source=developer&utm_medium=oss&utm_campaign=visactor_a). + + + +## 5.7 Intelligent Suggestions + +During the writing process, intelligent code suggestions are a standard feature of the programming assistant. Feel free to experience it yourself. + +# Commit Code + +After completing the documentation, push the code to your remote branch. For example: + +``` +git commit -a -m "docs: add custom funnel demo and related docs" + +``` + +VisActor's commit messages follow the [Conventional Commits](https://www.conventionalcommits.org/en/v1.0.0/) specification, with **docs used for demos**. + +`[optional scope]: ` + +Common `type` values include docs (documentation, log changes), feat (new feature), fix (bug fix), refactor (code refactoring), etc. Please choose according to the actual situation. + +Write a short and precise description in English. + +Before submitting the commit, we will perform a commit lint check. You can check the specific rules [here](https://github.com/VisActor/VStory/blob/develop/common/autoinstallers/lint/commitlint.config.js). + +A common issue is when the upstream (@visactor/vstroy) has new updates, which may cause conflicts when submitting a Pull Request. Therefore, before submitting, merge the commits from other developers with your own commits. Use the following code to switch to the develop branch: + +``` +git checkout develop + +``` + +Pull the latest code from the remote: + +``` +git pull upstream develop + +``` + +Switch back to your development branch: + +``` +git checkout docs/add-funnel-demo + +``` + +Merge the commits from develop into your branch: + +``` +git rebase develop + +``` + +Push the updated code to your branch: + +``` +git push origin docs/add-funnel-demo + +``` + +# Submit a PR + +You can click on the `Compare & pull request` button on your GitHub repository page. + + + +Or create one through the `contribute` button: + +Fill in the modifications for this submission according to the template: + +- Check the type of modification + + + +- Fill in the associated issue + + + +- If there are complex changes, explain the background and solution + + + +After filling in the relevant information, click on Create pull request to submit. + +An administrator will review the PR and decide whether to approve it. If it is not approved, you will need to make modifications and resubmit. + +# Next Steps + +Next, you can read about the implementation principles and source code explanations for each module, or join in contributing to these documents. + +Join the VisActor family and contribute your efforts! + +GitHub: [github.com/VisActor](https://link.juejin.cn/?target=https%3A%2F%2Fgithub.com%2FVisActor) + +VisActor WeChat Subscription Account (you can join the WeChat group through the subscription account menu): + + + +VisActor Official Website: [www.visactor.io/](https://link.juejin.cn/?target=https%3A%2F%2Fwww.visactor.io%2Fvtable) + +Feishu Group: + + + +Discord: https://discord.com/invite/3wPyxVyH6m + +# This Document is Contributed by the Following Individuals + +[玄魂](https://github.com/xuanhun) diff --git a/docs/assets/contributing/en/6-How to upload image.md b/docs/assets/contributing/en/6-How to upload image.md new file mode 100644 index 000000000..b04cc83bc --- /dev/null +++ b/docs/assets/contributing/en/6-How to upload image.md @@ -0,0 +1,39 @@ +# How to Upload Images +Images are often used in tutorial documents to provide visual explanations. +We recommend using a stable image hosting service to upload images. Here, we introduce the solution of using cdn.jsdelivr.net as an image hosting service. + +## 6.1 Upload Images +First, create a folder in your personal GitHub repository to store the images used in the document. +For example, the directory https://github.com/xuanhun/articles/tree/main/visactor/img contains a large number of images. Taking the image A3gybJqQLo7vH8xV8I3cA7NknRc.gif as an example, the corresponding GitHub URL is: +https://github.com/xuanhun/articles/blob/main/visactor/img/A3gybJqQLo7vH8xV8I3cA7NknRc.gif. + +In the specific markdown document, we convert it to the cdn.jsdelivr.net URL: + +https://cdn.jsdelivr.net/gh/[username]/[repo name]/[image path] + +![Example Image](https://cdn.jsdelivr.net/gh/xuanhun/articles/visactor/img/A3gybJqQLo7vH8xV8I3cA7NknRc.gif) + +# Next Steps + +You can now read the implementation principles and source code explanations of each module, or join in contributing to these documents. + +Join the VisActor family and contribute your efforts! + +GitHub: [github.com/VisActor](https://link.juejin.cn/?target=https%3A%2F%2Fgithub.com%2FVisActor) + +VisActor WeChat Subscription Account (you can join the WeChat group through the subscription account menu): + + + +VisActor Official Website: [www.visactor.io/](https://link.juejin.cn/?target=https%3A%2F%2Fwww.visactor.io%2Fvtable) + +Feishu Group: + + + +Discord: https://discord.com/invite/3wPyxVyH6m + + +# This document is contributed by the following individuals + +[玄魂](https://github.com/xuanhun) diff --git a/docs/assets/contributing/menu.json b/docs/assets/contributing/menu.json new file mode 100644 index 000000000..e72fc80b0 --- /dev/null +++ b/docs/assets/contributing/menu.json @@ -0,0 +1,47 @@ +{ + "menu": "contributing", + "children": [ + { + "path": "1-Setting-Up-the-Development-Environment", + "title": { + "zh": "1.搭建开发环境", + "en": "1-Setting-Up-the-Development-Environment" + } + }, + { + "path": "2-Howto Submit an Issue", + "title": { + "zh": "2.如何提issue", + "en": "2-Howto Submit an Issue" + } + }, + { + "path": "3-How to Contribute Documentation", + "title": { + "zh": "3.如何贡献文档", + "en": "3-How to Contribute Documentation" + } + }, + { + "path": "4-How to Contribute to a Demo", + "title": { + "zh": "4.如何贡献demo", + "en": "4-How to Contribute to a Demo" + } + }, + { + "path": "5-How to Contribute Code", + "title": { + "zh": "5.如何贡献代码", + "en": "5-How to Contribute Code" + } + }, + { + "path": "6-How to upload image", + "title": { + "zh": "6.如何上传图片资源", + "en": "6-How to upload image" + } + } + ] +} diff --git a/docs/assets/contributing/zh/1-Setting-Up-the-Development-Environment.md b/docs/assets/contributing/zh/1-Setting-Up-the-Development-Environment.md new file mode 100644 index 000000000..952623521 --- /dev/null +++ b/docs/assets/contributing/zh/1-Setting-Up-the-Development-Environment.md @@ -0,0 +1,122 @@ +--- +title: 1.搭建开发环境 + +key words: VisActor,VChart,VTable,VStory,VMind,VGrammar,VRender,Visualization,Chart,Data,Table,Graph,Gis,LLM +--- + +# Github + +## 1.1 注册账号 + +VisActor 团队通常在 github 上进行开发和 issue 维护，请打开 [Github 网站](https://github.com/)，点击右上角 `Sign up` 按钮，注册一个自己的账号，开启你开源之旅的第一步。 + +如果因为特殊情况，你无法打开 Github 站点，请告知我们并通过 [Gitee](https://gitee.com/VisActor/VRender) 进行项目开发。 + +## 1.2 Fork 项目 + +首先需要 fork 这个项目，进入[VRender 项目页面](https://github.com/VisActor/VRender)，点击右上角的 Fork 按钮 + + + +你的 github 帐号中会出现 xxxx(你的 github 用户名)/vrender 这个项目 + + + +# 本地开发环境 + +## 2.1 安装 git + +由于代码托管在 github 上，我们使用 git 做版本控制。 + +Git 是一种版本控制系统，用于跟踪和管理软件开发项目中的代码变更。它帮助开发者记录和管理代码的历史记录，方便团队协作、代码版本控制、合并代码等操作。通过 Git，您可以追踪每个文件的每个版本，并轻松地在不同版本之间进行切换和比较。Git 还提供了分支管理功能，使得可以同时进行多个并行开发任务。 + +- 访问 Git 官方网站：[https://git-scm.com/](https://git-scm.com/) + +- 下载最新版本的 Git 安装程序。 + +- 运行下载的安装程序，按照安装向导的提示进行安装。 + +- 安装完成后，你可以通过命令行使用 `git version` 命令确认安装成功。 + +``` +git version +**git version 2.39.2 (Apple Git-143)** + +``` + +## 2.2 安装开发工具（推荐 VSCode） + +VisActor 整体上属于前端技术栈，能进行前端开发的工具很多，我们推荐使用 VScode。当然，你也可以使用你喜欢的开发工具。 + +如果你对 VSCode 不是很熟悉的话，建议阅读官方文档：https://vscode.js.cn/docs/setup/setup-overview + +## 2.3 安装 豆包 Marscode AI 编程助手 + +[Marscode AI 编程助手](https://www.marscode.cn/home?utm_source=developer&utm_medium=oss&utm_campaign=visactor_a) + +豆包 MarsCode 编程助手是豆包旗下的 AI 编程助手，提供以智能代码补全为代表的 AI 功能。它支持主流的编程语言和 IDE，在开发过程中提供单行代码或整个函数的编写建议。此外，它还支持代码解释、单测生成和问题修复等功能，提高了开发效率和质量。 更多信息，请参考[豆包 MarsCode 编程助手的文档](https://www.marscode.cn/home?utm_source=developer&utm_medium=oss&utm_campaign=visactor_a)。 + + + +借助 Marscode，VisActor 开发者可以更方便的进行代码理解、文档撰写、功能开发、单元测试等多项任务。在详细的各项任务贡献指南中，会有更详细的案例说明。 + + + +## 2.4 Clone 代码到本地 + +进入 VRender 文件夹，添加 VRender 的远程地址 + +``` +git remote add upstream https://github.com/VisActor/VRender.git + +``` + +获取 VRender 最新源码 + +``` +git pull upstream develop + +``` + +# 初始化项目 + +首先，全局安装 [@microsoft/rush](https://rushjs.io/pages/intro/get_started/) + +``` +$ npm i --global @microsoft/rush + +``` + +接下来执行命令查看 demo + +``` +# 安装依赖 +$ rush update +# 启动 vrender 的 demo 页 +$ rush run -p @visactor/vrender -s start +# 启动本地文档站点 +$ rush docs + +``` + +# 下一步 + +到目前为止，你已经做好了开发代码的准备了。接下来请继续阅读下一节教程，开始不同类型的任务。 + +github ：[github.com/VisActor](https://link.juejin.cn/?target=https%3A%2F%2Fgithub.com%2FVisActor) + +VisActor 微信订阅号留言（可以通过订阅号菜单加入微信群）： + + + +VisActor 官网：[www.visactor.io/](https://link.juejin.cn/?target=https%3A%2F%2Fwww.visactor.io%2Fvtable) + +飞书群： + + + +discord：https://discord.com/invite/3wPyxVyH6m + +# 本文档由由以下人员贡献 + +[玄魂](https://github.com/xuanhun) diff --git a/docs/assets/contributing/zh/2-Howto Submit an Issue.md b/docs/assets/contributing/zh/2-Howto Submit an Issue.md new file mode 100644 index 000000000..872434370 --- /dev/null +++ b/docs/assets/contributing/zh/2-Howto Submit an Issue.md @@ -0,0 +1,61 @@ +--- +title: 2.如何提issue + +key words: VisActor,VChart,VTable,VStory,VMind,VGrammar,VRender,Visualization,Chart,Data,Table,Graph,Gis,LLM +--- + +每个项目的 issues 栏目下面，可以进行 issue 的创建、搜索等工作。 + +比如 VRender issues：https://github.com/VisActor/VRender/issues + + + +# 确定是否存在同样的 issue + +可以通过搜索过滤，查看 issue 细节的方式确定是否已经存在相同的 issue。 + +# 创建 issue + +如果没有找到类似的 issue，你可以点击"New issue"按钮。 + + + +以“**Documentation Request”，**点击“Get Start”按钮，**填写 issue 表单。** + + + +# **提交 issue** + +填写完 issue 表单后，点击"Submit new issue"按钮提交你的 issue。 + +# **跟进 issue** + +提交 issue 后，你可以在仓库的"Issues"选项卡中查看你的 issue 状态。项目开发者可能会要求你提供更多的信息或者告诉你他们正在处理这个 issue。 + +# **关闭 issue** + +如果你的问题得到了解决或者你的需求得到了满足，项目开发者会关闭这个 issue。你也可以自己关闭 issue，如果你认为问题已经解决或者不再需要进一步的帮助。 + +通过以上步骤，你可以在 GitHub 上成功地为开源项目提 issue。记得在描述问题时尽量详细和清晰，这样有助于项目开发者更快地理解和解决你的问题。 + +# 下一步 + +到目前为止，你已经熟悉了 issue 的概念。接下来请继续阅读下一节教程，开始不同类型的任务。 + +github ：[github.com/VisActor](https://link.juejin.cn/?target=https%3A%2F%2Fgithub.com%2FVisActor) + +VisActor 微信订阅号留言（可以通过订阅号菜单加入微信群）： + + + +VisActor 官网：[www.visactor.io/](https://link.juejin.cn/?target=https%3A%2F%2Fwww.visactor.io%2Fvtable) + +飞书群： + + + +discord：https://discord.com/invite/3wPyxVyH6m + +# 本文档由由以下人员贡献 + +[玄魂](https://github.com/xuanhun) diff --git a/docs/assets/contributing/zh/3-How to Contribute Documentation.md b/docs/assets/contributing/zh/3-How to Contribute Documentation.md new file mode 100644 index 000000000..7c185184e --- /dev/null +++ b/docs/assets/contributing/zh/3-How to Contribute Documentation.md @@ -0,0 +1,259 @@ +--- +title: 3.如何贡献文档 + +key words: VisActor,VChart,VTable,VStory,VMind,VGrammar,VRender,Visualization,Chart,Data,Table,Graph,Gis,LLM +--- + +# 创建分支 + +VRender 默认分支为 develop 分支。无论是功能开发、bug 修复、文档编写，都请新建立一个分支，再合并到 develop 分支上。使用以下代码创建分支： + +``` +// 创建文档、demo分支 +git checkout -b docs/add-funnel-demo +``` + +# 寻找或者创建 issue + +原则上，我们规定每一个 pr 都要有对应的 issue。在开始开发之前，请确认是否有对应的 issue，且 issue 没有被认领。 + +## 搜索文档 issue + +可以通过如下方式搜索文档相关的 issue： + +``` +is:open label:docs + +``` + + + +其中他有些 feature 会关联 doc 标签，可以进一步看一下该 issue 是不是纯文档任务。 + +## 创建文档 issue + +点击 “NEW ISSUE”，打开 issue 选择页面，选择“**Documentation Request”。** + + + +填写你要提交的文档 issue 相关信息即可。 + + + +# 认领 issue + +如果你想撰写文档或者修改文档 bug，可以在该 issue 下留言认领。管理员会联系你，确认后将 issue assign 给你。 + +例如： + + + +# 创建或者修改文档 + +VRender 文档和 demo 在项目的中的位置如下： + + + +目前文档类型如下： + +- examples：图元示例，对应站点: + +https://www.visactor.io/vrender/example + +- guide：教程，对应站点：https://www.visactor.io/vrender/guide/asd/VRender_Website_Guide + +找到对应的文档位置进行新增或者修改。这里需要注意的是部分文档需要同时维护 “menu.json” 文件。 + + + +该文件对应文档最后在站点上显示的位置和名称等。例如 + + + +# 借助豆包 Marscode AI 编程助手 进行文档写作 + +[Marscode AI 编程助手](https://www.marscode.cn/home?utm_source=developer&utm_medium=oss&utm_campaign=visactor_a) + +借助豆包[Marscode AI 编程助手](https://www.marscode.cn/home?utm_source=developer&utm_medium=oss&utm_campaign=visactor_a)，可以在文档创作的整个流程中提供全方面的帮助。 + +如果你还没有安装[Marscode AI 编程助手](https://www.marscode.cn/home?utm_source=developer&utm_medium=oss&utm_campaign=visactor_a)，请从该链接进入下载页面：https://www.marscode.cn/home?utm_source=developer&utm_medium=oss&utm_campaign=visactor_a + +在文档写作中，合理使用 context 指令，可以提升内容的准确性。 + +`**⭐️ #Workspace**` + +选择 Workspace 中的全局代码作为上下文，AI 将根据用户 Query 自动寻找相关代码 Context + + + +`**⭐️ #Files**` + +搜索选择代码仓库中的文件作为上下文 + + + +`**⭐️ #Code**` + +搜索选择代码仓库中的函数、类作为上下文 + + + +下面举例说明，如何使用[Marscode AI 编程助手](https://www.marscode.cn/home?utm_source=developer&utm_medium=oss&utm_campaign=visactor_a) 进行文档写作。 + +## 5.1 提供文档写作思路 + +这里 **通过 # 唤起 #Workspace ，**然后进行提问，希望它帮忙生成一份开发者文档大纲。 + + + +## 5.2 生成项目结构说明 + +这里 **通过 # 唤起 #Workspace ，**然后进行提问，希望它帮忙生成一份项目结构说明文档。 + + + +我们仍然可以针对子文件夹，进行进一步的提问。 + + + +## 5.3 生成文件或代码详解 + +### 5.3.1 生成代码说明 + +当我们在文件中选择一段代码，可以从悬浮菜单中选择 Explain 命令，[Marscode](https://www.marscode.cn/home?utm_source=developer&utm_medium=oss&utm_campaign=visactor_a) 会为我们生成详细的代码解释。我们可以在此基础上，进行校对和改编。 + + + +也可以直接在对话框中输入 Explain 命令。 + + + +这里也可以直接使用上面提到的 #Code context 来结合 Explain 和你的指令来进行更细节的任务。 + +### 5.3.2 生成针对整个文件的说明 + +Explain 可以和 Context 或者 Files 命令搭配使用，用来生成针对整个文件的说明文档。 + + + +## 5.4 生成示例代码 + +为了更好的解释说明原理和用法，通常需要给出可以实际运行的 demo，可以利用 [Marscode](https://www.marscode.cn/home?utm_source=developer&utm_medium=oss&utm_campaign=visactor_a) 的代码生成能力为我们生成示例代码。不过目前各种 AI 的代码生成能力都不能保证准确，还需要进一步的进行验证。 + +## 5.5 内容检索 + +通常我们的每个问答，[Marscode](https://www.marscode.cn/home?utm_source=developer&utm_medium=oss&utm_campaign=visactor_a) 都会给出参考文档，这些文档可以给我们提供更多参考上下文，供进一步分析。 + + + +也可以直接进行文件检索： + + + +## 5.6 翻译文档 + +VisActor 的文档需要同时提供中英文，Marscode 可以辅助用来进行翻译。 + +# 提交代码 + +文档完成之后，先把代码 push 到你的远程分支。例如： + +``` +git commit -a -m "docs: add custom funnel demo and related docs" + +``` + +VisActor 的 commit 提交信息遵循 [Conventional Commits](https://www.conventionalcommits.org/en/v1.0.0/) 规范 + +`[optional scope]: ` + +其中常用的`type`包括 docs（文档、日志修改）、feat（新功能）、fix（问题修复）、refactor（代码重构）等，请根据实际情况选择。 + +请用简短精确的英文描述编写 description + +提交 commit 之前，我们会进行 commit lint 检查，具体可以查看[检查规则](https://github.com/VisActor/VRender/blob/develop/common/autoinstallers/lint/commitlint.config.js)。 + +一个常见的问题是远程的 upstream (@visactor/vrender) 有了新的更新， 从而会导致我们提交的 Pull Request 时会导致冲突。 因此我们可以在提交前先把远程其他开发者的 commit 和我们的 commit 合并。使用以下代码切换到 develop 分支: + +``` +git checkout develop + +``` + +使用以下代码拉出远程的最新代码: + +``` +git pull upstream develop + +``` + +切换回自己的开发分支: + +``` +git checkout docs/add-funnel-demo + +``` + +把 develop 的 commit 合并到自己分支： + +``` +git rebase develop + +``` + +把更新代码提交到自己的分支中: + +``` +git push origin docs/add-funnel-demo + +``` + +# 提交 PR + +你可以在你的 github 代码仓库页面点击 `Compare & pull request` 按钮。 + + + +或通过 `contribute` 按钮创建： + +按照模板填写本次提交的修改内容： + +- 勾选这是什么类型的修改 + + + +- 填写关联的 issue + + + +- 若有复杂变更，请说明背景和解决方案 + + + +相关信息填写完成后，点击 Create pull request 提交。 + +管理员会 review pr 决定是否通过，如果不通过需要进行修改然后重新提交。 + +# 下一步 + +不同的文档类型中，demo 文档有一些特殊要求，可以参考“如何贡献 demo”一节。 + +接下来可以继续尝试不同类型的任务。 + +github ：[github.com/VisActor](https://link.juejin.cn/?target=https%3A%2F%2Fgithub.com%2FVisActor) + +VisActor 微信订阅号留言（可以通过订阅号菜单加入微信群）： + + + +VisActor 官网：[www.visactor.io/](https://link.juejin.cn/?target=https%3A%2F%2Fwww.visactor.io%2Fvtable) + +飞书群： + + + +discord：https://discord.com/invite/3wPyxVyH6m + +# 本文档由由以下人员贡献 + +[玄魂](https://github.com/xuanhun) diff --git a/docs/assets/contributing/zh/4-How to Contribute to a Demo.md b/docs/assets/contributing/zh/4-How to Contribute to a Demo.md new file mode 100644 index 000000000..df433f15a --- /dev/null +++ b/docs/assets/contributing/zh/4-How to Contribute to a Demo.md @@ -0,0 +1,332 @@ +--- +title: 4.如何贡献demo + +key words: VisActor,VChart,VTable,VStory,VMind,VGrammar,VRender,Visualization,Chart,Data,Table,Graph,Gis,LLM +--- + +# 创建分支 + +VRender 默认分支为 develop 分支。无论是功能开发、bug 修复、文档编写，都请新建立一个分支，再合并到 develop 分支上。使用以下代码创建分支： + +``` +// 创建文档、demo分支 +git checkout -b docs/add-funnel-demo + +``` + +# 寻找或者创建 issue + +原则上，我们规定每一个 pr 都要有对应的 issue。在开始开发之前，请确认是否有对应的 issue，且 issue 没有被认领。 + +## 搜索 demo issue + +可以通过如下方式搜索 demo 相关的 issue： + +``` + label:demos + +``` + + + +其中他有些 feature 会关联 doc 标签，可以进一步看一下该 issue 是不是纯 demo 任务。 + +## 创建 demo issue + +点击 “NEW ISSUE”，打开 issue 选择页面，选择“**Others”。** + + + +填写你要提交的文档 issue 相关信息,并打上“demos”标签即可。 + + + +# 认领 issue + +如果你想提交 demo 或者修改 demo bug，可以在该 issue 下留言认领。管理员会联系你，确认后将 issue assign 给你。 + +例如： + + + +# 创建或者修改 demo + +VRender 文档和 demo 在项目的中的位置如下（examples）： + + + +以 basic-arc 的示例文档为例（目前一份示例同时包含中英文版本，分别在 zh & en 的路径下）： + + + +示例 Markdown 内容分为几个部分： + +- 元信息：示例内容的属性定义，包括图表分类、封面图、关键词等； + +- 标题：一级标题下的正文内容对应了示例的描述信息； + +- 关键配置：示例中所包含的关键配置说明，这一部分将在示例页面右侧的“关键配置”中呈现； + +- 代码演示：示例执行的具体代码内容，目前只支持原生的 JavaScript 代码。 + +```js +const graphics = []; +graphics.push( + VRender.createArc({ + innerRadius: 0, + outerRadius: 120, + startAngle: 0, + endAngle: Math.PI * 2, + x: 200, + y: 200, + fill: { + gradient: 'linear', + x0: 0, + y0: 0, + x1: 1, + y1: 0, + stops: [ + { offset: 0, color: 'green' }, + { offset: 0.5, color: 'orange' }, + { offset: 1, color: 'red' } + ] + }, + fillOpacity: 0.2, + background: + '', + texture: 'circle', + textureColor: 'orange', + stroke: 'green', + lineWidth: 2, + cap: false + }) +); + +graphics.push( + VRender.createArc({ + innerRadius: 120, + outerRadius: 130, + startAngle: 0, + endAngle: Math.PI * 2, + x: 200, + y: 200, + stroke: '#63bbd0', + lineWidth: 2, + fill: { + x: 0.5, + y: 0.5, + startAngle: 0, + endAngle: 6.283185307179586, + stops: [ + { offset: 0, color: '#ed2f6a' }, + { offset: 0.2, color: '#621d34' }, + { offset: 0.4, color: '#c08eaf' }, + { offset: 0.6, color: '#806d9e' }, + { offset: 0.8, color: '#2b73af' }, + { offset: 1, color: '#2f90b9' } + ], + gradient: 'conical' + }, + cap: [false, true], + cornerRadius: 26, + forceShowCap: true + }) +); + +const stage = new Stage({ + container: CONTAINER_ID, + autoRender: true +}); + +graphics.forEach(g => { + stage.defaultLayer.add(g); +}); +``` + +其中 Markdown 的元信息的字段定义为： + +- group：示例的分类信息，描述了当前示例属于什么图表类别 + +- title：示例的标 + +- keywords：示例的关键词 + +- order：示例在同个分组下的排序依据 + +- cover：示例的封面图 + +- tutorial：跳转的教程链接（默认的示例教程将会跳转到示例分组所对应的教程） + +目前图表示例的 group 包含多个分类，例如 graphic-arc 、graphic-area 等，对应到 VRender 示例画廊中全部图表下的分类。具体的分类字段可以参照已有的示例文档进行填写。 + + + +完成新的 demo 编写后，可以在 docs/assets/examples/menu.json 文件中添加 demo 路径和标题： + + + +> Demo 制作过程中需要上传的图片资源，请参考[6.如何上传图片资源](./6-How%20to%20upload%20image)章节 + +# 借助豆包 Marscode AI 编程助手进行 demo 编写 + +借助豆包[Marscode AI 编程助手](https://www.marscode.cn/home?utm_source=developer&utm_medium=oss&utm_campaign=visactor_a)，可以在文档创作的整个流程中提供全方面的帮助。 + +如果你还没有安装[Marscode AI 编程助手](https://www.marscode.cn/home?utm_source=developer&utm_medium=oss&utm_campaign=visactor_a)，请从该链接进入下载页面：https://www.marscode.cn/home?utm_source=developer&utm_medium=oss&utm_campaign=visactor_a + +在 demo 编写中，合理使用 context 指令，可以提升内容的准确性。 + +`**⭐️ #Workspace**` + +选择 Workspace 中的全局代码作为上下文，AI 将根据用户 Query 自动寻找相关代码 Context + + + +`**⭐️ #Files**` + +搜索选择代码仓库中的文件作为上下文 + + + +`**⭐️ #Code**` + +搜索选择代码仓库中的函数、类作为上下文 + + + +下面举例说明，如何使用[Marscode AI 编程助手](https://www.marscode.cn/home?utm_source=developer&utm_medium=oss&utm_campaign=visactor_a) 进行 demo 编写。 + +## 5.1 提供文档框架 + +这里 **通过 # 唤起 #Workspace ，**然后进行提问，选中一份 example 的文档内容，希望它仿照生成一份新的 example 文档。 + + + +我们可以在此基础上继续细节的调整。 + +## 5.2 生成说明文字 + +每个 demo 的说明文字可以先用 [Marscode](https://www.marscode.cn/home?utm_source=developer&utm_medium=oss&utm_campaign=visactor_a) 生成，然后再做校对和调整。比如： + + + +## 5.3 生成示例代码 + +为了更好的解释说明原理和用法，通常需要给出可以实际运行的 demo，可以利用 [Marscode](https://www.marscode.cn/home?utm_source=developer&utm_medium=oss&utm_campaign=visactor_a) 的代码生成能力为我们生成示例代码。不过目前各种 AI 的代码生成能力都不能保证准确，还需要进一步的进行验证。 + +## 5.4 内容检索 + +通常我们的每个问答，[Marscode](https://www.marscode.cn/home?utm_source=developer&utm_medium=oss&utm_campaign=visactor_a) 都会给出参考文档，这些文档可以给我们提供更多参考上下文，供进一步分析。 + + + +也可以直接进行文件检索： + + + +# 提交代码 + +文档完成之后，先把代码 push 到你的远程分支。例如： + +``` + +git commit -a -m "docs: add custom funnel demo and related docs" + +``` + +VisActor 的 commit 提交信息遵循 [Conventional Commits](https://www.conventionalcommits.org/en/v1.0.0/) 规范，**demo 使用 docs** + +`[optional scope]: ` + +其中常用的`type`包括 docs（文档、日志修改）、feat（新功能）、fix（问题修复）、refactor（代码重构）等，请根据实际情况选择。 + +请用简短精确的英文描述编写 description + +提交 commit 之前，我们会进行 commit lint 检查，具体可以查看[检查规则](https://github.com/VisActor/VRender/blob/develop/common/autoinstallers/lint/commitlint.config.js)。 + +一个常见的问题是远程的 upstream (@visactor/vrender) 有了新的更新， 从而会导致我们提交的 Pull Request 时会导致冲突。 因此我们可以在提交前先把远程其他开发者的 commit 和我们的 commit 合并。使用以下代码切换到 develop 分支: + +``` + +git checkout develop + +``` + +使用以下代码拉出远程的最新代码: + +``` + +git pull upstream develop + +``` + +切换回自己的开发分支: + +``` + +git checkout docs/add-funnel-demo + +``` + +把 develop 的 commit 合并到自己分支： + +``` + +git rebase develop + +``` + +把更新代码提交到自己的分支中: + +``` + +git push origin docs/add-funnel-demo + +``` + +# 提交 PR + +你可以在你的 github 代码仓库页面点击 `Compare & pull request` 按钮。 + + + +或通过 `contribute` 按钮创建： + +按照模板填写本次提交的修改内容： + +- 勾选这是什么类型的修改 + + + +- 填写关联的 issue + + + +- 若有复杂变更，请说明背景和解决方案 + + + +相关信息填写完成后，点击 Create pull request 提交。 + +管理员会 review pr 决定是否通过，如果不通过需要进行修改然后重新提交。 + +# 下一步 + +接下来可以继续尝试不同类型的任务。 + +github ：[github.com/VisActor](https://link.juejin.cn/?target=https%3A%2F%2Fgithub.com%2FVisActor) + +VisActor 微信订阅号留言（可以通过订阅号菜单加入微信群）： + + + +VisActor 官网：[www.visactor.io/](https://link.juejin.cn/?target=https%3A%2F%2Fwww.visactor.io%2Fvtable) + +飞书群： + + + +discord：https://discord.com/invite/3wPyxVyH6m + +# 本文档由由以下人员贡献 + +[玄魂](https://github.com/xuanhun) diff --git a/docs/assets/contributing/zh/5-How to Contribute Code.md b/docs/assets/contributing/zh/5-How to Contribute Code.md new file mode 100644 index 000000000..0edc894b5 --- /dev/null +++ b/docs/assets/contributing/zh/5-How to Contribute Code.md @@ -0,0 +1,244 @@ +--- +title: 5.如何贡献代码 + +key words: VisActor,VChart,VTable,VStory,VMind,VGrammar,VRender,Visualization,Chart,Data,Table,Graph,Gis,LLM +--- + +# 创建分支 + +VRender 默认分支为 develop 分支。无论是功能开发、bug 修复、文档编写，都请新建立一个分支，再合并到 develop 分支上。使用以下代码创建分支： + +``` +// 创建文档、demo分支 +git checkout -b docs/add-funnel-demo +``` + +# 寻找或者创建 issue + +原则上，我们规定每一个 pr 都要有对应的 issue。在开始开发之前，请确认是否有对应的 issue，且 issue 没有被认领。 + +## 搜索 issue + +可以通过如下方式搜索 bug 或者 feature 相关的 issue： + + + +## 创建代码相关 issue + +点击 “NEW ISSUE”，打开 issue 选择页面，选择“**Bug Report” 或者 “Feature Request”。** + + + +填写你要提交的文档 issue 相关信息,并打上合适的标签即可。 + + + +# 认领 issue + +如果你想贡献代码，可以在该 issue 下留言认领。管理员会联系你，确认后将 issue assign 给你。 + +例如： + + + +# 编写代码 + +VRender 生态所有的组件都在同一目录下，按包名进行拆分，开发者需要在自己的代码分支上开发代码，然后进行提交。 + +# 借助豆包 Marscode AI 编程助手 进行代码编写 + +借助豆包[Marscode AI 编程助手](https://www.marscode.cn/home?utm_source=developer&utm_medium=oss&utm_campaign=visactor_a)，可以在代码编写的整个流程中提供全方面的帮助。 + +如果你还没有安装[Marscode AI 编程助手](https://www.marscode.cn/home?utm_source=developer&utm_medium=oss&utm_campaign=visactor_a)，请从该链接进入下载页面：https://www.marscode.cn/home?utm_source=developer&utm_medium=oss&utm_campaign=visactor_a + +在代码编写中，合理使用 context 指令，可以提升内容的准确性。 + +`**⭐️ #Workspace**` + +选择 Workspace 中的全局代码作为上下文，AI 将根据用户 Query 自动寻找相关代码 Context + + + +`**⭐️ #Files**` + +搜索选择代码仓库中的文件作为上下文 + + + +`**⭐️ #Code**` + +搜索选择代码仓库中的函数、类作为上下文 + + + +下面举例说明，如何使用[Marscode AI 编程助手](https://www.marscode.cn/home?utm_source=developer&utm_medium=oss&utm_campaign=visactor_a) 进行代码编写。 + +## 5.1 快速熟悉整个仓库 + +这里 **通过 # 唤起 #Workspace ，**然后进行提问，希望它帮忙生成一份项目结构说明文档。 + + + +我们仍然可以针对子文件夹，进行进一步的提问。 + + + +## 5.2 解释代码 + +### 5.2.1 生成代码说明 + +当我们在文件中选择一段代码，可以从悬浮菜单中选择 Explain 命令，[Marscode](https://www.marscode.cn/home?utm_source=developer&utm_medium=oss&utm_campaign=visactor_a) 会为我们生成详细的代码解释。我们可以在此基础上，进行校对和改编。 + + + +也可以直接在对话框中输入 Explain 命令。 + + + +这里也可以直接使用上面提到的 #Code context 来结合 Explain 和你的指令来进行更细节的任务。 + +### 5.2.2 生成针对整个文件的说明 + +Explain 可以和 Context 或者 Files 命令搭配使用，用来生成针对整个文件的说明文档。 + + + +## 5.3 内容检索 + +通常我们的每个问答，[Marscode](https://www.marscode.cn/home?utm_source=developer&utm_medium=oss&utm_campaign=visactor_a) 都会给出参考文档，这些文档可以给我们提供更多参考上下文，供进一步分析。 + + + +也可以直接进行文件检索： + + + +## 5.4 代码生成 + +在日常编码中经常会碰到使用重复代码的场景，有时候可能并不知道某个功能是否有现成的函数已实现，此时用 `#Workspace` 来进行提问。例如： + + + +## 5.5 添加注释 + +使用 "/doc"命令生成代码注释。 + + + +## 5.6 生成单测 + +VRender 单元测试代码在每个 package 的 “**\*\*tests**” \*\* 目录下。 + + + +使用 [Marscode](https://www.marscode.cn/home?utm_source=developer&utm_medium=oss&utm_campaign=visactor_a) “/test” 指令可以快速的生成单测代码。 + + + +## 5.7 智能提示 + +编写过程中，智能生成可选代码是编程助手的标配功能，大家自行体验吧。 + +# 提交代码 + +文档完成之后，先把代码 push 到你的远程分支。例如： + +``` +git commit -a -m "docs: add custom funnel demo and related docs" + +``` + +VisActor 的 commit 提交信息遵循 [Conventional Commits](https://www.conventionalcommits.org/en/v1.0.0/) 规范，**demo 使用 docs** + +`[optional scope]: ` + +其中常用的`type`包括 docs（文档、日志修改）、feat（新功能）、fix（问题修复）、refactor（代码重构）等，请根据实际情况选择。 + +请用简短精确的英文描述编写 description + +提交 commit 之前，我们会进行 commit lint 检查，具体可以查看[检查规则](https://github.com/VisActor/VStory/blob/develop/common/autoinstallers/lint/commitlint.config.js)。 + +一个常见的问题是远程的 upstream (@visactor/vstroy) 有了新的更新， 从而会导致我们提交的 Pull Request 时会导致冲突。 因此我们可以在提交前先把远程其他开发者的 commit 和我们的 commit 合并。使用以下代码切换到 develop 分支: + +``` +git checkout develop + +``` + +使用以下代码拉出远程的最新代码: + +``` +git pull upstream develop + +``` + +切换回自己的开发分支: + +``` +git checkout docs/add-funnel-demo + +``` + +把 develop 的 commit 合并到自己分支： + +``` +git rebase develop + +``` + +把更新代码提交到自己的分支中: + +``` +git push origin docs/add-funnel-demo + +``` + +# 提交 PR + +你可以在你的 github 代码仓库页面点击 `Compare & pull request` 按钮。 + + + +或通过 `contribute` 按钮创建： + +按照模板填写本次提交的修改内容： + +- 勾选这是什么类型的修改 + + + +- 填写关联的 issue + + + +- 若有复杂变更，请说明背景和解决方案 + + + +相关信息填写完成后，点击 Create pull request 提交。 + +管理员会 review pr 决定是否通过，如果不通过需要进行修改然后重新提交。 + +# 下一步 + +接下来你可以阅读每一个模块的实现原理及源码详解，也可以加入贡献这些文档。 + +请加入 VisActor 大家庭，贡献你的力量吧！ + +github ：[github.com/VisActor](https://link.juejin.cn/?target=https%3A%2F%2Fgithub.com%2FVisActor) + +VisActor 微信订阅号（可以通过订阅号菜单加入微信群）： + + + +VisActor 官网：[www.visactor.io/](https://link.juejin.cn/?target=https%3A%2F%2Fwww.visactor.io%2Fvtable) + +飞书群： + + + +discord：https://discord.com/invite/3wPyxVyH6m + +# 本文档由由以下人员贡献 + +[玄魂](https://github.com/xuanhun) diff --git a/docs/assets/contributing/zh/6-How to upload image.md b/docs/assets/contributing/zh/6-How to upload image.md new file mode 100644 index 000000000..2bea66a8d --- /dev/null +++ b/docs/assets/contributing/zh/6-How to upload image.md @@ -0,0 +1,45 @@ +# 如何上传图片 +教程文档中通常需要使用图片来辅助说明。 +我们推荐使用稳定的图床来上传图片，这里介绍使用 cdn.jsdelivr.net 图床方案。 + +## 6.1 上传图片 +首先在你的个人github 仓库中创建一个文件夹，用来存放文档中使用的图片。 +比如，https://github.com/xuanhun/articles/tree/main/visactor/img 目录下存储了大量的图片，以其中A3gybJqQLo7vH8xV8I3cA7NknRc.gif 为例， 对应的github url 为： +https://github.com/xuanhun/articles/blob/main/visactor/img/A3gybJqQLo7vH8xV8I3cA7NknRc.gif。 + +在具体的md 文档中，我们将其转换为cdn.jsdelivr.net的URL： + +https://cdn.jsdelivr.net/gh/[username]/[repo name]/[imgae path] + +![示例图片](https://cdn.jsdelivr.net/gh/xuanhun/articles/visactor/img/A3gybJqQLo7vH8xV8I3cA7NknRc.gif) + +# 下一步 + +接下来你可以阅读每一个模块的实现原理及源码详解，也可以加入贡献这些文档。 + +请加入VisActor 大家庭，贡献你的力量吧！ + + + +github ：[github.com/VisActor](https://link.juejin.cn/?target=https%3A%2F%2Fgithub.com%2FVisActor) + +VisActor 微信订阅号（可以通过订阅号菜单加入微信群）： + + + +VisActor 官网：[www.visactor.io/](https://link.juejin.cn/?target=https%3A%2F%2Fwww.visactor.io%2Fvtable) + +飞书群： + + + +discord：https://discord.com/invite/3wPyxVyH6m + + +# 本文档由由以下人员贡献 + +[玄魂](https://github.com/xuanhun) + +# 本文档由由以下人员贡献 + +[玄魂](https://github.com/xuanhun) \ No newline at end of file diff --git a/docs/assets/examples/en/graphic-arc/basic-arc.md b/docs/assets/examples/en/graphic-arc/basic-arc.md index aaece42cf..3e84f829d 100644 --- a/docs/assets/examples/en/graphic-arc/basic-arc.md +++ b/docs/assets/examples/en/graphic-arc/basic-arc.md @@ -9,6 +9,14 @@ cover: https://lf9-dp-fe-cms-tos.byteorg.com/obj/bit-cloud/vrender/base-arc.png # arc graphic +The `Arc` primitive is a basic graphic element commonly used to represent curves or arcs. In computer graphics and graphic design, the Arc primitive is used to depict a portion of a circle or any arbitrary curve, typically defined by a center point, radius, start angle, and end angle. + +Key features: +- Center Point: The central position of the arc, usually a coordinate point. +- Inner Radius: The distance from the center point to any point on the inner arc, determining the size of the inner arc. +- Outer Radius: The distance from the center point to any point on the outer arc, determining the size of the outer arc. +- Start Angle and End Angle: Determine the starting and ending positions of the arc, typically expressed in degrees or radians. + ## code demo ```javascript livedemo template=vrender diff --git a/docs/assets/examples/en/graphic-area/basic-area.md b/docs/assets/examples/en/graphic-area/basic-area.md index 5beafb05f..a67507232 100644 --- a/docs/assets/examples/en/graphic-area/basic-area.md +++ b/docs/assets/examples/en/graphic-area/basic-area.md @@ -9,6 +9,10 @@ cover: https://lf9-dp-fe-cms-tos.byteorg.com/obj/bit-cloud/vrender/area.jpeg # area graphic +The `area` element is used to represent changes in data as a graphical element, commonly used in area charts. Area charts display the size and trend of values by filling the area below the line, emphasizing the overall quantity of data rather than just individual values. + +This element is mainly defined by the `points` array, where each item is an object with properties such as x1, x2, y1, and y2 to represent the two points above and below. + ## code demo ```javascript livedemo template=vrender diff --git a/docs/assets/examples/en/graphic-circle/basic-circle.md b/docs/assets/examples/en/graphic-circle/basic-circle.md index 8e3370ba2..81e7566e3 100644 --- a/docs/assets/examples/en/graphic-circle/basic-circle.md +++ b/docs/assets/examples/en/graphic-circle/basic-circle.md @@ -9,6 +9,13 @@ cover: https://lf9-dp-fe-cms-tos.byteorg.com/obj/bit-cloud/vrender/circle-base.p # circle graphic +`Circle` primitive is a basic graphic element used to represent circles or circle-related graphics. In computer graphics, graphic design, and data visualization, the `Circle` primitive is the foundation for building various graphics and charts. + +Key features: +- Center Point: The central position of the circle, usually represented by a coordinate point. +- Radius: The distance from the center point to any point on the circumference, determining the size of the circle. +- Boundary: The outer boundary of the circle is a smooth curve, where all points on the boundary are equidistant from the center point. + ## code demo ```javascript livedemo template=vrender diff --git a/docs/assets/examples/en/graphic-circle/circle-gradient.md b/docs/assets/examples/en/graphic-circle/circle-gradient.md index c2adcc8dc..585aaf6b0 100644 --- a/docs/assets/examples/en/graphic-circle/circle-gradient.md +++ b/docs/assets/examples/en/graphic-circle/circle-gradient.md @@ -9,6 +9,8 @@ cover: https://lf9-dp-fe-cms-tos.byteorg.com/obj/bit-cloud/vrender/circle-gradie # circle graphic +The `Circle` primitive supports gradient color effects. + ## code demo ```javascript livedemo template=vrender diff --git a/docs/assets/examples/en/graphic-glyph/basic-glyph.md b/docs/assets/examples/en/graphic-glyph/basic-glyph.md index f362f3a8a..f6c6618ab 100644 --- a/docs/assets/examples/en/graphic-glyph/basic-glyph.md +++ b/docs/assets/examples/en/graphic-glyph/basic-glyph.md @@ -8,6 +8,7 @@ cover: https://lf9-dp-fe-cms-tos.byteorg.com/obj/bit-cloud/vrender/glyph-basic.p --- # glyph graphic +The `glyph` primitive refers to complex graphic elements composed of multiple basic primitives (such as lines, circles, rectangles, etc.). This design approach allows for the creation of richer visual effects and functionality, widely used in graphic design, data visualization, and user interface design. ## code demo diff --git a/docs/assets/examples/en/graphic-line/basic-line.md b/docs/assets/examples/en/graphic-line/basic-line.md index dc15c675b..b1ccb8d39 100644 --- a/docs/assets/examples/en/graphic-line/basic-line.md +++ b/docs/assets/examples/en/graphic-line/basic-line.md @@ -9,6 +9,13 @@ cover: https://lf9-dp-fe-cms-tos.byteorg.com/obj/bit-cloud/vrender/line-basic.pn # line graphic +The `Line` primitive is a basic graphical element used to represent the trend of data changes, commonly used in line charts and other types of charts. It forms a line by connecting data points, visually displaying the changes in data over time or other variables. + +Key features: +- Data Points: The Line primitive represents numerical values through a series of coordinate points, typically plotted in a two-dimensional coordinate system. +- Line Segments: Data points are connected by straight lines or curves to form a continuous line, making it easy to observe the trend of data changes. +- Visual Effects: The color, thickness, and style of the line can be adjusted as needed to highlight different data series or degrees of change. + ## code demo ```javascript livedemo template=vrender diff --git a/docs/assets/examples/en/graphic-path/basic-path.md b/docs/assets/examples/en/graphic-path/basic-path.md index 496888bf8..92e629fcc 100644 --- a/docs/assets/examples/en/graphic-path/basic-path.md +++ b/docs/assets/examples/en/graphic-path/basic-path.md @@ -9,6 +9,8 @@ cover: https://lf9-dp-fe-cms-tos.byteorg.com/obj/bit-cloud/vrender/path-basic.jp # path graphic +The `Path` element is a basic graphic element used to draw complex shapes and curves, widely used in computer graphics, graphic design, and data visualization. It creates arbitrary shapes by defining a series of line segments and curves, providing flexibility and expressiveness. Its syntax is consistent with the `path` tag in SVG. + ## code demo ```javascript livedemo template=vrender diff --git a/docs/assets/examples/en/graphic-rect/basic-rect.md b/docs/assets/examples/en/graphic-rect/basic-rect.md index dfb84f2fe..453813974 100644 --- a/docs/assets/examples/en/graphic-rect/basic-rect.md +++ b/docs/assets/examples/en/graphic-rect/basic-rect.md @@ -9,6 +9,13 @@ cover: https://lf9-dp-fe-cms-tos.byteorg.com/obj/bit-cloud/vrender/rect-basic.pn # rect graphic +The `Rect` (rectangle) primitive is a basic graphic element used to represent rectangular or square shapes. It is widely used in computer graphics, graphic design, and data visualization due to its simplicity and ease of use. + +Key features: +- Position: Rectangles are typically defined by the coordinates of their top-left corner, determining their position in the coordinate system. +- Width and Height: The size of a rectangle is determined by its width and height, which can be any positive value, creating rectangles of different sizes. +- Border and Fill: Rectangles can have border colors, styles, and thickness set, and can also have a fill color to enhance visual effects. + ## code demo ```javascript livedemo template=vrender diff --git a/docs/assets/examples/en/graphic-richtext/basic-richtext.md b/docs/assets/examples/en/graphic-richtext/basic-richtext.md index f2db26427..0ae6d5ff3 100644 --- a/docs/assets/examples/en/graphic-richtext/basic-richtext.md +++ b/docs/assets/examples/en/graphic-richtext/basic-richtext.md @@ -9,6 +9,8 @@ cover: https://lf9-dp-fe-cms-tos.byteorg.com/obj/bit-cloud/vrender/richtext-basi # richtext graphic +The `RichText` element is a type of graphic element used to display and handle diverse text content, widely used in graphical user interfaces, web design, and data visualization. Unlike plain text, rich text elements support various text formats and styles, making text information more rich and vivid. + ## code demo ```javascript livedemo template=vrender diff --git a/docs/assets/examples/en/graphic-symbol/basic-symbol.md b/docs/assets/examples/en/graphic-symbol/basic-symbol.md index aec35f903..ef886e0a0 100644 --- a/docs/assets/examples/en/graphic-symbol/basic-symbol.md +++ b/docs/assets/examples/en/graphic-symbol/basic-symbol.md @@ -9,6 +9,8 @@ cover: https://lf9-dp-fe-cms-tos.byteorg.com/obj/bit-cloud/vrender/symbol-basic. # symbol graphic +The syntax of the `symbol` primitive is similar to the `path` primitive, but it supports some built-in shapes and also supports `size` to control the pixel size. + ## code demo ```javascript livedemo template=vrender diff --git a/docs/assets/examples/en/graphic-symbol/symbol-wave.md b/docs/assets/examples/en/graphic-symbol/symbol-wave.md index 9c9c895df..aa8b8b606 100644 --- a/docs/assets/examples/en/graphic-symbol/symbol-wave.md +++ b/docs/assets/examples/en/graphic-symbol/symbol-wave.md @@ -9,6 +9,8 @@ cover: https://lf9-dp-fe-cms-tos.byteorg.com/obj/bit-cloud/vrender/wave01.gif # symbol wave +3D effect of waves + ## code demo ```javascript livedemo template=vrender diff --git a/docs/assets/examples/en/graphic-text/basic-text.md b/docs/assets/examples/en/graphic-text/basic-text.md index 10ca67d1e..cddb4e1d7 100644 --- a/docs/assets/examples/en/graphic-text/basic-text.md +++ b/docs/assets/examples/en/graphic-text/basic-text.md @@ -9,6 +9,13 @@ cover: https://lf9-dp-fe-cms-tos.byteorg.com/obj/bit-cloud/vrender/text-basic.pn # text graphic +The `Text` element is a basic graphic element used to display simple text information, widely used in computer graphics, user interface design, and data visualization. It is mainly used to render characters and textual content, providing information and identification. + +Main features: +- Font and style: The Text element can be styled with different fonts, sizes, colors, and styles (such as bold, italic) to meet design requirements. +- Positioning: Text is usually positioned relative to anchor points through its align and baseline, allowing for flexible placement. +- Line height: The line height can be adjusted to improve the readability and visual effect of the text. + ## code demo ```javascript livedemo template=vrender diff --git a/docs/assets/examples/en/graphic-text/text-blend.md b/docs/assets/examples/en/graphic-text/text-blend.md index 4633ca12a..0b9d6f13a 100644 --- a/docs/assets/examples/en/graphic-text/text-blend.md +++ b/docs/assets/examples/en/graphic-text/text-blend.md @@ -9,6 +9,8 @@ cover: https://lf9-dp-fe-cms-tos.byteorg.com/obj/bit-cloud/vrender/text-blend.pn # text graphic +`text`支持canvas原生的`globalCompositeOperation`系列配置的效果 + ## code demo ```javascript livedemo template=vrender @@ -24,7 +26,7 @@ const t1 = createText({ fontFamily: 'Lato', fontWeight: 'bolder', fill: '#08fff9', - blend: 'lighten', + globalCompositeOperation: 'lighten', x: x, y: y }); @@ -36,7 +38,7 @@ const t2 = createText({ fontSize: 120, fontFamily: 'Lato', fontWeight: 'bolder', - blend: 'lighten', + globalCompositeOperation: 'lighten', fill: '#f00044', x: x + delta, y: y + delta diff --git a/docs/assets/examples/zh/graphic-arc/basic-arc.md b/docs/assets/examples/zh/graphic-arc/basic-arc.md index e96e71bfb..5c3fd5e63 100644 --- a/docs/assets/examples/zh/graphic-arc/basic-arc.md +++ b/docs/assets/examples/zh/graphic-arc/basic-arc.md @@ -9,6 +9,14 @@ cover: https://lf9-dp-fe-cms-tos.byteorg.com/obj/bit-cloud/vrender/base-arc.png # arc 图元 +`Arc`图元是一种基本的图形元素，通常用于表示曲线或弧线。在计算机图形学和图形设计中，Arc图元用于描绘圆弧或任意曲线的部分，通常由中心点、半径、起始角度和结束角度来定义。 + +主要特征： +- 中心点：弧线的中心位置，通常是一个坐标点。 +- 内半径：从中心点到内弧线上的任意点的距离，决定了内弧的大小。 +- 外半径：从中心点到外弧线上的任意点的距离，决定了外弧的大小。 +- 起始角度与结束角度：确定弧线的起始和结束位置，通常以度数或弧度表示。 + ## 代码演示 ```javascript livedemo template=vrender diff --git a/docs/assets/examples/zh/graphic-arc/fan.md b/docs/assets/examples/zh/graphic-arc/fan.md index 64b16c288..54594656f 100644 --- a/docs/assets/examples/zh/graphic-arc/fan.md +++ b/docs/assets/examples/zh/graphic-arc/fan.md @@ -9,6 +9,8 @@ cover: https://lf9-dp-fe-cms-tos.byteorg.com/obj/bit-cloud/vrender/fan.gif # arc 扇子 +A demo of a fan + ## 代码演示 ```javascript livedemo template=vrender diff --git a/docs/assets/examples/zh/graphic-area/basic-area.md b/docs/assets/examples/zh/graphic-area/basic-area.md index 4ecdcb17d..493eff080 100644 --- a/docs/assets/examples/zh/graphic-area/basic-area.md +++ b/docs/assets/examples/zh/graphic-area/basic-area.md @@ -9,6 +9,10 @@ cover: https://lf9-dp-fe-cms-tos.byteorg.com/obj/bit-cloud/vrender/area.jpeg # area 图元 +`area`图元是用于表示数据变化的图形元素，通常在面积图中使用。面积图通过填充线下方的区域来展示数值的大小和变化趋势，强调数据的总体量而不仅仅是单一数值。 + +该图元主要通过`points`数组定义形状，其中每项是个对象，有x1、x2、y1、y2几个属性用来表示上下的两个点 + ## 代码演示 ```javascript livedemo template=vrender diff --git a/docs/assets/examples/zh/graphic-circle/basic-circle.md b/docs/assets/examples/zh/graphic-circle/basic-circle.md index c377f4cc0..ab309f29a 100644 --- a/docs/assets/examples/zh/graphic-circle/basic-circle.md +++ b/docs/assets/examples/zh/graphic-circle/basic-circle.md @@ -9,6 +9,13 @@ cover: https://lf9-dp-fe-cms-tos.byteorg.com/obj/bit-cloud/vrender/circle-base.p # circle 图元 +`Circle`图元是一种基本的图形元素，用于表示圆形或圆形相关的图形。在计算机图形学、图形设计和数据可视化中，Circle图元是构建各种图形和图表的基础。 + +主要特征： +- 中心点：圆形的中心位置，通常用一个坐标点表示。 +- 半径：从中心点到圆周上任意点的距离，决定圆的大小。 +- 边界：圆形的外边界是一个平滑的曲线，所有边界上的点到中心点的距离相等。 + ## 代码演示 ```javascript livedemo template=vrender diff --git a/docs/assets/examples/zh/graphic-circle/circle-gradient.md b/docs/assets/examples/zh/graphic-circle/circle-gradient.md index be008c65b..abc406282 100644 --- a/docs/assets/examples/zh/graphic-circle/circle-gradient.md +++ b/docs/assets/examples/zh/graphic-circle/circle-gradient.md @@ -7,7 +7,9 @@ order: 1-0 cover: https://lf9-dp-fe-cms-tos.byteorg.com/obj/bit-cloud/vrender/circle-gradient.png --- -# circle 图元 +# circle 渐变色 + +`Circle`图元支持渐变色的效果 ## 代码演示 diff --git a/docs/assets/examples/zh/graphic-glyph/basic-glyph.md b/docs/assets/examples/zh/graphic-glyph/basic-glyph.md index e5a12555b..9c0d10474 100644 --- a/docs/assets/examples/zh/graphic-glyph/basic-glyph.md +++ b/docs/assets/examples/zh/graphic-glyph/basic-glyph.md @@ -9,6 +9,8 @@ cover: https://lf9-dp-fe-cms-tos.byteorg.com/obj/bit-cloud/vrender/glyph-basic.p # glyph 图元 +`glyph`图元是指由多个基本图元（如线、圆、矩形等）组合而成的复杂图形元素。这种设计方法允许创建更丰富的视觉效果和功能性，广泛应用于图形设计、数据可视化和用户界面设计中。 + ## 代码演示 ```javascript livedemo template=vrender diff --git a/docs/assets/examples/zh/graphic-line/basic-line.md b/docs/assets/examples/zh/graphic-line/basic-line.md index bfadfdf8c..646e0283f 100644 --- a/docs/assets/examples/zh/graphic-line/basic-line.md +++ b/docs/assets/examples/zh/graphic-line/basic-line.md @@ -9,6 +9,13 @@ cover: https://lf9-dp-fe-cms-tos.byteorg.com/obj/bit-cloud/vrender/line-basic.pn # line 图元 +`Line`图元是用于表示数据变化趋势的基本图形元素，通常在折线图和其他图表中使用。它通过连接数据点形成线段，直观地展示数据随时间或其他变量的变化。 + +主要特征： +- 数据点：Line图元通过一系列坐标点来表示数值，这些点通常在二维坐标系中绘制。 +- 线段：数据点之间通过直线或曲线连接，形成连续的线，便于观察数据的变化趋势。 +- 可视化效果：线条的颜色、粗细和样式可以根据需要进行调整，以突出不同的数据系列或变化程度。 + ## 代码演示 ```javascript livedemo template=vrender diff --git a/docs/assets/examples/zh/graphic-path/basic-path.md b/docs/assets/examples/zh/graphic-path/basic-path.md index 962533475..542a58d8b 100644 --- a/docs/assets/examples/zh/graphic-path/basic-path.md +++ b/docs/assets/examples/zh/graphic-path/basic-path.md @@ -9,6 +9,8 @@ cover: https://lf9-dp-fe-cms-tos.byteorg.com/obj/bit-cloud/vrender/path-basic.jp # path 图元 +`Path`（路径）图元是用于绘制复杂形状和曲线的基本图形元素，广泛应用于计算机图形学、图形设计和数据可视化中。它通过定义一系列的线段和曲线来创建任意形状，具有灵活性和表现力。其语法和`svg`中的`path`标签保持一致 + ## 代码演示 ```javascript livedemo template=vrender diff --git a/docs/assets/examples/zh/graphic-rect/basic-rect.md b/docs/assets/examples/zh/graphic-rect/basic-rect.md index 08db9785a..042291b6c 100644 --- a/docs/assets/examples/zh/graphic-rect/basic-rect.md +++ b/docs/assets/examples/zh/graphic-rect/basic-rect.md @@ -9,6 +9,13 @@ cover: https://lf9-dp-fe-cms-tos.byteorg.com/obj/bit-cloud/vrender/rect-basic.pn # rect 图元 +`Rect`（矩形）图元是一种基本的图形元素，用于表示矩形或正方形形状。它在计算机图形学、图形设计以及数据可视化中广泛应用，因其简单易用而受到喜爱。 + +主要特征： +- 位置：矩形通常通过其左上角的坐标来定义，确定矩形在坐标系中的位置。 +- 宽度与高度：矩形的尺寸由其宽度和高度决定，可以是任意正值，从而形成不同大小的矩形。 +- 边框与填充：矩形可以设置边框的颜色、样式和厚度，同时也可以选择填充颜色，以增强视觉效果。 + ## 代码演示 ```javascript livedemo template=vrender diff --git a/docs/assets/examples/zh/graphic-rect/morphing-animate.md b/docs/assets/examples/zh/graphic-rect/morphing-animate.md index db0673478..bf8c24935 100644 --- a/docs/assets/examples/zh/graphic-rect/morphing-animate.md +++ b/docs/assets/examples/zh/graphic-rect/morphing-animate.md @@ -7,7 +7,7 @@ order: 1-0 cover: https://lf9-dp-fe-cms-tos.byteorg.com/obj/bit-cloud/vrender/morphing.gif --- -# rect 图元 +# morphing-animate ## 代码演示 diff --git a/docs/assets/examples/zh/graphic-richtext/basic-richtext.md b/docs/assets/examples/zh/graphic-richtext/basic-richtext.md index 95b76e430..227bfcfae 100644 --- a/docs/assets/examples/zh/graphic-richtext/basic-richtext.md +++ b/docs/assets/examples/zh/graphic-richtext/basic-richtext.md @@ -9,6 +9,8 @@ cover: https://lf9-dp-fe-cms-tos.byteorg.com/obj/bit-cloud/vrender/richtext-basi # richtext 图元 +`RichText`（富文本）图元是一种用于显示和处理多样化文本内容的图形元素，广泛应用于图形用户界面、网页设计和数据可视化中。与普通文本不同，富文本图元支持多种文本格式和样式，使得文本信息更加丰富和生动。 + ## 代码演示 ```javascript livedemo template=vrender diff --git a/docs/assets/examples/zh/graphic-symbol/basic-symbol.md b/docs/assets/examples/zh/graphic-symbol/basic-symbol.md index bac3f9da1..d47efd8fe 100644 --- a/docs/assets/examples/zh/graphic-symbol/basic-symbol.md +++ b/docs/assets/examples/zh/graphic-symbol/basic-symbol.md @@ -9,6 +9,8 @@ cover: https://lf9-dp-fe-cms-tos.byteorg.com/obj/bit-cloud/vrender/symbol-basic. # symbol 图元 +`symbol`图元的语法和`path`图元类似，但支持一些内置的形状，以及支持`size`来控制像素大小。 + ## 代码演示 ```javascript livedemo template=vrender diff --git a/docs/assets/examples/zh/graphic-symbol/symbol-wave.md b/docs/assets/examples/zh/graphic-symbol/symbol-wave.md index c8430d87a..64bd1beef 100644 --- a/docs/assets/examples/zh/graphic-symbol/symbol-wave.md +++ b/docs/assets/examples/zh/graphic-symbol/symbol-wave.md @@ -9,6 +9,8 @@ cover: https://lf9-dp-fe-cms-tos.byteorg.com/obj/bit-cloud/vrender/wave01.gif # symbol 波浪 +波浪的3d效果 + ## 代码演示 ```javascript livedemo template=vrender diff --git a/docs/assets/examples/zh/graphic-text/basic-text.md b/docs/assets/examples/zh/graphic-text/basic-text.md index a71ebc506..31e5a89b4 100644 --- a/docs/assets/examples/zh/graphic-text/basic-text.md +++ b/docs/assets/examples/zh/graphic-text/basic-text.md @@ -9,6 +9,13 @@ cover: https://lf9-dp-fe-cms-tos.byteorg.com/obj/bit-cloud/vrender/text-basic.pn # text 图元 +`Text`（文本）图元是用于显示简单文本信息的基本图形元素，在计算机图形学、用户界面设计和数据可视化中广泛应用。它主要用于呈现字符和文字内容，提供信息和标识。 + +主要特征： +- 字体和样式：文本图元可以设置不同的字体、大小、颜色和样式（如粗体、斜体），以满足设计需求。 +- 定位：文本通常通过其align和baseline相对锚点进行定位，允许灵活放置。 +- 行高：可以调整行高，以改善文本的可读性和视觉效果。 + ## 代码演示 ```javascript livedemo template=vrender diff --git a/docs/assets/examples/zh/graphic-text/text-blend.md b/docs/assets/examples/zh/graphic-text/text-blend.md index 108bae2d8..fe371d0a6 100644 --- a/docs/assets/examples/zh/graphic-text/text-blend.md +++ b/docs/assets/examples/zh/graphic-text/text-blend.md @@ -9,6 +9,8 @@ cover: https://lf9-dp-fe-cms-tos.byteorg.com/obj/bit-cloud/vrender/text-blend.pn # text 图元混合 +`text`支持canvas原生的`globalCompositeOperation`系列配置的效果 + ## 代码演示 ```javascript livedemo template=vrender @@ -24,7 +26,7 @@ const t1 = createText({ fontFamily: 'Lato', fontWeight: 'bolder', fill: '#08fff9', - blend: 'lighten', + globalCompositeOperation: 'lighten', x: x, y: y }); @@ -36,7 +38,7 @@ const t2 = createText({ fontSize: 120, fontFamily: 'Lato', fontWeight: 'bolder', - blend: 'lighten', + globalCompositeOperation: 'lighten', fill: '#f00044', x: x + delta, y: y + delta diff --git a/docs/menu.json b/docs/menu.json index a114391b5..ee16bda7e 100644 --- a/docs/menu.json +++ b/docs/menu.json @@ -11,5 +11,10 @@ "menu": "option", "type": "markdown-template", "entry": "option" + }, + { + "menu": "contributing", + "type": "markdown", + "entry": "contributing" } ] From 3cfb14ec9ab864e698f4b26b4b402a2216114d0a Mon Sep 17 00:00:00 2001 From: zhouxinyu Date: Tue, 3 Dec 2024 22:40:43 +0800 Subject: [PATCH 08/21] fix: fix issue with scroll-plugin --- ...ix-scroll-bar-plugin_2024-12-03-14-40.json | 10 +++ .../__tests__/browser/examples/scrollbar.ts | 5 +- .../__tests__/util/render.ts | 5 +- .../src/scrollbar/scrollbar-plugin.ts | 62 ++++++++++++------- packages/vrender-core/src/graphic/group.ts | 5 +- .../contributions/render/draw-contribution.ts | 4 +- 6 files changed, 61 insertions(+), 30 deletions(-) create mode 100644 common/changes/@visactor/vrender-components/fix-scroll-bar-plugin_2024-12-03-14-40.json diff --git a/common/changes/@visactor/vrender-components/fix-scroll-bar-plugin_2024-12-03-14-40.json b/common/changes/@visactor/vrender-components/fix-scroll-bar-plugin_2024-12-03-14-40.json new file mode 100644 index 000000000..0c4924532 --- /dev/null +++ b/common/changes/@visactor/vrender-components/fix-scroll-bar-plugin_2024-12-03-14-40.json @@ -0,0 +1,10 @@ +{ + "changes": [ + { + "packageName": "@visactor/vrender-components", + "comment": "fix: fix issue with scroll-plugin", + "type": "none" + } + ], + "packageName": "@visactor/vrender-components" +} \ No newline at end of file diff --git a/packages/vrender-components/__tests__/browser/examples/scrollbar.ts b/packages/vrender-components/__tests__/browser/examples/scrollbar.ts index adeca7333..04b0d6fc9 100644 --- a/packages/vrender-components/__tests__/browser/examples/scrollbar.ts +++ b/packages/vrender-components/__tests__/browser/examples/scrollbar.ts @@ -44,7 +44,7 @@ export function run() { x: 100, y: 100, fill: 'red', - clip: true, + clip: false, overflow: 'scroll' }); @@ -73,7 +73,8 @@ export function run() { } } - const stage = render([hScrollBar, vScrollBar, group], 'main'); + const stage = render([group], 'main'); + window.stage = stage; hScrollBar.addEventListener('mouseenter', e => { console.log('abc'); hScrollBar.setAttributes({ visible: true }); diff --git a/packages/vrender-components/__tests__/util/render.ts b/packages/vrender-components/__tests__/util/render.ts index 787fbc9b3..22fa3d04c 100644 --- a/packages/vrender-components/__tests__/util/render.ts +++ b/packages/vrender-components/__tests__/util/render.ts @@ -4,8 +4,11 @@ import { Group, Line, Text, createStage, Symbol, Rect, Path, Arc, Area, Circle, import { array } from '@visactor/vutils'; import { initBrowserEnv } from '@visactor/vrender-kits'; +import { loadScrollbar } from '../../src'; initBrowserEnv(); +loadScrollbar(); + export default function render(component: IGraphic | IGraphic[], canvasId: string, option?: Partial) { // 创建舞台实例 const stage = createRenderer(canvasId, option); @@ -26,7 +29,7 @@ export function createRenderer(canvasId: string, option: Partial = width: 600, height: 600, autoRender: true, - disableDirtyBounds: true, + disableDirtyBounds: false, // canvasControled: false, background: 'rgba(238,238,238,0.5)', viewBox: { diff --git a/packages/vrender-components/src/scrollbar/scrollbar-plugin.ts b/packages/vrender-components/src/scrollbar/scrollbar-plugin.ts index 3598af95c..b829ef2a9 100644 --- a/packages/vrender-components/src/scrollbar/scrollbar-plugin.ts +++ b/packages/vrender-components/src/scrollbar/scrollbar-plugin.ts @@ -40,7 +40,10 @@ export class ScrollBarPlugin implements IPlugin { this.params = ScrollBarPlugin.defaultParams; } scroll = (e: { deltaX: number; deltaY: number; target: IGraphic }) => { + // 计算子元素的bounds const graphic = e.target as any; + // childrenBounds.set(0, 0, scrollContainer.AABBBounds.width(), scrollContainer.AABBBounds.height()); + const data = this.getScrollContainer(graphic); if (!data && !this.scrollContainer) { @@ -72,8 +75,13 @@ export class ScrollBarPlugin implements IPlugin { } this.scrollContainer = data ?? this.scrollContainer; - + if (!data) { + return; + } const scrollContainer = data.g; + if (!scrollContainer) { + return; + } const { width, height, scrollX = 0, scrollY = 0 } = scrollContainer.attribute; let newScrollX = scrollX; let newScrollY = scrollY; @@ -94,34 +102,32 @@ export class ScrollBarPlugin implements IPlugin { } } - // 计算子元素的bounds - const childrenBounds = this.childrenBounds; - - childrenBounds.clear(); - childrenBounds.set(0, 0, scrollContainer.AABBBounds.width(), scrollContainer.AABBBounds.height()); - - const scrollWidth = childrenBounds.width(); - const scrollHeight = childrenBounds.height(); + const scrollWidth = this.childrenBounds.width(); + const scrollHeight = this.childrenBounds.height(); if (showH) { - newScrollX = Math.max(Math.min((e.deltaX ?? 0) - scrollX, scrollWidth - width), 0); - } else { - newScrollX = -scrollX; + newScrollX = scrollX - (e.deltaX ?? 0); + if (newScrollX > 0) { + newScrollX = 0; + } else if (newScrollX < width - scrollWidth) { + newScrollX = width - scrollWidth; + } } if (showV) { - newScrollY = Math.max(Math.min((e.deltaY ?? 0) - scrollY, scrollHeight - height), 0); - } else { - newScrollY = -scrollY; + newScrollY = scrollY - (e.deltaY ?? 0); + if (newScrollY > 0) { + newScrollY = 0; + } else if (newScrollY < height - scrollHeight) { + newScrollY = height - scrollHeight; + } } - childrenBounds.translate(-newScrollX, -newScrollY); - - this.addOrUpdateScroll(showH, showV, scrollContainer.parent, scrollContainer); scrollContainer.setAttributes({ - scrollX: -newScrollX, - scrollY: -newScrollY + scrollX: newScrollX, + scrollY: newScrollY }); + this.addOrUpdateScroll(showH, showV, scrollContainer.parent, scrollContainer); }; handleScrollBarChange = (params: any) => { @@ -241,15 +247,16 @@ export class ScrollBarPlugin implements IPlugin { } const childrenBounds = this.childrenBounds; + const { scrollX, scrollY } = scrollContainer.attribute; if (isHorozntal) { const ratio = Math.min(this.scrollContainerBounds.width() / childrenBounds.width(), 1); - const start = Math.max(Math.min(this.childrenBounds.x1 / this.childrenBounds.width(), 0), ratio - 1); + const start = Math.max(Math.min(scrollX / this.childrenBounds.width(), 0), ratio - 1); attrs.x = x + dx; attrs.y = y + dy + height - this.scrollContainerBounds.height(); attrs.range = [-start, -start + ratio]; } else { const ratio = Math.min(this.scrollContainerBounds.height() / childrenBounds.height(), 1); - const start = Math.max(Math.min(this.childrenBounds.y1 / this.childrenBounds.height(), 0), ratio - 1); + const start = Math.max(Math.min(scrollY / this.childrenBounds.height(), 0), ratio - 1); attrs.x = x + dx + width - this.scrollContainerBounds.width(); attrs.y = y + dy; attrs.range = [-start, -start + ratio]; @@ -297,13 +304,20 @@ export class ScrollBarPlugin implements IPlugin { showV = !showH; } + const childrenBounds = this.childrenBounds; + + childrenBounds.clear(); + g.forEachChildren((g: IGraphic) => { + childrenBounds.union(g.AABBBounds); + }); + if (!g.AABBBounds.empty()) { if (showH) { - showH = width < g.AABBBounds.width(); + showH = width < childrenBounds.width(); } if (showV) { - showV = height < g.AABBBounds.height(); + showV = height < childrenBounds.height(); } } diff --git a/packages/vrender-core/src/graphic/group.ts b/packages/vrender-core/src/graphic/group.ts index 5313511e4..021300b93 100644 --- a/packages/vrender-core/src/graphic/group.ts +++ b/packages/vrender-core/src/graphic/group.ts @@ -184,7 +184,7 @@ export class Group extends Graphic implements IGroup { const originalAABBBounds = aabbBounds; // fix aabbbounds update error in flex layout aabbBounds = aabbBounds.clone(); - const { width, height, path, clip = groupTheme.clip, display } = attribute; + const { width, height, path, clip = groupTheme.clip } = attribute; // 添加自身的fill或者clip if (path && path.length) { path.forEach(g => { @@ -198,6 +198,9 @@ export class Group extends Graphic implements IGroup { this.forEachChildren((node: IGraphic) => { aabbBounds.union(node.AABBBounds); }); + // 如果没有clip的话，还需要加一下scroll + const { scrollX = 0, scrollY = 0 } = attribute; + aabbBounds.translate(scrollX, scrollY); } application.graphicService.updateTempAABBBounds(aabbBounds); diff --git a/packages/vrender-core/src/render/contributions/render/draw-contribution.ts b/packages/vrender-core/src/render/contributions/render/draw-contribution.ts index 0d5ac268a..70b9e9f05 100644 --- a/packages/vrender-core/src/render/contributions/render/draw-contribution.ts +++ b/packages/vrender-core/src/render/contributions/render/draw-contribution.ts @@ -356,8 +356,8 @@ export class DefaultDrawContribution implements IDrawContribution { if (retrans) { tempBounds = this.dirtyBounds.clone(); // 变换dirtyBounds - const m = graphic.globalTransMatrix.getInverse(); - this.dirtyBounds.copy(this.backupDirtyBounds).transformWithMatrix(m); + // const m = graphic.globalTransMatrix.getInverse(); + // this.dirtyBounds.copy(this.backupDirtyBounds).transformWithMatrix(m); this.dirtyBounds.translate(-scrollX, -scrollY); } } From 004d8b7d223ac19d13de9e3d434fb260109c0152 Mon Sep 17 00:00:00 2001 From: aluo Date: Wed, 4 Dec 2024 18:20:49 +0800 Subject: [PATCH 09/21] fix: fix product name references in Getting_Started.md - Correct VChart to VRender in document conclusion --- docs/assets/guide/zh/asd/Getting_Started.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/assets/guide/zh/asd/Getting_Started.md b/docs/assets/guide/zh/asd/Getting_Started.md index 327f53f25..7afb0a681 100644 --- a/docs/assets/guide/zh/asd/Getting_Started.md +++ b/docs/assets/guide/zh/asd/Getting_Started.md @@ -104,4 +104,4 @@ circle.addEventListener('click', () => { stage.defaultLayer.add(circle); ``` -希望这篇教程对你学习如何使用 VChart 有所帮助。现在，你可以尝试绘制不同类型的图表，并通过深入了解 VChart 的各种配置选项，定制出更加丰富多样的图表效果。勇敢开始你的 VChart 之旅吧！ \ No newline at end of file +希望这篇教程对你学习如何使用 VRender 有所帮助。现在，你可以尝试绘制不同类型的图元，并通过深入了解 VRender 的各种配置选项，定制出更加丰富多样的绘图效果。勇敢开始你的 VRender 之旅吧！ From b1dd89930bc1bcc1a20503f51db6404a9994b829 Mon Sep 17 00:00:00 2001 From: zhouxinyu Date: Wed, 4 Dec 2024 20:17:20 +0800 Subject: [PATCH 10/21] fix: fix issue with scroll-bar bounds calc --- .../src/scrollbar/scrollbar-plugin.ts | 2 +- .../contributions/render/draw-contribution.ts | 39 +++++++++++++------ 2 files changed, 28 insertions(+), 13 deletions(-) diff --git a/packages/vrender-components/src/scrollbar/scrollbar-plugin.ts b/packages/vrender-components/src/scrollbar/scrollbar-plugin.ts index b829ef2a9..6201ce2bf 100644 --- a/packages/vrender-components/src/scrollbar/scrollbar-plugin.ts +++ b/packages/vrender-components/src/scrollbar/scrollbar-plugin.ts @@ -252,7 +252,7 @@ export class ScrollBarPlugin implements IPlugin { const ratio = Math.min(this.scrollContainerBounds.width() / childrenBounds.width(), 1); const start = Math.max(Math.min(scrollX / this.childrenBounds.width(), 0), ratio - 1); attrs.x = x + dx; - attrs.y = y + dy + height - this.scrollContainerBounds.height(); + attrs.y = y + dy + height - (attrs.height ?? 0); attrs.range = [-start, -start + ratio]; } else { const ratio = Math.min(this.scrollContainerBounds.height() / childrenBounds.height(), 1); diff --git a/packages/vrender-core/src/render/contributions/render/draw-contribution.ts b/packages/vrender-core/src/render/contributions/render/draw-contribution.ts index 70b9e9f05..b3f066399 100644 --- a/packages/vrender-core/src/render/contributions/render/draw-contribution.ts +++ b/packages/vrender-core/src/render/contributions/render/draw-contribution.ts @@ -46,6 +46,8 @@ export class DefaultDrawContribution implements IDrawContribution { declare global: IGlobal; declare layerService: ILayerService; + declare scrollMatrix?: IMatrix; + constructor( // @inject(ContributionProvider) // @named(GraphicRender) @@ -347,23 +349,32 @@ export class DefaultDrawContribution implements IDrawContribution { return; } - let retrans: boolean = false; - let tempBounds: IAABBBounds; + let retrans: boolean = this.scrollMatrix && (this.scrollMatrix.e !== 0 || this.scrollMatrix.f !== 0); + let tempBounds: IBounds; if (graphic.parent) { const { scrollX = 0, scrollY = 0 } = graphic.parent.attribute; - retrans = !!(scrollX || scrollY); - if (retrans) { - tempBounds = this.dirtyBounds.clone(); - // 变换dirtyBounds - // const m = graphic.globalTransMatrix.getInverse(); - // this.dirtyBounds.copy(this.backupDirtyBounds).transformWithMatrix(m); - this.dirtyBounds.translate(-scrollX, -scrollY); + if (!!(scrollX || scrollY)) { + retrans = true; + if (!this.scrollMatrix) { + this.scrollMatrix = matrixAllocate.allocate(1, 0, 0, 1, 0, 0); + } + this.scrollMatrix.translate(-scrollX, -scrollY); } } + // 需要二次变化，那就重新算一个变换后的Bounds + if (retrans) { + tempBounds = this.dirtyBounds.clone().transformWithMatrix(this.scrollMatrix); + } - if (this.useDirtyBounds && !(graphic.isContainer || isRectIntersect(graphic.AABBBounds, this.dirtyBounds, false))) { - retrans && this.dirtyBounds.copy(tempBounds); + if ( + this.useDirtyBounds && + !(graphic.isContainer || isRectIntersect(graphic.AABBBounds, tempBounds ?? this.dirtyBounds, false)) + ) { + if (retrans && graphic.parent) { + const { scrollX = 0, scrollY = 0 } = graphic.parent.attribute; + this.scrollMatrix && this.scrollMatrix.translate(scrollX, scrollY); + } return; } @@ -378,7 +389,11 @@ export class DefaultDrawContribution implements IDrawContribution { renderer.draw(graphic, this.currentRenderService, drawContext, params); } - retrans && this.dirtyBounds.copy(tempBounds); + // retrans && this.dirtyBounds.copy(tempBounds); + if (retrans && graphic.parent) { + const { scrollX = 0, scrollY = 0 } = graphic.parent.attribute; + this.scrollMatrix && this.scrollMatrix.translate(scrollX, scrollY); + } // 添加拦截器 if (this.InterceptorContributions.length) { From 2032eaedb2102d1b5c9eee397cc96dc20ab65206 Mon Sep 17 00:00:00 2001 From: xiaoluoHe Date: Thu, 5 Dec 2024 11:21:39 +0800 Subject: [PATCH 11/21] feat: support `restorePosition` in position/bound label overlap strategy --- .../src/label/overlap/place.ts | 21 ++++++++++++------- packages/vrender-components/src/label/type.ts | 12 +++++++++++ 2 files changed, 25 insertions(+), 8 deletions(-) diff --git a/packages/vrender-components/src/label/overlap/place.ts b/packages/vrender-components/src/label/overlap/place.ts index 14d8e4439..c8b1e2bb9 100644 --- a/packages/vrender-components/src/label/overlap/place.ts +++ b/packages/vrender-components/src/label/overlap/place.ts @@ -84,16 +84,21 @@ export function placeToCandidates( text: Text, candidates: PointLocationCfg[] = [], clampForce = true, - pad = 0 + pad = 0, + changePosition = false ): PointLocationCfg | false { const validCandidates = candidates.filter(candidate => isValid(candidate)); for (let i = 0; i < validCandidates.length; i++) { - const tempText = text.clone(); - tempText.setAttributes(validCandidates[i]); - tempText.update(); + let measureText; + if (changePosition) { + measureText = text; + } else { + measureText = text.clone(); + } + measureText.setAttributes(validCandidates[i]); - if (canPlace($, bitmap, tempText.AABBBounds, clampForce, pad)) { - bitmap.setRange(boundToRange($, tempText.AABBBounds, true)); + if (canPlace($, bitmap, measureText.AABBBounds, clampForce, pad)) { + bitmap.setRange(boundToRange($, measureText.AABBBounds, true)); return validCandidates[i]; } } @@ -113,11 +118,11 @@ export function place( const overlapPadding = (attrs.overlap as OverlapAttrs)?.overlapPadding; if (s.type === 'bound' || s.type === 'position') { if (isFunction(labeling)) { - // TODO：这里可以 filter 掉初始位置，提升一部分性能 const userPosition = isFunction(s.position) ? s.position(text.attribute) : s.position; const positions = (userPosition || defaultLabelPosition(attrs.type)) as string[]; const candidates = positions.map(p => labeling(text.AABBBounds, bounds, p, attrs.offset) as PointLocationCfg); - return placeToCandidates($, bitmap, text, candidates, clampForce, overlapPadding); + const shouldClone = s.restorePosition === false; + return placeToCandidates($, bitmap, text, candidates, clampForce, overlapPadding, shouldClone); } return false; } diff --git a/packages/vrender-components/src/label/type.ts b/packages/vrender-components/src/label/type.ts index 53006cf99..56c821450 100644 --- a/packages/vrender-components/src/label/type.ts +++ b/packages/vrender-components/src/label/type.ts @@ -288,6 +288,12 @@ export type PositionStrategy = { */ type: 'position'; position?: Functional; + /** + * 当 position 内的备选位置依然无法放下标签时，标签是否放回原位。 + * 默认为 true，若为 false，则标签会被放在 position 数组的最后一个位置。 + * @default true + */ + restorePosition?: boolean; }; export type BoundStrategy = { @@ -297,6 +303,12 @@ export type BoundStrategy = { */ type: 'bound'; position?: Functional; + /** + * 当 position 内的备选位置依然无法放下标签时，标签是否放回原位。 + * 默认为 true，若为 false，则标签会被放在 position 数组的最后一个位置。 + * @default true + */ + restorePosition?: boolean; }; export type MoveYStrategy = { From a41c75aeb90fc10325283935fe67875ed4a5fc5b Mon Sep 17 00:00:00 2001 From: xiaoluoHe Date: Thu, 5 Dec 2024 11:22:31 +0800 Subject: [PATCH 12/21] docs: add changelog --- .../feat-area-label_2024-12-05-03-22.json | 10 ++++++++++ 1 file changed, 10 insertions(+) create mode 100644 common/changes/@visactor/vrender-components/feat-area-label_2024-12-05-03-22.json diff --git a/common/changes/@visactor/vrender-components/feat-area-label_2024-12-05-03-22.json b/common/changes/@visactor/vrender-components/feat-area-label_2024-12-05-03-22.json new file mode 100644 index 000000000..cba07a481 --- /dev/null +++ b/common/changes/@visactor/vrender-components/feat-area-label_2024-12-05-03-22.json @@ -0,0 +1,10 @@ +{ + "changes": [ + { + "packageName": "@visactor/vrender-components", + "comment": "feat: support `restorePosition` in position/bound label overlap strategy", + "type": "none" + } + ], + "packageName": "@visactor/vrender-components" +} \ No newline at end of file From dc8686924085f21261a3c7ec7b73b4d06f1af2d8 Mon Sep 17 00:00:00 2001 From: xiaoluoHe Date: Thu, 5 Dec 2024 14:23:12 +0800 Subject: [PATCH 13/21] fix: add comment --- packages/vrender-components/src/label/type.ts | 2 ++ 1 file changed, 2 insertions(+) diff --git a/packages/vrender-components/src/label/type.ts b/packages/vrender-components/src/label/type.ts index 56c821450..f8f316e4b 100644 --- a/packages/vrender-components/src/label/type.ts +++ b/packages/vrender-components/src/label/type.ts @@ -291,6 +291,7 @@ export type PositionStrategy = { /** * 当 position 内的备选位置依然无法放下标签时，标签是否放回原位。 * 默认为 true，若为 false，则标签会被放在 position 数组的最后一个位置。 + * @since 0.20.18 * @default true */ restorePosition?: boolean; @@ -306,6 +307,7 @@ export type BoundStrategy = { /** * 当 position 内的备选位置依然无法放下标签时，标签是否放回原位。 * 默认为 true，若为 false，则标签会被放在 position 数组的最后一个位置。 + * @since 0.20.18 * @default true */ restorePosition?: boolean; From 2bff9cad7cac9508aa5194b2e353ebdf5e3b216d Mon Sep 17 00:00:00 2001 From: xiaoluoHe Date: Thu, 5 Dec 2024 14:36:46 +0800 Subject: [PATCH 14/21] feat: optimize shiftY --- packages/vrender-components/src/label/base.ts | 58 ++++++++++++------- .../src/label/overlap/shiftY.ts | 12 ++-- 2 files changed, 43 insertions(+), 27 deletions(-) diff --git a/packages/vrender-components/src/label/base.ts b/packages/vrender-components/src/label/base.ts index 08ed969f4..ec4d916cc 100644 --- a/packages/vrender-components/src/label/base.ts +++ b/packages/vrender-components/src/label/base.ts @@ -550,9 +550,15 @@ export class LabelBase extends AbstractComponent { const text = result[i]; const bounds = text.AABBBounds; const range = boundToRange(bmpTool, bounds, true); - if (canPlace(bmpTool, bitmap, bounds, clampForce, text._isClamped ? 0 : overlapPadding)) { + if (canPlace(bmpTool, bitmap, bounds, clampForce, overlapPadding)) { bitmap.setRange(range); } else { + if (clampForce) { + const placedAfterClampForce = this._processClampForce(text as IText, bmpTool, bitmap); + if (placedAfterClampForce) { + continue; + } + } if (hideOnHit) { text.setAttributes({ visible: false }); } else { @@ -563,6 +569,34 @@ export class LabelBase extends AbstractComponent { return result; } + protected _processClampForce(text: IText, bmpTool: BitmapTool, bitmap: Bitmap) { + const { dy = 0, dx = 0 } = clampText(text as IText, bmpTool.width, bmpTool.height, bmpTool.padding); + if (dx === 0 && dy === 0) { + if (canPlace(bmpTool, bitmap, text.AABBBounds)) { + // xy方向偏移都为0，意味着不考虑 overlapPadding 时，实际上可以放得下 + bitmap.setRange(boundToRange(bmpTool, text.AABBBounds, true)); + return true; + } + } else if ( + canPlace( + bmpTool, + bitmap, + { + x1: text.AABBBounds.x1 + dx, + x2: text.AABBBounds.x2 + dx, + y1: text.AABBBounds.y1 + dy, + y2: text.AABBBounds.y2 + dy + } + // 向内 clamp 只处理超出的位移量，不叠加 overlapPadding + ) + ) { + text.setAttributes({ x: text.attribute.x + dx, y: text.attribute.y + dy }); + bitmap.setRange(boundToRange(bmpTool, text.AABBBounds, true)); + return true; + } + return false; + } + protected _overlapByStrategy( labels: (IText | IRichText)[], option: OverlapAttrs, @@ -658,29 +692,11 @@ export class LabelBase extends AbstractComponent { // 向内挤压不考虑 overlapPadding const { dx = 0, dy = 0 } = clampText(text as IText, bmpTool.width, bmpTool.height, bmpTool.padding); if (dx === 0 && dy === 0) { - if (canPlace(bmpTool, bitmap, text.AABBBounds)) { - // xy方向偏移都为0，意味着不考虑 overlapPadding 时，实际上可以放得下 - bitmap.setRange(boundToRange(bmpTool, text.AABBBounds, true)); + const placedAfterClampForce = this._processClampForce(text as IText, bmpTool, bitmap); + if (placedAfterClampForce) { result.push(text); continue; } - } else if ( - canPlace( - bmpTool, - bitmap, - { - x1: text.AABBBounds.x1 + dx, - x2: text.AABBBounds.x2 + dx, - y1: text.AABBBounds.y1 + dy, - y2: text.AABBBounds.y2 + dy - } - // 向内 clamp 只处理超出的位移量，不叠加 overlapPadding - ) - ) { - text.setAttributes({ x: text.attribute.x + dx, y: text.attribute.y + dy }); - bitmap.setRange(boundToRange(bmpTool, text.AABBBounds, true)); - result.push(text); - continue; } } diff --git a/packages/vrender-components/src/label/overlap/shiftY.ts b/packages/vrender-components/src/label/overlap/shiftY.ts index 5559daf0c..b4cbfb9b7 100644 --- a/packages/vrender-components/src/label/overlap/shiftY.ts +++ b/packages/vrender-components/src/label/overlap/shiftY.ts @@ -103,17 +103,17 @@ export function shiftY(texts: IText[], option: IShiftYOption) { }; function adjustPositionInOneGroup(texts: IText[]) { - if (texts.length === 1) { - return; - } // 从最后一个 text 向前遍历，如果与前一个 text 相交，则尝试放到下方（需要判断和前一个 text 是否相交，若相交则不能放到下方） - for (let i = texts.length - 1; i > 0; i--) { + for (let i = texts.length - 1; i >= 0; i--) { const curText = texts[i]; const upperText = texts[i - 1]; const lowerText = texts[i + 1]; - // 当前 text 和上面一个 text 相交 - if (isIntersect(getY1(upperText) + getHeight(upperText), getY1(curText))) { + if ( + (upperText && isIntersect(getY1(upperText) + getHeight(upperText), getY1(curText))) || + // 如果是最顶上被 clamp 进来的 text，也尝试向下摆放 + (getY1(curText) === 0 && curText._isClamped) + ) { const { y } = labelling(curText); // 挪动当前 text 后， 和下面一个 text 不相交 if (!lowerText || !isIntersect(y + getHeight(curText) / 2, getY1(lowerText))) { From 08d0f6a349030c066a4be8a734e3b09c9841cf9c Mon Sep 17 00:00:00 2001 From: zhouxinyu Date: Thu, 5 Dec 2024 15:01:42 +0800 Subject: [PATCH 15/21] fix: fix issue with richtext default font --- .../fix-richtext-default-font_2024-12-05-07-02.json | 10 ++++++++++ packages/vrender-core/src/constants.ts | 4 ++++ packages/vrender-core/src/graphic/richtext/utils.ts | 5 +++-- 3 files changed, 17 insertions(+), 2 deletions(-) create mode 100644 common/changes/@visactor/vrender-core/fix-richtext-default-font_2024-12-05-07-02.json diff --git a/common/changes/@visactor/vrender-core/fix-richtext-default-font_2024-12-05-07-02.json b/common/changes/@visactor/vrender-core/fix-richtext-default-font_2024-12-05-07-02.json new file mode 100644 index 000000000..6399e845d --- /dev/null +++ b/common/changes/@visactor/vrender-core/fix-richtext-default-font_2024-12-05-07-02.json @@ -0,0 +1,10 @@ +{ + "changes": [ + { + "packageName": "@visactor/vrender-core", + "comment": "fix: fix issue with richtext default font", + "type": "none" + } + ], + "packageName": "@visactor/vrender-core" +} \ No newline at end of file diff --git a/packages/vrender-core/src/constants.ts b/packages/vrender-core/src/constants.ts index 888462379..55ce99357 100644 --- a/packages/vrender-core/src/constants.ts +++ b/packages/vrender-core/src/constants.ts @@ -1,2 +1,6 @@ export const EnvContribution = Symbol.for('EnvContribution'); export const VGlobal = Symbol.for('VGlobal'); + +export const DEFAULT_TEXT_FONT_FAMILY = + // eslint-disable-next-line max-len + 'PingFang SC,Helvetica Neue,Microsoft Yahei,system-ui,-apple-system,segoe ui,Roboto,Helvetica,Arial,sans-serif,apple color emoji,segoe ui emoji,segoe ui symbol'; diff --git a/packages/vrender-core/src/graphic/richtext/utils.ts b/packages/vrender-core/src/graphic/richtext/utils.ts index ed9303af9..44bf509bf 100644 --- a/packages/vrender-core/src/graphic/richtext/utils.ts +++ b/packages/vrender-core/src/graphic/richtext/utils.ts @@ -2,6 +2,7 @@ import type { IBoundsLike } from '@visactor/vutils'; import { application } from '../../application'; import { createColor } from '../../common/canvas-utils'; import type { IContext2d, ITextStyleParams, IRichTextParagraphCharacter } from '../../interface'; +import { DEFAULT_TEXT_FONT_FAMILY } from '../../constants'; export const DIRECTION_KEY = { horizontal: { @@ -26,7 +27,7 @@ export const DIRECTION_KEY = { const defaultFormatting = { fontSize: 16, - fontFamily: 'sans-serif', + fontFamily: DEFAULT_TEXT_FONT_FAMILY, fill: true, stroke: false, fontWeight: 'normal', @@ -57,7 +58,7 @@ const setTextStyle = (ctx: IContext2d, character: IRichTextParagraphCharacter) = fontStyle: character.fontStyle || '', fontWeight: character.fontWeight || '', fontSize, - fontFamily: character.fontFamily || 'sans-serif' + fontFamily: character.fontFamily } as ITextStyleParams); }; From 9c9a09125a04d8ce637a9088e4523ae99e873987 Mon Sep 17 00:00:00 2001 From: xile611 Date: Thu, 5 Dec 2024 15:24:13 +0800 Subject: [PATCH 16/21] chore: update macOS-12 to macOS-13 in workflow --- .github/workflows/hotfix-release.yml | 2 +- .github/workflows/pre-release.yml | 2 +- .github/workflows/release-changelog.yml | 2 +- .github/workflows/release.yml | 2 +- .github/workflows/sync-main-to-develop.yml | 2 +- .github/workflows/unit-test.yml | 2 +- 6 files changed, 6 insertions(+), 6 deletions(-) diff --git a/.github/workflows/hotfix-release.yml b/.github/workflows/hotfix-release.yml index 08533f132..d5c2ce28b 100644 --- a/.github/workflows/hotfix-release.yml +++ b/.github/workflows/hotfix-release.yml @@ -7,7 +7,7 @@ on: jobs: build: - runs-on: macOS-12 # 如果用了electron，记得改成 macOS-latest + runs-on: macOS-13 # 如果用了electron，记得改成 macOS-latest permissions: contents: write pull-requests: write diff --git a/.github/workflows/pre-release.yml b/.github/workflows/pre-release.yml index 2cdac14b6..b2a20d764 100644 --- a/.github/workflows/pre-release.yml +++ b/.github/workflows/pre-release.yml @@ -9,7 +9,7 @@ on: jobs: build: - runs-on: macOS-12 # 如果用了electron，记得改成 macOS-latest + runs-on: macOS-13 # 如果用了electron，记得改成 macOS-latest permissions: contents: write diff --git a/.github/workflows/release-changelog.yml b/.github/workflows/release-changelog.yml index 2f307bafc..4d5dd5294 100644 --- a/.github/workflows/release-changelog.yml +++ b/.github/workflows/release-changelog.yml @@ -7,7 +7,7 @@ on: jobs: update-changelog-after-publish-a-release: name: GitHub Actions Test - runs-on: macOS-12 + runs-on: macOS-13 strategy: matrix: diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml index e9910136a..711899fce 100644 --- a/.github/workflows/release.yml +++ b/.github/workflows/release.yml @@ -7,7 +7,7 @@ on: jobs: build: - runs-on: macOS-12 # 如果用了electron，记得改成 macOS-latest + runs-on: macOS-13 # 如果用了electron，记得改成 macOS-latest permissions: contents: write pull-requests: write diff --git a/.github/workflows/sync-main-to-develop.yml b/.github/workflows/sync-main-to-develop.yml index 7fe1a18ba..8b84b6160 100644 --- a/.github/workflows/sync-main-to-develop.yml +++ b/.github/workflows/sync-main-to-develop.yml @@ -11,7 +11,7 @@ jobs: if_merged: if: github.event.pull_request.merged == true - runs-on: macOS-12 + runs-on: macOS-13 permissions: contents: write diff --git a/.github/workflows/unit-test.yml b/.github/workflows/unit-test.yml index f451bb6b4..4b8271e2b 100644 --- a/.github/workflows/unit-test.yml +++ b/.github/workflows/unit-test.yml @@ -10,7 +10,7 @@ on: jobs: build: runs-on: - - macOS-12 + - macOS-13 strategy: matrix: From 82b42a5b60ef0abbd7df990b11cd2fb4746a235a Mon Sep 17 00:00:00 2001 From: xiaoluoHe Date: Thu, 5 Dec 2024 15:36:37 +0800 Subject: [PATCH 17/21] fix: clampForce refactor --- packages/vrender-components/src/label/base.ts | 12 ++++-------- 1 file changed, 4 insertions(+), 8 deletions(-) diff --git a/packages/vrender-components/src/label/base.ts b/packages/vrender-components/src/label/base.ts index ec4d916cc..a98b0d50a 100644 --- a/packages/vrender-components/src/label/base.ts +++ b/packages/vrender-components/src/label/base.ts @@ -689,14 +689,10 @@ export class LabelBase extends AbstractComponent { // 尝试向内挤压 if (!hasPlace && clampForce) { - // 向内挤压不考虑 overlapPadding - const { dx = 0, dy = 0 } = clampText(text as IText, bmpTool.width, bmpTool.height, bmpTool.padding); - if (dx === 0 && dy === 0) { - const placedAfterClampForce = this._processClampForce(text as IText, bmpTool, bitmap); - if (placedAfterClampForce) { - result.push(text); - continue; - } + const placedAfterClampForce = this._processClampForce(text as IText, bmpTool, bitmap); + if (placedAfterClampForce) { + result.push(text); + continue; } } From 2e908fc58e533f5d22fb9ed5dcbd8d8531778892 Mon Sep 17 00:00:00 2001 From: zhouxinyu Date: Thu, 5 Dec 2024 15:41:35 +0800 Subject: [PATCH 18/21] feat: upgrade vutils to 0.19.2 --- common/config/rush/pnpm-lock.yaml | 42 +++++++++++------------ docs/demos/package.json | 2 +- docs/package.json | 2 +- packages/react-vrender-utils/package.json | 2 +- packages/react-vrender/package.json | 2 +- packages/vrender-components/package.json | 6 ++-- packages/vrender-core/package.json | 2 +- packages/vrender-kits/package.json | 2 +- packages/vrender/package.json | 2 +- 9 files changed, 31 insertions(+), 31 deletions(-) diff --git a/common/config/rush/pnpm-lock.yaml b/common/config/rush/pnpm-lock.yaml index 919854125..d7229eafb 100644 --- a/common/config/rush/pnpm-lock.yaml +++ b/common/config/rush/pnpm-lock.yaml @@ -15,7 +15,7 @@ importers: '@visactor/vchart': 1.3.0 '@visactor/vgrammar': ~0.5.7 '@visactor/vrender': workspace:0.21.0 - '@visactor/vutils': ~0.19.1 + '@visactor/vutils': ~0.19.2 '@vitejs/plugin-react': 3.1.0 axios: ^1.4.0 chalk: ^3.0.0 @@ -38,7 +38,7 @@ importers: '@visactor/vchart': 1.3.0 '@visactor/vgrammar': 0.5.7 '@visactor/vrender': link:../packages/vrender - '@visactor/vutils': 0.19.1 + '@visactor/vutils': 0.19.2 axios: 1.7.8 highlight.js: 11.10.0 lodash: 4.17.21 @@ -72,7 +72,7 @@ importers: '@types/react-dom': ^18.0.0 '@types/react-reconciler': ^0.28.2 '@visactor/vrender': workspace:0.21.0 - '@visactor/vutils': ~0.19.1 + '@visactor/vutils': ~0.19.2 '@vitejs/plugin-react': 3.1.0 cross-env: ^7.0.3 eslint: ~8.18.0 @@ -84,7 +84,7 @@ importers: vite: 3.2.6 dependencies: '@visactor/vrender': link:../vrender - '@visactor/vutils': 0.19.1 + '@visactor/vutils': 0.19.2 react-reconciler: 0.29.2_react@18.3.1 tslib: 2.8.1 devDependencies: @@ -113,7 +113,7 @@ importers: '@types/react-dom': ^18.0.0 '@visactor/react-vrender': workspace:0.21.0 '@visactor/vrender': workspace:0.21.0 - '@visactor/vutils': ~0.19.1 + '@visactor/vutils': ~0.19.2 '@vitejs/plugin-react': 3.1.0 cross-env: ^7.0.3 eslint: ~8.18.0 @@ -126,7 +126,7 @@ importers: dependencies: '@visactor/react-vrender': link:../react-vrender '@visactor/vrender': link:../vrender - '@visactor/vutils': 0.19.1 + '@visactor/vutils': 0.19.2 react-reconciler: 0.29.2_react@18.3.1 tslib: 2.8.1 devDependencies: @@ -155,7 +155,7 @@ importers: '@types/react-dom': ^18.0.0 '@visactor/vrender-core': workspace:0.21.0 '@visactor/vrender-kits': workspace:0.21.0 - '@visactor/vutils': ~0.19.1 + '@visactor/vutils': ~0.19.2 '@vitejs/plugin-react': 3.1.0 canvas: 2.11.2 cross-env: ^7.0.3 @@ -179,7 +179,7 @@ importers: '@types/jest': 26.0.24 '@types/react': 18.3.12 '@types/react-dom': 18.3.1 - '@visactor/vutils': 0.19.1 + '@visactor/vutils': 0.19.2 '@vitejs/plugin-react': 3.1.0_vite@3.2.6 canvas: 2.11.2 cross-env: 7.0.3 @@ -202,8 +202,8 @@ importers: '@types/jest': ^26.0.0 '@visactor/vrender-core': workspace:0.21.0 '@visactor/vrender-kits': workspace:0.21.0 - '@visactor/vscale': ~0.19.1 - '@visactor/vutils': ~0.19.1 + '@visactor/vscale': ~0.19.2 + '@visactor/vutils': ~0.19.2 cross-env: ^7.0.3 eslint: ~8.18.0 jest: ^26.0.0 @@ -215,8 +215,8 @@ importers: dependencies: '@visactor/vrender-core': link:../vrender-core '@visactor/vrender-kits': link:../vrender-kits - '@visactor/vscale': 0.19.1 - '@visactor/vutils': 0.19.1 + '@visactor/vscale': 0.19.2 + '@visactor/vutils': 0.19.2 devDependencies: '@internal/bundler': link:../../tools/bundler '@internal/eslint-config': link:../../share/eslint-config @@ -241,7 +241,7 @@ importers: '@types/jest': ^26.0.0 '@types/react': ^18.0.0 '@types/react-dom': ^18.0.0 - '@visactor/vutils': ~0.19.1 + '@visactor/vutils': ~0.19.2 '@vitejs/plugin-react': 3.1.0 color-convert: 2.0.1 cross-env: ^7.0.3 @@ -255,7 +255,7 @@ importers: typescript: 4.9.5 vite: 3.2.6 dependencies: - '@visactor/vutils': 0.19.1 + '@visactor/vutils': 0.19.2 color-convert: 2.0.1 devDependencies: '@internal/bundler': link:../../tools/bundler @@ -288,7 +288,7 @@ importers: '@types/react': ^18.0.0 '@types/react-dom': ^18.0.0 '@visactor/vrender-core': workspace:0.21.0 - '@visactor/vutils': ~0.19.1 + '@visactor/vutils': ~0.19.2 '@vitejs/plugin-react': 3.1.0 canvas: 2.11.2 cross-env: ^7.0.3 @@ -302,7 +302,7 @@ importers: dependencies: '@resvg/resvg-js': 2.4.1 '@visactor/vrender-core': link:../vrender-core - '@visactor/vutils': 0.19.1 + '@visactor/vutils': 0.19.2 roughjs: 4.5.2 devDependencies: '@internal/bundler': link:../../tools/bundler @@ -3409,10 +3409,10 @@ packages: '@visactor/vutils': 0.15.14 dev: false - /@visactor/vscale/0.19.1: - resolution: {integrity: sha512-hPNBP33sTzB/7xxot1FTSnuDmween06iM+JW3j7u/AmdGeMON4cphisEN5iJ5DR5Z9Br5PolvP4vnhemoqlTZw==} + /@visactor/vscale/0.19.2: + resolution: {integrity: sha512-grS2nI/dyky9+YWt6EbtBS7aPiHmJrnGnleeRLvaaa6uZN9ItLsuP7oSv63k1arJzkyJ0xcLH4ze/nZmrWopzA==} dependencies: - '@visactor/vutils': 0.19.1 + '@visactor/vutils': 0.19.2 dev: false /@visactor/vutils/0.13.3: @@ -3431,8 +3431,8 @@ packages: eventemitter3: 4.0.7 dev: false - /@visactor/vutils/0.19.1: - resolution: {integrity: sha512-ydvC2RvRISCsL86tkhyStJpsTX61UCCGN+BzPeMfmDv4cOc5IWJn3MnL3Twgj0lm6irCabEPQyetPSZ4NEmoOw==} + /@visactor/vutils/0.19.2: + resolution: {integrity: sha512-RIg+cZTLvTRNbj0f3pc/4W5ASXhuM6G5XJU4JJ2Ghdqt8YGaGzdLFrqOIu5MaHfm8EuJun0oPapDk8PXt4ZQgQ==} dependencies: '@turf/helpers': 6.5.0 '@turf/invariant': 6.5.0 diff --git a/docs/demos/package.json b/docs/demos/package.json index 825c7b6e0..d7e382216 100644 --- a/docs/demos/package.json +++ b/docs/demos/package.json @@ -12,7 +12,7 @@ "@internal/eslint-config": "workspace:*", "@internal/ts-config": "workspace:*", "@visactor/vrender-kits": "workspace:0.14.8", - "@visactor/vutils": "~0.19.1", + "@visactor/vutils": "~0.19.2", "d3-scale-chromatic": "^3.0.0", "lodash": "4.17.21", "dat.gui": "^0.7.9", diff --git a/docs/package.json b/docs/package.json index d057177d5..31fb7fe94 100644 --- a/docs/package.json +++ b/docs/package.json @@ -11,7 +11,7 @@ "dependencies": { "@arco-design/web-react": "2.46.1", "@visactor/vchart": "1.3.0", - "@visactor/vutils": "~0.19.1", + "@visactor/vutils": "~0.19.2", "@visactor/vgrammar": "~0.5.7", "@visactor/vrender": "workspace:0.21.0", "markdown-it": "^13.0.0", diff --git a/packages/react-vrender-utils/package.json b/packages/react-vrender-utils/package.json index 3a3eac256..4c7e7db2b 100644 --- a/packages/react-vrender-utils/package.json +++ b/packages/react-vrender-utils/package.json @@ -26,7 +26,7 @@ "dependencies": { "@visactor/vrender": "workspace:0.21.0", "@visactor/react-vrender": "workspace:0.21.0", - "@visactor/vutils": "~0.19.1", + "@visactor/vutils": "~0.19.2", "react-reconciler": "^0.29.0", "tslib": "^2.3.1" }, diff --git a/packages/react-vrender/package.json b/packages/react-vrender/package.json index e83271863..cd15a744d 100644 --- a/packages/react-vrender/package.json +++ b/packages/react-vrender/package.json @@ -24,7 +24,7 @@ }, "dependencies": { "@visactor/vrender": "workspace:0.21.0", - "@visactor/vutils": "~0.19.1", + "@visactor/vutils": "~0.19.2", "react-reconciler": "^0.29.0", "tslib": "^2.3.1" }, diff --git a/packages/vrender-components/package.json b/packages/vrender-components/package.json index 9b4accb29..9f720c684 100644 --- a/packages/vrender-components/package.json +++ b/packages/vrender-components/package.json @@ -25,8 +25,8 @@ "build:spec-types": "rm -rf ./spec-types && tsc -p ./tsconfig.spec.json --declaration --emitDeclarationOnly --outDir ./spec-types" }, "dependencies": { - "@visactor/vutils": "~0.19.1", - "@visactor/vscale": "~0.19.1", + "@visactor/vutils": "~0.19.2", + "@visactor/vscale": "~0.19.2", "@visactor/vrender-core": "workspace:0.21.0", "@visactor/vrender-kits": "workspace:0.21.0" }, @@ -35,7 +35,7 @@ "@internal/eslint-config": "workspace:*", "@internal/ts-config": "workspace:*", "@rushstack/eslint-patch": "~1.1.4", - "@visactor/vscale": "~0.19.1", + "@visactor/vscale": "~0.19.2", "@types/jest": "^26.0.0", "jest": "^26.0.0", "jest-electron": "^0.1.12", diff --git a/packages/vrender-core/package.json b/packages/vrender-core/package.json index 0138c9bf7..1b43e8d26 100644 --- a/packages/vrender-core/package.json +++ b/packages/vrender-core/package.json @@ -30,7 +30,7 @@ }, "dependencies": { "color-convert": "2.0.1", - "@visactor/vutils": "~0.19.1" + "@visactor/vutils": "~0.19.2" }, "devDependencies": { "@internal/bundler": "workspace:*", diff --git a/packages/vrender-kits/package.json b/packages/vrender-kits/package.json index 96bcf79d6..c0e81fcf2 100644 --- a/packages/vrender-kits/package.json +++ b/packages/vrender-kits/package.json @@ -20,7 +20,7 @@ "test": "" }, "dependencies": { - "@visactor/vutils": "~0.19.1", + "@visactor/vutils": "~0.19.2", "@visactor/vrender-core": "workspace:0.21.0", "@resvg/resvg-js": "2.4.1", "roughjs": "4.5.2" diff --git a/packages/vrender/package.json b/packages/vrender/package.json index f9e78e7a7..4319277ee 100644 --- a/packages/vrender/package.json +++ b/packages/vrender/package.json @@ -32,7 +32,7 @@ "@internal/eslint-config": "workspace:*", "@internal/ts-config": "workspace:*", "@rushstack/eslint-patch": "~1.1.4", - "@visactor/vutils": "~0.19.1", + "@visactor/vutils": "~0.19.2", "canvas": "2.11.2", "react": "^18.0.0", "react-dom": "^18.0.0", From 2d2b4be8ec525d3512947717c315a5e3ab1dd43b Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" Date: Thu, 5 Dec 2024 07:56:11 +0000 Subject: [PATCH 19/21] build: prelease version 0.21.1 --- .../feat-area-label_2024-12-05-03-22.json | 10 ------- ...at-marker-area-label_2024-12-03-06-49.json | 10 ------- ...k-point-symbol-angle_2024-12-01-17-44.json | 10 ------- ...ix-scroll-bar-plugin_2024-12-03-14-40.json | 10 ------- .../feat-vstory_2024-11-21-11-50.json | 10 ------- .../fix-line-link_2024-12-02-04-56.json | 10 ------- ...xt-attribute-opacity_2024-12-02-05-00.json | 10 ------- ...ichtext-default-font_2024-12-05-07-02.json | 10 ------- common/config/rush/pnpm-lock.yaml | 26 +++++++++---------- common/config/rush/version-policies.json | 2 +- docs/package.json | 2 +- packages/react-vrender-utils/CHANGELOG.json | 6 +++++ packages/react-vrender-utils/CHANGELOG.md | 7 ++++- packages/react-vrender-utils/package.json | 6 ++--- packages/react-vrender/CHANGELOG.json | 6 +++++ packages/react-vrender/CHANGELOG.md | 7 ++++- packages/react-vrender/package.json | 4 +-- packages/vrender-components/CHANGELOG.json | 21 +++++++++++++++ packages/vrender-components/CHANGELOG.md | 12 ++++++++- packages/vrender-components/package.json | 6 ++--- packages/vrender-core/CHANGELOG.json | 21 +++++++++++++++ packages/vrender-core/CHANGELOG.md | 12 ++++++++- packages/vrender-core/package.json | 2 +- packages/vrender-kits/CHANGELOG.json | 6 +++++ packages/vrender-kits/CHANGELOG.md | 7 ++++- packages/vrender-kits/package.json | 4 +-- packages/vrender/CHANGELOG.json | 6 +++++ packages/vrender/CHANGELOG.md | 7 ++++- packages/vrender/package.json | 6 ++--- tools/bugserver-trigger/package.json | 8 +++--- 30 files changed, 145 insertions(+), 119 deletions(-) delete mode 100644 common/changes/@visactor/vrender-components/feat-area-label_2024-12-05-03-22.json delete mode 100644 common/changes/@visactor/vrender-components/feat-marker-area-label_2024-12-03-06-49.json delete mode 100644 common/changes/@visactor/vrender-components/fix-mark-point-symbol-angle_2024-12-01-17-44.json delete mode 100644 common/changes/@visactor/vrender-components/fix-scroll-bar-plugin_2024-12-03-14-40.json delete mode 100644 common/changes/@visactor/vrender-core/feat-vstory_2024-11-21-11-50.json delete mode 100644 common/changes/@visactor/vrender-core/fix-line-link_2024-12-02-04-56.json delete mode 100644 common/changes/@visactor/vrender-core/fix-richtext-attribute-opacity_2024-12-02-05-00.json delete mode 100644 common/changes/@visactor/vrender-core/fix-richtext-default-font_2024-12-05-07-02.json diff --git a/common/changes/@visactor/vrender-components/feat-area-label_2024-12-05-03-22.json b/common/changes/@visactor/vrender-components/feat-area-label_2024-12-05-03-22.json deleted file mode 100644 index cba07a481..000000000 --- a/common/changes/@visactor/vrender-components/feat-area-label_2024-12-05-03-22.json +++ /dev/null @@ -1,10 +0,0 @@ -{ - "changes": [ - { - "packageName": "@visactor/vrender-components", - "comment": "feat: support `restorePosition` in position/bound label overlap strategy", - "type": "none" - } - ], - "packageName": "@visactor/vrender-components" -} \ No newline at end of file diff --git a/common/changes/@visactor/vrender-components/feat-marker-area-label_2024-12-03-06-49.json b/common/changes/@visactor/vrender-components/feat-marker-area-label_2024-12-03-06-49.json deleted file mode 100644 index 14aebc2b0..000000000 --- a/common/changes/@visactor/vrender-components/feat-marker-area-label_2024-12-03-06-49.json +++ /dev/null @@ -1,10 +0,0 @@ -{ - "changes": [ - { - "packageName": "@visactor/vrender-components", - "comment": "feat: support vertex point of marker area label. close @VisActor/VChart#3442", - "type": "none" - } - ], - "packageName": "@visactor/vrender-components" -} \ No newline at end of file diff --git a/common/changes/@visactor/vrender-components/fix-mark-point-symbol-angle_2024-12-01-17-44.json b/common/changes/@visactor/vrender-components/fix-mark-point-symbol-angle_2024-12-01-17-44.json deleted file mode 100644 index 371640cae..000000000 --- a/common/changes/@visactor/vrender-components/fix-mark-point-symbol-angle_2024-12-01-17-44.json +++ /dev/null @@ -1,10 +0,0 @@ -{ - "changes": [ - { - "packageName": "@visactor/vrender-components", - "comment": "fix: end symbol angle when arc line in markpoint. fix @VisActor/VChart#3427", - "type": "none" - } - ], - "packageName": "@visactor/vrender-components" -} \ No newline at end of file diff --git a/common/changes/@visactor/vrender-components/fix-scroll-bar-plugin_2024-12-03-14-40.json b/common/changes/@visactor/vrender-components/fix-scroll-bar-plugin_2024-12-03-14-40.json deleted file mode 100644 index 0c4924532..000000000 --- a/common/changes/@visactor/vrender-components/fix-scroll-bar-plugin_2024-12-03-14-40.json +++ /dev/null @@ -1,10 +0,0 @@ -{ - "changes": [ - { - "packageName": "@visactor/vrender-components", - "comment": "fix: fix issue with scroll-plugin", - "type": "none" - } - ], - "packageName": "@visactor/vrender-components" -} \ No newline at end of file diff --git a/common/changes/@visactor/vrender-core/feat-vstory_2024-11-21-11-50.json b/common/changes/@visactor/vrender-core/feat-vstory_2024-11-21-11-50.json deleted file mode 100644 index a592fcdcf..000000000 --- a/common/changes/@visactor/vrender-core/feat-vstory_2024-11-21-11-50.json +++ /dev/null @@ -1,10 +0,0 @@ -{ - "changes": [ - { - "packageName": "@visactor/vrender-core", - "comment": "fix: fix issue with insertAfter and insertBefore", - "type": "none" - } - ], - "packageName": "@visactor/vrender-core" -} \ No newline at end of file diff --git a/common/changes/@visactor/vrender-core/fix-line-link_2024-12-02-04-56.json b/common/changes/@visactor/vrender-core/fix-line-link_2024-12-02-04-56.json deleted file mode 100644 index 26ac318c4..000000000 --- a/common/changes/@visactor/vrender-core/fix-line-link_2024-12-02-04-56.json +++ /dev/null @@ -1,10 +0,0 @@ -{ - "changes": [ - { - "packageName": "@visactor/vrender-core", - "comment": "fix: fix the issue when line is configured to connect, closed #3238", - "type": "none" - } - ], - "packageName": "@visactor/vrender-core" -} diff --git a/common/changes/@visactor/vrender-core/fix-richtext-attribute-opacity_2024-12-02-05-00.json b/common/changes/@visactor/vrender-core/fix-richtext-attribute-opacity_2024-12-02-05-00.json deleted file mode 100644 index eb0cddf3b..000000000 --- a/common/changes/@visactor/vrender-core/fix-richtext-attribute-opacity_2024-12-02-05-00.json +++ /dev/null @@ -1,10 +0,0 @@ -{ - "changes": [ - { - "packageName": "@visactor/vrender-core", - "comment": "fix: fix issue with richtext setAttribute, closed #1578", - "type": "none" - } - ], - "packageName": "@visactor/vrender-core" -} \ No newline at end of file diff --git a/common/changes/@visactor/vrender-core/fix-richtext-default-font_2024-12-05-07-02.json b/common/changes/@visactor/vrender-core/fix-richtext-default-font_2024-12-05-07-02.json deleted file mode 100644 index 6399e845d..000000000 --- a/common/changes/@visactor/vrender-core/fix-richtext-default-font_2024-12-05-07-02.json +++ /dev/null @@ -1,10 +0,0 @@ -{ - "changes": [ - { - "packageName": "@visactor/vrender-core", - "comment": "fix: fix issue with richtext default font", - "type": "none" - } - ], - "packageName": "@visactor/vrender-core" -} \ No newline at end of file diff --git a/common/config/rush/pnpm-lock.yaml b/common/config/rush/pnpm-lock.yaml index d7229eafb..739c21178 100644 --- a/common/config/rush/pnpm-lock.yaml +++ b/common/config/rush/pnpm-lock.yaml @@ -14,7 +14,7 @@ importers: '@types/react-dom': ^18.0.0 '@visactor/vchart': 1.3.0 '@visactor/vgrammar': ~0.5.7 - '@visactor/vrender': workspace:0.21.0 + '@visactor/vrender': workspace:0.21.1 '@visactor/vutils': ~0.19.2 '@vitejs/plugin-react': 3.1.0 axios: ^1.4.0 @@ -71,7 +71,7 @@ importers: '@types/react': ^18.0.0 '@types/react-dom': ^18.0.0 '@types/react-reconciler': ^0.28.2 - '@visactor/vrender': workspace:0.21.0 + '@visactor/vrender': workspace:0.21.1 '@visactor/vutils': ~0.19.2 '@vitejs/plugin-react': 3.1.0 cross-env: ^7.0.3 @@ -111,8 +111,8 @@ importers: '@rushstack/eslint-patch': ~1.1.4 '@types/react': ^18.0.0 '@types/react-dom': ^18.0.0 - '@visactor/react-vrender': workspace:0.21.0 - '@visactor/vrender': workspace:0.21.0 + '@visactor/react-vrender': workspace:0.21.1 + '@visactor/vrender': workspace:0.21.1 '@visactor/vutils': ~0.19.2 '@vitejs/plugin-react': 3.1.0 cross-env: ^7.0.3 @@ -153,8 +153,8 @@ importers: '@types/jest': ^26.0.0 '@types/react': ^18.0.0 '@types/react-dom': ^18.0.0 - '@visactor/vrender-core': workspace:0.21.0 - '@visactor/vrender-kits': workspace:0.21.0 + '@visactor/vrender-core': workspace:0.21.1 + '@visactor/vrender-kits': workspace:0.21.1 '@visactor/vutils': ~0.19.2 '@vitejs/plugin-react': 3.1.0 canvas: 2.11.2 @@ -200,8 +200,8 @@ importers: '@internal/ts-config': workspace:* '@rushstack/eslint-patch': ~1.1.4 '@types/jest': ^26.0.0 - '@visactor/vrender-core': workspace:0.21.0 - '@visactor/vrender-kits': workspace:0.21.0 + '@visactor/vrender-core': workspace:0.21.1 + '@visactor/vrender-kits': workspace:0.21.1 '@visactor/vscale': ~0.19.2 '@visactor/vutils': ~0.19.2 cross-env: ^7.0.3 @@ -287,7 +287,7 @@ importers: '@types/node-fetch': 2.6.4 '@types/react': ^18.0.0 '@types/react-dom': ^18.0.0 - '@visactor/vrender-core': workspace:0.21.0 + '@visactor/vrender-core': workspace:0.21.1 '@visactor/vutils': ~0.19.2 '@vitejs/plugin-react': 3.1.0 canvas: 2.11.2 @@ -369,10 +369,10 @@ importers: '@rushstack/eslint-patch': ~1.1.4 '@types/node': '*' '@types/node-fetch': 2.6.4 - '@visactor/vrender': workspace:0.21.0 - '@visactor/vrender-components': workspace:0.21.0 - '@visactor/vrender-core': workspace:0.21.0 - '@visactor/vrender-kits': workspace:0.21.0 + '@visactor/vrender': workspace:0.21.1 + '@visactor/vrender-components': workspace:0.21.1 + '@visactor/vrender-core': workspace:0.21.1 + '@visactor/vrender-kits': workspace:0.21.1 cross-env: ^7.0.3 eslint: ~8.18.0 form-data: ~4.0.0 diff --git a/common/config/rush/version-policies.json b/common/config/rush/version-policies.json index 6265550bb..dc9457656 100644 --- a/common/config/rush/version-policies.json +++ b/common/config/rush/version-policies.json @@ -1 +1 @@ -[{"definitionName":"lockStepVersion","policyName":"vrenderMain","version":"0.21.0","nextBump":"minor"}] +[{"definitionName":"lockStepVersion","policyName":"vrenderMain","version":"0.21.1","nextBump":"patch"}] diff --git a/docs/package.json b/docs/package.json index 31fb7fe94..fa7473622 100644 --- a/docs/package.json +++ b/docs/package.json @@ -13,7 +13,7 @@ "@visactor/vchart": "1.3.0", "@visactor/vutils": "~0.19.2", "@visactor/vgrammar": "~0.5.7", - "@visactor/vrender": "workspace:0.21.0", + "@visactor/vrender": "workspace:0.21.1", "markdown-it": "^13.0.0", "highlight.js": "^11.8.0", "axios": "^1.4.0", diff --git a/packages/react-vrender-utils/CHANGELOG.json b/packages/react-vrender-utils/CHANGELOG.json index acdb97019..a64b11760 100644 --- a/packages/react-vrender-utils/CHANGELOG.json +++ b/packages/react-vrender-utils/CHANGELOG.json @@ -1,6 +1,12 @@ { "name": "@visactor/react-vrender-utils", "entries": [ + { + "version": "0.21.1", + "tag": "@visactor/react-vrender-utils_v0.21.1", + "date": "Thu, 05 Dec 2024 07:50:46 GMT", + "comments": {} + }, { "version": "0.21.0", "tag": "@visactor/react-vrender-utils_v0.21.0", diff --git a/packages/react-vrender-utils/CHANGELOG.md b/packages/react-vrender-utils/CHANGELOG.md index bda1d8757..05ea94f90 100644 --- a/packages/react-vrender-utils/CHANGELOG.md +++ b/packages/react-vrender-utils/CHANGELOG.md @@ -1,6 +1,11 @@ # Change Log - @visactor/react-vrender-utils -This log was last generated on Thu, 28 Nov 2024 03:30:36 GMT and should not be manually modified. +This log was last generated on Thu, 05 Dec 2024 07:50:46 GMT and should not be manually modified. + +## 0.21.1 +Thu, 05 Dec 2024 07:50:46 GMT + +_Version update only_ ## 0.21.0 Thu, 28 Nov 2024 03:30:36 GMT diff --git a/packages/react-vrender-utils/package.json b/packages/react-vrender-utils/package.json index 4c7e7db2b..bd36b627f 100644 --- a/packages/react-vrender-utils/package.json +++ b/packages/react-vrender-utils/package.json @@ -1,6 +1,6 @@ { "name": "@visactor/react-vrender-utils", - "version": "0.21.0", + "version": "0.21.1", "description": "", "sideEffects": false, "main": "cjs/index.js", @@ -24,8 +24,8 @@ "react-dom": "^18.2.0" }, "dependencies": { - "@visactor/vrender": "workspace:0.21.0", - "@visactor/react-vrender": "workspace:0.21.0", + "@visactor/vrender": "workspace:0.21.1", + "@visactor/react-vrender": "workspace:0.21.1", "@visactor/vutils": "~0.19.2", "react-reconciler": "^0.29.0", "tslib": "^2.3.1" diff --git a/packages/react-vrender/CHANGELOG.json b/packages/react-vrender/CHANGELOG.json index 20fcca5b2..68bf47c02 100644 --- a/packages/react-vrender/CHANGELOG.json +++ b/packages/react-vrender/CHANGELOG.json @@ -1,6 +1,12 @@ { "name": "@visactor/react-vrender", "entries": [ + { + "version": "0.21.1", + "tag": "@visactor/react-vrender_v0.21.1", + "date": "Thu, 05 Dec 2024 07:50:46 GMT", + "comments": {} + }, { "version": "0.21.0", "tag": "@visactor/react-vrender_v0.21.0", diff --git a/packages/react-vrender/CHANGELOG.md b/packages/react-vrender/CHANGELOG.md index 985ab23c8..750bfc604 100644 --- a/packages/react-vrender/CHANGELOG.md +++ b/packages/react-vrender/CHANGELOG.md @@ -1,6 +1,11 @@ # Change Log - @visactor/react-vrender -This log was last generated on Thu, 28 Nov 2024 03:30:36 GMT and should not be manually modified. +This log was last generated on Thu, 05 Dec 2024 07:50:46 GMT and should not be manually modified. + +## 0.21.1 +Thu, 05 Dec 2024 07:50:46 GMT + +_Version update only_ ## 0.21.0 Thu, 28 Nov 2024 03:30:36 GMT diff --git a/packages/react-vrender/package.json b/packages/react-vrender/package.json index cd15a744d..8be3ed039 100644 --- a/packages/react-vrender/package.json +++ b/packages/react-vrender/package.json @@ -1,6 +1,6 @@ { "name": "@visactor/react-vrender", - "version": "0.21.0", + "version": "0.21.1", "description": "", "sideEffects": false, "main": "cjs/index.js", @@ -23,7 +23,7 @@ "react": "^18.2.0" }, "dependencies": { - "@visactor/vrender": "workspace:0.21.0", + "@visactor/vrender": "workspace:0.21.1", "@visactor/vutils": "~0.19.2", "react-reconciler": "^0.29.0", "tslib": "^2.3.1" diff --git a/packages/vrender-components/CHANGELOG.json b/packages/vrender-components/CHANGELOG.json index 00159ce97..658e5a182 100644 --- a/packages/vrender-components/CHANGELOG.json +++ b/packages/vrender-components/CHANGELOG.json @@ -1,6 +1,27 @@ { "name": "@visactor/vrender-components", "entries": [ + { + "version": "0.21.1", + "tag": "@visactor/vrender-components_v0.21.1", + "date": "Thu, 05 Dec 2024 07:50:47 GMT", + "comments": { + "none": [ + { + "comment": "feat: support `restorePosition` in position/bound label overlap strategy" + }, + { + "comment": "feat: support vertex point of marker area label. close @VisActor/VChart#3442" + }, + { + "comment": "fix: end symbol angle when arc line in markpoint. fix @VisActor/VChart#3427" + }, + { + "comment": "fix: fix issue with scroll-plugin" + } + ] + } + }, { "version": "0.21.0", "tag": "@visactor/vrender-components_v0.21.0", diff --git a/packages/vrender-components/CHANGELOG.md b/packages/vrender-components/CHANGELOG.md index f45bf33f0..6734fc366 100644 --- a/packages/vrender-components/CHANGELOG.md +++ b/packages/vrender-components/CHANGELOG.md @@ -1,6 +1,16 @@ # Change Log - @visactor/vrender-components -This log was last generated on Thu, 28 Nov 2024 03:30:36 GMT and should not be manually modified. +This log was last generated on Thu, 05 Dec 2024 07:50:47 GMT and should not be manually modified. + +## 0.21.1 +Thu, 05 Dec 2024 07:50:47 GMT + +### Updates + +- feat: support `restorePosition` in position/bound label overlap strategy +- feat: support vertex point of marker area label. close @VisActor/VChart#3442 +- fix: end symbol angle when arc line in markpoint. fix @VisActor/VChart#3427 +- fix: fix issue with scroll-plugin ## 0.21.0 Thu, 28 Nov 2024 03:30:36 GMT diff --git a/packages/vrender-components/package.json b/packages/vrender-components/package.json index 9f720c684..dcaa29858 100644 --- a/packages/vrender-components/package.json +++ b/packages/vrender-components/package.json @@ -1,6 +1,6 @@ { "name": "@visactor/vrender-components", - "version": "0.21.0", + "version": "0.21.1", "description": "components library for dp visualization", "sideEffects": false, "main": "cjs/index.js", @@ -27,8 +27,8 @@ "dependencies": { "@visactor/vutils": "~0.19.2", "@visactor/vscale": "~0.19.2", - "@visactor/vrender-core": "workspace:0.21.0", - "@visactor/vrender-kits": "workspace:0.21.0" + "@visactor/vrender-core": "workspace:0.21.1", + "@visactor/vrender-kits": "workspace:0.21.1" }, "devDependencies": { "@internal/bundler": "workspace:*", diff --git a/packages/vrender-core/CHANGELOG.json b/packages/vrender-core/CHANGELOG.json index db0c0e91c..1d699eb09 100644 --- a/packages/vrender-core/CHANGELOG.json +++ b/packages/vrender-core/CHANGELOG.json @@ -1,6 +1,27 @@ { "name": "@visactor/vrender-core", "entries": [ + { + "version": "0.21.1", + "tag": "@visactor/vrender-core_v0.21.1", + "date": "Thu, 05 Dec 2024 07:50:47 GMT", + "comments": { + "none": [ + { + "comment": "fix: fix issue with insertAfter and insertBefore" + }, + { + "comment": "fix: fix the issue when line is configured to connect, closed #3238" + }, + { + "comment": "fix: fix issue with richtext setAttribute, closed #1578" + }, + { + "comment": "fix: fix issue with richtext default font" + } + ] + } + }, { "version": "0.21.0", "tag": "@visactor/vrender-core_v0.21.0", diff --git a/packages/vrender-core/CHANGELOG.md b/packages/vrender-core/CHANGELOG.md index 194bfc270..ed7f15751 100644 --- a/packages/vrender-core/CHANGELOG.md +++ b/packages/vrender-core/CHANGELOG.md @@ -1,6 +1,16 @@ # Change Log - @visactor/vrender-core -This log was last generated on Thu, 28 Nov 2024 03:30:36 GMT and should not be manually modified. +This log was last generated on Thu, 05 Dec 2024 07:50:47 GMT and should not be manually modified. + +## 0.21.1 +Thu, 05 Dec 2024 07:50:47 GMT + +### Updates + +- fix: fix issue with insertAfter and insertBefore +- fix: fix the issue when line is configured to connect, closed #3238 +- fix: fix issue with richtext setAttribute, closed #1578 +- fix: fix issue with richtext default font ## 0.21.0 Thu, 28 Nov 2024 03:30:36 GMT diff --git a/packages/vrender-core/package.json b/packages/vrender-core/package.json index 1b43e8d26..fe476c736 100644 --- a/packages/vrender-core/package.json +++ b/packages/vrender-core/package.json @@ -1,6 +1,6 @@ { "name": "@visactor/vrender-core", - "version": "0.21.0", + "version": "0.21.1", "description": "", "sideEffects": [ "./src/modules.ts", diff --git a/packages/vrender-kits/CHANGELOG.json b/packages/vrender-kits/CHANGELOG.json index 7d076d264..3b4cd3ee4 100644 --- a/packages/vrender-kits/CHANGELOG.json +++ b/packages/vrender-kits/CHANGELOG.json @@ -1,6 +1,12 @@ { "name": "@visactor/vrender-kits", "entries": [ + { + "version": "0.21.1", + "tag": "@visactor/vrender-kits_v0.21.1", + "date": "Thu, 05 Dec 2024 07:50:47 GMT", + "comments": {} + }, { "version": "0.21.0", "tag": "@visactor/vrender-kits_v0.21.0", diff --git a/packages/vrender-kits/CHANGELOG.md b/packages/vrender-kits/CHANGELOG.md index 8ff8464a7..73c95f45a 100644 --- a/packages/vrender-kits/CHANGELOG.md +++ b/packages/vrender-kits/CHANGELOG.md @@ -1,6 +1,11 @@ # Change Log - @visactor/vrender-kits -This log was last generated on Thu, 28 Nov 2024 03:30:36 GMT and should not be manually modified. +This log was last generated on Thu, 05 Dec 2024 07:50:47 GMT and should not be manually modified. + +## 0.21.1 +Thu, 05 Dec 2024 07:50:47 GMT + +_Version update only_ ## 0.21.0 Thu, 28 Nov 2024 03:30:36 GMT diff --git a/packages/vrender-kits/package.json b/packages/vrender-kits/package.json index c0e81fcf2..49c44900e 100644 --- a/packages/vrender-kits/package.json +++ b/packages/vrender-kits/package.json @@ -1,6 +1,6 @@ { "name": "@visactor/vrender-kits", - "version": "0.21.0", + "version": "0.21.1", "description": "", "sideEffects": false, "main": "cjs/index.js", @@ -21,7 +21,7 @@ }, "dependencies": { "@visactor/vutils": "~0.19.2", - "@visactor/vrender-core": "workspace:0.21.0", + "@visactor/vrender-core": "workspace:0.21.1", "@resvg/resvg-js": "2.4.1", "roughjs": "4.5.2" }, diff --git a/packages/vrender/CHANGELOG.json b/packages/vrender/CHANGELOG.json index 608a30e5d..eb005aec2 100644 --- a/packages/vrender/CHANGELOG.json +++ b/packages/vrender/CHANGELOG.json @@ -1,6 +1,12 @@ { "name": "@visactor/vrender", "entries": [ + { + "version": "0.21.1", + "tag": "@visactor/vrender_v0.21.1", + "date": "Thu, 05 Dec 2024 07:50:47 GMT", + "comments": {} + }, { "version": "0.21.0", "tag": "@visactor/vrender_v0.21.0", diff --git a/packages/vrender/CHANGELOG.md b/packages/vrender/CHANGELOG.md index a619351e6..d76fe89d3 100644 --- a/packages/vrender/CHANGELOG.md +++ b/packages/vrender/CHANGELOG.md @@ -1,6 +1,11 @@ # Change Log - @visactor/vrender -This log was last generated on Thu, 28 Nov 2024 03:30:36 GMT and should not be manually modified. +This log was last generated on Thu, 05 Dec 2024 07:50:47 GMT and should not be manually modified. + +## 0.21.1 +Thu, 05 Dec 2024 07:50:47 GMT + +_Version update only_ ## 0.21.0 Thu, 28 Nov 2024 03:30:36 GMT diff --git a/packages/vrender/package.json b/packages/vrender/package.json index 4319277ee..a8c4167a1 100644 --- a/packages/vrender/package.json +++ b/packages/vrender/package.json @@ -1,6 +1,6 @@ { "name": "@visactor/vrender", - "version": "0.21.0", + "version": "0.21.1", "description": "", "sideEffects": true, "main": "cjs/index.js", @@ -24,8 +24,8 @@ "test-watch": "cross-env DEBUG_MODE=1 jest --watch" }, "dependencies": { - "@visactor/vrender-core": "workspace:0.21.0", - "@visactor/vrender-kits": "workspace:0.21.0" + "@visactor/vrender-core": "workspace:0.21.1", + "@visactor/vrender-kits": "workspace:0.21.1" }, "devDependencies": { "@internal/bundler": "workspace:*", diff --git a/tools/bugserver-trigger/package.json b/tools/bugserver-trigger/package.json index e88960bf0..69ccb1f00 100644 --- a/tools/bugserver-trigger/package.json +++ b/tools/bugserver-trigger/package.json @@ -8,10 +8,10 @@ "ci": "ts-node --transpileOnly --skipProject ./scripts/trigger-test.ts" }, "dependencies": { - "@visactor/vrender": "workspace:0.21.0", - "@visactor/vrender-core": "workspace:0.21.0", - "@visactor/vrender-kits": "workspace:0.21.0", - "@visactor/vrender-components": "workspace:0.21.0" + "@visactor/vrender": "workspace:0.21.1", + "@visactor/vrender-core": "workspace:0.21.1", + "@visactor/vrender-kits": "workspace:0.21.1", + "@visactor/vrender-components": "workspace:0.21.1" }, "devDependencies": { "@rushstack/eslint-patch": "~1.1.4", From f6439faec27624c3fb1e31c77f1f80d34c5a1c35 Mon Sep 17 00:00:00 2001 From: neuqzxy Date: Thu, 5 Dec 2024 08:08:18 +0000 Subject: [PATCH 20/21] docs: generate changelog of release v0.21.0 --- docs/assets/changelog/en/changelog.md | 20 ++++++++++++++++++++ docs/assets/changelog/zh/changelog.md | 20 ++++++++++++++++++++ 2 files changed, 40 insertions(+) diff --git a/docs/assets/changelog/en/changelog.md b/docs/assets/changelog/en/changelog.md index d355ff861..5ccdc4645 100644 --- a/docs/assets/changelog/en/changelog.md +++ b/docs/assets/changelog/en/changelog.md @@ -1,3 +1,23 @@ +# v0.21.0 + +2024-12-05 + + +**🆕 New feature** + +- **@visactor/vrender-components**: support label overlap for inside arc labels +- **@visactor/vrender-core**: use ascend and decent to make measure more accurate +- **@visactor/vrender-core**: sync animated attribute while call render func, closed [#1416](https://github.com/VisActor/VRender/issues/1416) + +**🐛 Bug fix** + +- **@visactor/vrender-core**: smooth out stuttering effects when multiple TagPointsUpdate instances execute concurrently +- **@visactor/vrender-core**: fix issue with dirtyBounds incorrectly while set visible + + + +[more detail about v0.21.0](https://github.com/VisActor/VRender/releases/tag/v0.21.0) + # v0.20.16 2024-11-25 diff --git a/docs/assets/changelog/zh/changelog.md b/docs/assets/changelog/zh/changelog.md index 57bcac4ba..9a9a6f7d9 100644 --- a/docs/assets/changelog/zh/changelog.md +++ b/docs/assets/changelog/zh/changelog.md @@ -1,3 +1,23 @@ +# v0.21.0 + +2024-12-05 + + +**🆕 新增功能** + +- **@visactor/vrender-components**: support label overlap for inside arc labels +- **@visactor/vrender-core**: use ascend and decent to make measure more accurate +- **@visactor/vrender-core**: sync animated attribute while call render func, closed [#1416](https://github.com/VisActor/VRender/issues/1416) + +**🐛 功能修复** + +- **@visactor/vrender-core**: smooth out stuttering effects when multiple TagPointsUpdate instances execute concurrently +- **@visactor/vrender-core**: fix issue with dirtyBounds incorrectly while set visible + + + +[更多详情请查看 v0.21.0](https://github.com/VisActor/VRender/releases/tag/v0.21.0) + # v0.20.16 2024-11-25 From 2e597499bae3e50d8464ed17b6553f4c3c6a0c9a Mon Sep 17 00:00:00 2001 From: neuqzxy Date: Thu, 5 Dec 2024 08:16:48 +0000 Subject: [PATCH 21/21] docs: generate changelog of release v0.21.1 --- docs/assets/changelog/en/changelog.md | 23 +++++++++++++++++++++++ docs/assets/changelog/zh/changelog.md | 23 +++++++++++++++++++++++ 2 files changed, 46 insertions(+) diff --git a/docs/assets/changelog/en/changelog.md b/docs/assets/changelog/en/changelog.md index 5ccdc4645..55ccf1058 100644 --- a/docs/assets/changelog/en/changelog.md +++ b/docs/assets/changelog/en/changelog.md @@ -1,3 +1,26 @@ +# v0.21.1 + +2024-12-05 + + +**🆕 New feature** + +- **@visactor/vrender-components**: support `restorePosition` in position/bound label overlap strategy +- **@visactor/vrender-components**: support vertex point of marker area label. close @VisActor/VChart[#3442](https://github.com/VisActor/VRender/issues/3442) + +**🐛 Bug fix** + +- **@visactor/vrender-components**: end symbol angle when arc line in markpoint. fix @VisActor/VChart[#3427](https://github.com/VisActor/VRender/issues/3427) +- **@visactor/vrender-components**: fix issue with scroll-plugin +- **@visactor/vrender-core**: fix issue with insertAfter and insertBefore +- **@visactor/vrender-core**: fix the issue when line is configured to connect, closed [#3238](https://github.com/VisActor/VRender/issues/3238) +- **@visactor/vrender-core**: fix issue with richtext setAttribute, closed [#1578](https://github.com/VisActor/VRender/issues/1578) +- **@visactor/vrender-core**: fix issue with richtext default font + + + +[more detail about v0.21.1](https://github.com/VisActor/VRender/releases/tag/v0.21.1) + # v0.21.0 2024-12-05 diff --git a/docs/assets/changelog/zh/changelog.md b/docs/assets/changelog/zh/changelog.md index 9a9a6f7d9..0c0d11392 100644 --- a/docs/assets/changelog/zh/changelog.md +++ b/docs/assets/changelog/zh/changelog.md @@ -1,3 +1,26 @@ +# v0.21.1 + +2024-12-05 + + +**🆕 新增功能** + +- **@visactor/vrender-components**: support `restorePosition` in position/bound label overlap strategy +- **@visactor/vrender-components**: support vertex point of marker area label. close @VisActor/VChart[#3442](https://github.com/VisActor/VRender/issues/3442) + +**🐛 功能修复** + +- **@visactor/vrender-components**: end symbol angle when arc line in markpoint. fix @VisActor/VChart[#3427](https://github.com/VisActor/VRender/issues/3427) +- **@visactor/vrender-components**: fix issue with scroll-plugin +- **@visactor/vrender-core**: fix issue with insertAfter and insertBefore +- **@visactor/vrender-core**: fix the issue when line is configured to connect, closed [#3238](https://github.com/VisActor/VRender/issues/3238) +- **@visactor/vrender-core**: fix issue with richtext setAttribute, closed [#1578](https://github.com/VisActor/VRender/issues/1578) +- **@visactor/vrender-core**: fix issue with richtext default font + + + +[更多详情请查看 v0.21.1](https://github.com/VisActor/VRender/releases/tag/v0.21.1) + # v0.21.0 2024-12-05