Codex/lynx guide 4674

docs/assets/guide/en/tutorial_docs/Cross-terminal_and_Developer_Ecology/lynx.md

@@ -1,6 +1,6 @@
 # Lynx
 
-**[Note] The open-source version of Lynx currently does not provide canvas functionality, so VChart rendering is not supported at this time. Future versions will support this feature. Stay tuned, [see the Lynx official website for more features](https://lynxjs.org/)**
+**[Scope] This guide retains integration instructions for ByteDance's internal Lynx environment. Based on public information reviewed on September 14, 2026, open-source native Lynx does not yet publicly provide the Canvas integration required here. Installing VChart does not add this capability to the host. For updates, see the [official Lynx documentation](https://lynxjs.org/) and the [charting discussion](https://github.com/lynx-family/lynx/issues/6230#issuecomment-4729040590).**
 
 Lynx is a high-performance cross-platform framework open-sourced by ByteDance, enabling the rapid construction of Native views based on the Web technology stack. Lynx was officially open-sourced on March 5, 2025. VChart provides chart rendering capabilities for this framework based on the internal version of Lynx at ByteDance.
 
@@ -12,9 +12,9 @@ You can install the vchart dependency package directly in the lynx project: `@vi
 
 ### Manually import script
 
-You can also manually reference VChart's umd packaged product, which you can obtain through the following channels:
+You can also obtain the VChart UMD bundle and load it using a method supported by the internal host. The HTML tags below show browser usage and cannot be copied directly into a native Lynx project:
 
-1. Obtain [packages/block-vchart/block/vchart/index.js](https://github.com/VisActor/VChart/blob/main/packages/block-vchart/block/vchart/index.js), we will update it every time we send a package
+1. Obtain [build/index.min.js](https://unpkg.com/@visactor/vchart/build/index.min.js) from the `@visactor/vchart` package
 2. Get it from the following free CDN
 
 ```html
@@ -25,9 +25,11 @@ You can also manually reference VChart's umd packaged product, which you can obt
 <script src="https://cdn.jsdelivr.net/npm/@visactor/vchart/build/index.min.js"></script>
 ```
 
-## how to use
+## How to Use
 
-Below we will introduce how to use VChart on Feishu widgets from three parts: `js`, `ttml`, and `ttss`.
+The following historical `ttml` and `js` examples are retained for internal Lynx hosts. `Card(...)`, `SystemInfo`, and the Canvas bridge depend on the specific internal host; they are not general-purpose APIs for open-source ReactLynx.
+
+These examples have not been verified with the current VChart version and a specific host version. Check the versions and host APIs before using them. The `domref`, `canvasIdLists`, and `freeCanvasIdx` parameters belong to the older integration and should not be treated as the integration contract for newer versions.
 
 ### index.ttml
 
@@ -68,7 +70,7 @@ Three canvases need to be declared, and pay attention to the order of declaratio
 
 ### index.js
 
-Create a VChart instance in this file. Because VChart is internally compatible with the lynx environment, its use is basically the same as on the PC. You only need to pay attention to two points:
+This historical example creates a VChart instance in this file and illustrates two parts of the integration: environment parameters and events.
 
 1. Necessary environment parameters need to be declared in the constructor of VChart
 
@@ -102,7 +104,7 @@ bindChartEvent(event) {
 },
 ```
 
-The following is the completed code related to index.js:
+The following is the index.js example:
 
 ```ts
 import barSpec from './data/bar';
@@ -120,7 +122,7 @@ Card({
     ]
   },
   onLoad: function () {
-    // 如果需要使用地图，需要先注册地图
+    // Register the map before using a map chart
     VChart.registerMap('china', mapJson, {
       type: 'geojson'
     });
@@ -136,24 +138,24 @@ Card({
           method: 'boundingClientRect',
           success: domRef => {
             if (!domRef) {
-              console.error(`未找到 #${item.id} 画布`);
+              console.error(`Canvas #${item.id} was not found`);
               return;
             }
             domRef.id = item.id;
             const pixelRatio = SystemInfo.pixelRatio;
 
             const chartInstance = new VChart(item.spec, {
-              mode: 'lynx', //  Tip: 跨端环境需要手动传入 mode
-              // 跨端参数
+              mode: 'lynx', // Tip: Pass mode explicitly in cross-platform environments
+              // Cross-platform parameters
               modeParams: {
-                domref: domRef, // 图表绘制的 canvas 节点
-                force: true, // 是否强制使用 canvas 绘制
-                canvasIdLists: [`${item.id}_draw_canvas`, `${item.id}_tooltip_canvas`, `${item.id}_hidden_canvas`], // canvasId 列表
+                domref: domRef, // Canvas node used to draw the chart
+                force: true, // Whether to force Canvas rendering
+                canvasIdLists: [`${item.id}_draw_canvas`, `${item.id}_tooltip_canvas`, `${item.id}_hidden_canvas`], // Canvas ID list
                 tooltipCanvasId: `${item.id}_tooltip_canvas`, // tooltip canvasId
-                freeCanvasIdx: 1 // 自由 canvas 索引
+                freeCanvasIdx: 1 // Index of the first canvas available for internal use
               },
-              dpr: pixelRatio, // Tip: 跨端环境需要手动传入 dpr
-              renderCanvas: `${item.id}_draw_canvas` // 声明用于绘制的 canvasId
+              dpr: pixelRatio, // Tip: Pass dpr explicitly in cross-platform environments
+              renderCanvas: `${item.id}_draw_canvas` // Canvas ID used for drawing
             });
             item.chart = chartInstance;
 
@@ -177,7 +179,7 @@ Card({
     const targetChart = this.data.chartList.find(x => x.id === id);
     const chartInstance = targetChart?.chart;
     if (chartInstance) {
-      event.target = chartInstance.getCanvas(); // Tip: 必须设置
+      event.target = chartInstance.getCanvas(); // Tip: Must be set
       chartInstance.getStage().window.dispatchEvent(event);
     }
   }
@@ -186,15 +188,15 @@ Card({
 
 ## On-Demand Loading
 
-Lynx-VChart inherently supports on-demand loading. There are two ways to achieve on-demand loading with VChart:
+The `<VChartSimple />` and semantic tags below belong to the internal `@dp/lynx-vchart` component wrapper and require the corresponding internal ReactLynx host. See the [ReactLynx guide](/vchart/guide/tutorial_docs/Cross-terminal_and_Developer_Ecology/react-lynx) for usage. The historical loading methods and registration lists are retained below; check them against the wrapper version you use.
 
 - Use the `<VChartSimple />` tag to implement custom on-demand loading.
 
-The `<VChartSimple />` component and the `<VChart />` component are almost identical in usage. The only difference is that users need to import the `VChart` constructor class from `@viasctor/vchart/esm/core`, register the required charts and components as described in this document, and pass them to `<VChartSimple />`.
+The `<VChartSimple />` component and the `<VChart />` component are almost identical in usage. The only difference is that users need to import the `VChart` constructor class from `@visactor/vchart/esm/core`, register the required charts and components as described in this document, and pass them to `<VChartSimple />`.
 
 - Use semantic tags, all of which support on-demand loading by default. The default registered components for each type of semantic tag are as follows:
 
-> Supported from version **0.0.12**
+> Historical record: supported by the component wrapper from **0.0.12**. This version does not refer to VChart or the Lynx engine.
 
 | Chart                      | Category         | Additional Registered Components      |
 | -------------------------- | ---------------- | ------------------------------------- |
@@ -257,7 +259,7 @@ For Polar charts, the default registered components are as follows:
 - `registerPolarBandAxis`
 - `registerPolarCrossHair`
 - `registerBrush`
-- `registerContinuous Legend`
+- `registerContinuousLegend`
 - `registerDataZoom`
 - `registerDiscreteLegend`
 - `registerCustomMark`
@@ -279,6 +281,6 @@ For General charts, the default registered components are as follows:
 
 When using semantic tags, if you need components that are not loaded by default, you only need to register the missing components.
 
-[Note]: If there is an error similar to "No matching export in..." when using Lynx, please upgrade the version of Lynx or configure resolve.enable INodeCache to false
+[Historical troubleshooting note]: Earlier internal integration documentation suggested upgrading Lynx or setting `resolve.enableINodeCache` to `false` for "No matching export in ..." errors. The build tool and applicable versions for this advice have not been verified. Check the documentation for your toolchain before applying it; this is not a general configuration option for open-source Lynx.
 
 For reference on on-demand loading of VChart, see [related documentation](/vchart/guide/tutorial_docs/Load_on_Demand).

docs/assets/guide/en/tutorial_docs/Cross-terminal_and_Developer_Ecology/react-lynx.md

@@ -1,6 +1,6 @@
 # ReactLynx
 
-**[Note] The open-source version of Lynx currently does not provide canvas functionality, so vchart rendering is not supported at the moment. It will be supported in future versions, so stay tuned. [For more features, please visit the Lynx official website](https://lynxjs.org/)**
+**[Scope] This guide covers the internal `@dp/lynx-vchart` package and its corresponding internal ReactLynx host at ByteDance. Based on public information reviewed on September 14, 2026, open-source native Lynx does not yet publicly provide the Canvas integration required here. Installing a chart package does not add this capability to the host. For updates, see the [official Lynx documentation](https://lynxjs.org/) and the [charting discussion](https://github.com/lynx-family/lynx/issues/6230#issuecomment-4729040590).**
 
 Lynx is ByteDance's open-source high-performance cross-platform framework, which quickly builds native views based on the web technology stack. Lynx was officially open-sourced on March 5, 2025. ReactLynx is the React syntax version of Lynx. VChart, based on ByteDance's internal version ReactLynx3.0, provides chart rendering capabilities.
 

docs/assets/guide/zh/tutorial_docs/Cross-terminal_and_Developer_Ecology/lynx.md

@@ -1,6 +1,6 @@
 # Lynx
 
-**【注意】Lynx 开源版本暂时不提供 canvas 画布功能，所以暂时不支持 vchart 的渲染，后续版本将会支持，敬请期待，[更多功能请查看 lynx 官网](https://lynxjs.org/)**
+**【适用范围】本文保留的是字节内部 Lynx 环境的接入说明。根据截至 2026-09-14 的公开资料核查，开源原生 Lynx 尚未公开提供本文所需的 Canvas 接入能力；安装 VChart 不会为宿主补充该能力。开源进展请参考 [Lynx 官方文档](https://lynxjs.org/)及[图表需求讨论](https://github.com/lynx-family/lynx/issues/6230#issuecomment-4729040590)。**
 
 Lynx 是字节开源的高性能跨端框架，基于 Web 技术栈快速构建 Native 视图，Lynx 于 2025-03-05 正式开源；VChart 基于 Lynx 字节内部版本提供了该框架的图表渲染能力支持。
 
@@ -12,9 +12,9 @@ Lynx 是字节开源的高性能跨端框架，基于 Web 技术栈快速构建
 
 ### 手动引入脚本
 
-也可以手动引用 VChart 的 umd 打包产物，你可以通过如下渠道获取：
+也可以获取 VChart 的 UMD 打包产物，并按内部宿主支持的方式加载。下面的 HTML 标签展示浏览器中的引用方式，原生 Lynx 项目不能直接照搬：
 
-1. 直接仓库中获取 [packages/block-vchart/block/vchart/index.js](https://github.com/VisActor/VChart/blob/main/packages/block-vchart/block/vchart/index.js) ，每次发包我们都会进行更新
+1. 获取 `@visactor/vchart` 包中的 [build/index.min.js](https://unpkg.com/@visactor/vchart/build/index.min.js) 构建产物
 2. 从如下免费的 CDN 中获取
 
 ```html
@@ -27,7 +27,9 @@ Lynx 是字节开源的高性能跨端框架，基于 Web 技术栈快速构建
 
 ## 如何使用
 
-下面我们从 `js`、`ttml`、`ttss` 三部分介绍下如何在飞书小组件上使用 VChart。
+以下保留内部 Lynx 宿主的历史 `ttml` 和 `js` 接入示例。`Card(...)`、`SystemInfo` 及画布桥接依赖对应内部宿主，不是开源 ReactLynx 的通用 API。
+
+这些示例尚未针对当前 VChart 与具体宿主版本完成运行验证，使用前需核对版本及宿主 API。示例中的 `domref`、`canvasIdLists` 和 `freeCanvasIdx` 是旧接入参数，不应直接作为新版本接入契约。
 
 ### index.ttml
 
@@ -68,7 +70,7 @@ Lynx 是字节开源的高性能跨端框架，基于 Web 技术栈快速构建
 
 ### index.js
 
-在该文件中创建 VChart 实例，因为 VChart 内部对 lynx 环境进行了兼容，所以在使用上，基本于 PC 端无异，只需要注意两点：
+此历史示例在该文件中创建 VChart 实例，展示环境参数和事件接入两个部分：
 
 1. 需要在 VChart 的构造函数中声明必要的环境参数
 
@@ -88,7 +90,7 @@ const chartInstance = new VChart(spec, {
 });
 ```
 
-2. 在事件上，需要用户自己在 canvas（用于绘制的 canvas） 元素上绑定事件，然后在事件监听函数中手动得分发事件来触发 VChart 内部的事件。
+2. 在事件上，需要用户自己在 canvas（用于绘制的 canvas） 元素上绑定事件，然后在事件监听函数中手动分发事件来触发 VChart 内部的事件。
 
 ```ts
 bindChartEvent(event) {
@@ -102,7 +104,7 @@ bindChartEvent(event) {
 },
 ```
 
-下面是 index.js 相关的完成代码：
+下面是 index.js 示例代码：
 
 ```ts
 import barSpec from './data/bar';
@@ -186,15 +188,15 @@ Card({
 
 ## 按需加载
 
-lynx-vchart 本身代码都支持按需加载，当需要 VChart 按需加载的时候，有两种办法：
+以下 `<VChartSimple />` 和语义化标签属于内部包 `@dp/lynx-vchart` 的组件封装，使用前需具备对应内部 ReactLynx 宿主；完整用法参考 [ReactLynx 文档](/vchart/guide/tutorial_docs/Cross-terminal_and_Developer_Ecology/react-lynx)。下面保留该封装的历史按需加载方式及注册清单，需与实际使用的封装版本核对：
 
 - 使用 `<VChartSimple />` 标签，实现自定义的按需加载
 
-`<VChartSimple />`组件和`<VChart />`组件使用方法基本完全相同，唯一差异点为，需要用户从 `@viasctor/vchart/esm/core` 引用 `VChart` 构造类，根据本文描述，注册需要的图表和组件，并传入给 `<VChartSimple />`;
+`<VChartSimple />`组件和`<VChart />`组件使用方法基本完全相同，唯一差异点为，需要用户从 `@visactor/vchart/esm/core` 引用 `VChart` 构造类，根据本文描述，注册需要的图表和组件，并传入给 `<VChartSimple />`;
 
 - 使用语义化标签，所有的语义化标签默认支持按需加载，其中各种语义化标签默认注册的内容如下：
 
-> 自**0.0.12**版本开始支持
+> 历史记录：该组件封装自 **0.0.12** 版本开始支持；此版本号不指 VChart 或 Lynx 引擎。
 
 | 图表                       | 分类           | 额外注册的组件                        |
 | -------------------------- | -------------- | ------------------------------------- |
@@ -279,6 +281,6 @@ lynx-vchart 本身代码都支持按需加载，当需要 VChart 按需加载的
 
 使用语义化标签的时候，如果用到其他没有默认加载的组件，只需要注册未加载的组件即可；
 
-【注意】：如果使用 lynx 出现报错类似“No matching export in ...”，请升级 lynx 的版本，或者配置 resolve.enableINodeCache 为 false
+【历史排错记录】：旧版内部接入文档曾建议在“No matching export in ...”报错时升级 Lynx，或将 `resolve.enableINodeCache` 设为 `false`。该建议所属的构建工具及适用版本尚未核实，使用前需核对对应工具链文档，不能将其作为开源 Lynx 的通用配置。
 
 VChart 按需引用参考[相关文档](/vchart/guide/tutorial_docs/Load_on_Demand)

docs/assets/guide/zh/tutorial_docs/Cross-terminal_and_Developer_Ecology/react-lynx.md

@@ -1,6 +1,6 @@
 # ReactLynx
 
-**【注意】Lynx 开源版本暂时不提供 canvas 画布功能，所以暂时不支持 vchart 的渲染，后续版本将会支持，敬请期待，[更多功能请查看 lynx 官网](https://lynxjs.org/)**
+**【适用范围】本文介绍的是内部包 `@dp/lynx-vchart` 及其对应的字节内部 ReactLynx 宿主。根据截至 2026-09-14 的公开资料核查，开源原生 Lynx 尚未公开提供本文所需的 Canvas 接入能力；安装图表包不会为宿主补充该能力。开源进展请参考 [Lynx 官方文档](https://lynxjs.org/)及[图表需求讨论](https://github.com/lynx-family/lynx/issues/6230#issuecomment-4729040590)。**
 
 Lynx 是字节开源的高性能跨端框架，基于 Web 技术栈快速构建 Native 视图，Lynx 于 2025-03-05 正式开源，ReactLynx 是 Lynx 的 React 语法版本 ；VChart 基于字节内部版本 ReactLynx3.0 ，提供了图表渲染能力支持。
 

packages/vchart/__tests__/unit/component/crosshair/crosshair-util.test.ts

@@ -19,7 +19,7 @@ describe('crosshair utils', () => {
       const axis = {
         getScale: () => ({ type: 'linear', scale }),
         getLayoutStartPoint: () => ({ x: 0, y: 0 }),
-        getVRenderComponents: () => [],
+        getVRenderComponents: (): [] => [],
         getSpec: () => ({}),
         getOrient: () => orient,
         getRegions: () => [