@363045841yyt/klinechart-core 0.7.3 → 0.7.5-alpha.2

package/README.zh-CN.md

@@ -1,201 +1,201 @@
-# @363045841yyt/klinechart-core
-
-无头、响应式 K 线（蜡烛图）图表引擎，零框架依赖�?
-
-## 概览
-
-`@363045841yyt/klinechart-core` �?`@363045841yyt/klinechart` 生态的底层图表引擎。它处理数据管理、渲染协调、视口计算和插件编排 —�?完全不依赖任�?UI 框架�?
-
-## 安装
-
-```bash
-npm install @363045841yyt/klinechart-core
-# �?
-pnpm add @363045841yyt/klinechart-core
-# �?
-yarn add @363045841yyt/klinechart-core
-```
-
-## 快速开�?
-
-```typescript
-import { createChartController } from '@363045841yyt/klinechart-core/controllers'
-import type { KLineData } from '@363045841yyt/klinechart-core'
-
-const controller = createChartController({
-  container: document.getElementById('chart'),
-  data: [],
-  initialZoomLevel: 3,
-  theme: 'light'
-})
-
-// 加载数据
-const data: KLineData[] = [
-  { timestamp: 1704067200000, open: 100, high: 105, low: 98, close: 103, volume: 10000 },
-  // ...
-]
-controller.setData(data)
-
-// 清理
-controller.dispose()
-```
-
-## 导出�?
-
-### 控制�?
-- `createChartController` �?图表实例工厂
-- `ChartController` �?主控制器接口
-
-### 响应�?
-- `Signal<T>` �?响应式状态原�?
-- `effect`, `peek` �?响应式工�?
-
-### 引擎
-- `Chart` �?底层图表实例（通过 `@363045841yyt/klinechart-core/engine/chart`�?
-- `ChartStore` �?数据管理
-- 渲染器（通过子路径导入）
-
-### 插件系统
-- `PluginHost` �?插件注册和生命周�?
-- `EventBus` �?跨组件通信
-- `StateStore` �?全局状态管�?
-
-### 类型
-- `KLineData` �?K 线数据点
-- `ChartViewport` �?视口状�?
-- `InteractionSnapshot` �?交互状�?
-
-### 子路径导�?
-
-本包支持细粒度的子路径导入，便于 tree-shaking�?
-
-```typescript
-// 核心引擎
-import { Chart } from '@363045841yyt/klinechart-core/engine/chart'
-import { ChartStore } from '@363045841yyt/klinechart-core/engine/chart-store'
-
-// 工具
-import { zoom } from '@363045841yyt/klinechart-core/engine/utils/zoom'
-
-// 配置
-import { DEFAULT_SETTINGS } from '@363045841yyt/klinechart-core/config'
-
-// 插件
-import { EventBus } from '@363045841yyt/klinechart-core/plugin'
-
-// 版本
-import { VERSION } from '@363045841yyt/klinechart-core/version'
-```
-
-## 架构
-
-```
-┌─────────────────────────────────────�?
-�?          控制器层                   �? �?高级 API
-├─────────────────────────────────────�?
-�?         插件系统�?                 �? �?EventBus, StateStore
-├─────────────────────────────────────�?
-�?          引擎�?                    �? �?Chart, ChartStore
-├─────────────────────────────────────�?
-�?         渲染器层                    �? �?Canvas/WebGL 渲染�?
-├─────────────────────────────────────�?
-�?         响应式层                    �? �?Signal 状态管�?
-└─────────────────────────────────────�?
-```
-
-## ChartController API
-
-### 创建控制�?
-
-```typescript
-import { createChartController } from '@363045841yyt/klinechart-core/controllers'
-
-const controller = createChartController({
-  container: HTMLElement,
-  data: KLineData[],
-  initialZoomLevel?: number,
-  zoomLevels?: number,
-  theme?: 'light' | 'dark',
-  yPaddingPx?: number,
-  minKWidth?: number,
-  maxKWidth?: number
-})
-```
-
-### 方法
-
-- `setData(data: KLineData[]): void` �?更新图表数据
-- `setTheme(theme: 'light' | 'dark'): void` �?切换主题
-- `zoomToLevel(level: number, anchorX?: number): void` �?缩放到指定级�?
-- `zoomIn(anchorX?: number): void` �?放大
-- `zoomOut(anchorX?: number): void` �?缩小
-- `addIndicator(definitionId: string, role: 'main' | 'sub', params?): string` �?添加指标
-- `removeIndicator(instanceId: string): boolean` �?移除指标
-- `dispose(): void` �?清理销�?
-
-### 响应式状�?
-
-通过 Signal 访问响应式状态：
-
-```typescript
-// 当前视口
-controller.viewport.subscribe((vp) => {
-  console.log('缩放级别:', vp.zoomLevel)
-})
-
-// 活跃指标
-controller.indicators.subscribe((inds) => {
-  console.log('活跃指标:', inds)
-})
-
-// 交互状�?
-controller.interactionState.subscribe((state) => {
-  console.log('悬停:', state.hover)
-})
-```
-
-## 语义化配�?
-
-对于 AI/LLM 驱动的图表配置，使用语义控制器：
-
-```typescript
-import { SemanticChartController } from '@363045841yyt/klinechart-core/semantic'
-
-const semantic = new SemanticChartController(chartInstance)
-
-// 应用自然语言配置
-semantic.applyConfig({
-  "stockSymbol": "AAPL",
-  "dateRange": { "start": "2024-01-01", "end": "2024-06-01" },
-  "indicators": ["MA20", "MACD", "RSI"],
-  "chart": {
-    "chartType": "candlestick",
-    "theme": "dark",
-    "gridLines": { "horizontal": true, "vertical": false }
-  },
-  "display": {
-    "paneRatios": { "main": 0.6, "sub1": 0.4 }
-  }
-})
-```
-
-## 浏览器支�?
-
-- Chrome/Edge 90+
-- Firefox 88+
-- Safari 14+
-
-需要支持：
-- ResizeObserver
-- Canvas 2D Context
-- ES2022（或转译�?
-
-## 许可�?
-
-MIT © 363045841
-
-## 相关�?
-
-- `@363045841yyt/klinechart` �?Vue 3 绑定
-- `@363045841yyt/klinechart-react` �?React 绑定（即将推出）
-- `@363045841yyt/klinechart-angular` �?Angular 绑定（即将推出）
+# @363045841yyt/klinechart-core
+
+无头、响应式 K 线（蜡烛图）图表引擎，零框架依赖。
+
+## 概述
+
+`@363045841yyt/klinechart-core` 是为 `@363045841yyt/klinechart` monorepo 提供驱动力的基础图表引擎。它负责数据管理、渲染协调、视口计算和插件编排——完全不依赖任何 UI 框架。
+
+## 安装
+
+```bash
+npm install @363045841yyt/klinechart-core
+# 或
+pnpm add @363045841yyt/klinechart-core
+# 或
+yarn add @363045841yyt/klinechart-core
+```
+
+## 快速开始
+
+```typescript
+import { createChartController } from '@363045841yyt/klinechart-core/controllers'
+import type { KLineData } from '@363045841yyt/klinechart-core'
+
+const controller = createChartController({
+  container: document.getElementById('chart'),
+  data: [],
+  initialZoomLevel: 3,
+  theme: 'light'
+})
+
+// 加载数据
+const data: KLineData[] = [
+  { timestamp: 1704067200000, open: 100, high: 105, low: 98, close: 103, volume: 10000 },
+  // ...
+]
+controller.setData(data)
+
+// 使用完毕后清理
+controller.dispose()
+```
+
+## 导出内容
+
+### 控制器
+- `createChartController` —— 创建图表实例的工厂函数
+- `ChartController` —— 主控制器接口
+
+### 响应式系统
+- `Signal<T>` —— 用于状态管理的响应式原语
+- `effect`、`peek` —— 响应式工具函数
+
+### 引擎
+- `Chart` —— 底层图表实例（通过 `@363045841yyt/klinechart-core/engine/chart` 导入）
+- `ChartStore` —— 数据管理
+- 渲染器（通过子路径导入）
+
+### 插件系统
+- `PluginHost` —— 插件注册与生命周期管理
+- `EventBus` —— 跨组件通信
+- `StateStore` —— 全局状态管理
+
+### 类型
+- `KLineData` —— K 线数据点
+- `ChartViewport` —— 视口状态
+- `InteractionSnapshot` —— 交互状态
+
+### 子路径导出
+
+该包提供细粒度的子路径导入，支持 Tree-shaking：
+
+```typescript
+// 核心引擎
+import { Chart } from '@363045841yyt/klinechart-core/engine/chart'
+import { ChartStore } from '@363045841yyt/klinechart-core/engine/chart-store'
+
+// 工具函数
+import { zoom } from '@363045841yyt/klinechart-core/engine/utils/zoom'
+
+// 配置
+import { DEFAULT_SETTINGS } from '@363045841yyt/klinechart-core/config'
+
+// 插件
+import { EventBus } from '@363045841yyt/klinechart-core/plugin'
+
+// 版本
+import { VERSION } from '@363045841yyt/klinechart-core/version'
+```
+
+## 架构
+
+```
+┌─────────────────────────────────────┐
+│          控制器 (Controllers)        │  ← 高层 API
+├─────────────────────────────────────┤
+│         插件系统 (Plugin System)     │  ← EventBus、StateStore
+├─────────────────────────────────────┤
+│           引擎 (Engine)             │  ← Chart、ChartStore
+├─────────────────────────────────────┤
+│         渲染器 (Renderers)           │  ← Canvas/WebGL 渲染器
+├─────────────────────────────────────┤
+│       响应式系统 (Reactivity)        │  ← 基于 Signal 的状态管理
+└─────────────────────────────────────┘
+```
+
+## ChartController API
+
+### 创建控制器
+
+```typescript
+import { createChartController } from '@363045841yyt/klinechart-core/controllers'
+
+const controller = createChartController({
+  container: HTMLElement,
+  data: KLineData[],
+  initialZoomLevel?: number,
+  zoomLevels?: number,
+  theme?: 'light' | 'dark',
+  yPaddingPx?: number,
+  minKWidth?: number,
+  maxKWidth?: number
+})
+```
+
+### 方法
+
+- `setData(data: KLineData[]): void` —— 更新图表数据
+- `setTheme(theme: 'light' | 'dark'): void` —— 切换主题
+- `zoomToLevel(level: number, anchorX?: number): void` —— 缩放到指定级别
+- `zoomIn(anchorX?: number): void` —— 放大
+- `zoomOut(anchorX?: number): void` —— 缩小
+- `addIndicator(definitionId: string, role: 'main' | 'sub', params?): string` —— 添加指标
+- `removeIndicator(instanceId: string): boolean` —— 移除指标
+- `dispose(): void` —— 清理并销毁
+
+### 响应式状态
+
+通过 Signal 访问响应式状态：
+
+```typescript
+// 当前视口
+controller.viewport.subscribe((vp) => {
+  console.log('缩放级别:', vp.zoomLevel)
+})
+
+// 活跃指标
+controller.indicators.subscribe((inds) => {
+  console.log('活跃指标:', inds)
+})
+
+// 交互状态
+controller.interactionState.subscribe((state) => {
+  console.log('悬停:', state.hover)
+})
+```
+
+## 语义化配置
+
+对于 AI/LLM 驱动的图表配置，可使用语义化控制器：
+
+```typescript
+import { SemanticChartController } from '@363045841yyt/klinechart-core/semantic'
+
+const semantic = new SemanticChartController(chartInstance)
+
+// 应用自然语言配置
+semantic.applyConfig({
+  "stockSymbol": "AAPL",
+  "dateRange": { "start": "2024-01-01", "end": "2024-06-01" },
+  "indicators": ["MA20", "MACD", "RSI"],
+  "chart": {
+    "chartType": "candlestick",
+    "theme": "dark",
+    "gridLines": { "horizontal": true, "vertical": false }
+  },
+  "display": {
+    "paneRatios": { "main": 0.6, "sub1": 0.4 }
+  }
+})
+```
+
+## 浏览器支持
+
+- Chrome/Edge 90+
+- Firefox 88+
+- Safari 14+
+
+需要支持以下特性：
+- ResizeObserver
+- Canvas 2D Context
+- ES2022（或转译）
+
+## 许可证
+
+MIT © 363045841
+
+## 相关包
+
+- `@363045841yyt/klinechart` —— Vue 3 绑定
+- `@363045841yyt/klinechart-react` —— React 绑定（即将推出）
+- `@363045841yyt/klinechart-angular` —— Angular 绑定（即将推出）

package/dist/engine/renderers/webgl/candleSurface.js

@@ -1,52 +1,52 @@
-const RECT_VERTEX_SHADER_SOURCE = `#version 300 es
-precision mediump float;
-
-in vec2 a_unit;
-in vec4 a_rect;
-
-uniform vec2 u_resolution;
-uniform float u_scrollX;
-
-void main() {
-    vec2 position = vec2(
-        a_rect.x - u_scrollX + a_unit.x * a_rect.z,
-        a_rect.y + a_unit.y * a_rect.w
-    );
-
-    vec2 zeroToOne = position / u_resolution;
-    vec2 clip = vec2(
-        zeroToOne.x * 2.0 - 1.0,
-        1.0 - zeroToOne.y * 2.0
-    );
-
-    gl_Position = vec4(clip, 0.0, 1.0);
+const RECT_VERTEX_SHADER_SOURCE = `#version 300 es
+precision mediump float;
+
+in vec2 a_unit;
+in vec4 a_rect;
+
+uniform vec2 u_resolution;
+uniform float u_scrollX;
+
+void main() {
+    vec2 position = vec2(
+        a_rect.x - u_scrollX + a_unit.x * a_rect.z,
+        a_rect.y + a_unit.y * a_rect.w
+    );
+
+    vec2 zeroToOne = position / u_resolution;
+    vec2 clip = vec2(
+        zeroToOne.x * 2.0 - 1.0,
+        1.0 - zeroToOne.y * 2.0
+    );
+
+    gl_Position = vec4(clip, 0.0, 1.0);
 }`;
-const LINE_VERTEX_SHADER_SOURCE = `#version 300 es
-precision mediump float;
-
-in vec2 a_position;
-
-uniform vec2 u_resolution;
-uniform float u_scrollX;
-
-void main() {
-    vec2 position = vec2(a_position.x - u_scrollX, a_position.y);
-    vec2 zeroToOne = position / u_resolution;
-    vec2 clip = vec2(
-        zeroToOne.x * 2.0 - 1.0,
-        1.0 - zeroToOne.y * 2.0
-    );
-
-    gl_Position = vec4(clip, 0.0, 1.0);
+const LINE_VERTEX_SHADER_SOURCE = `#version 300 es
+precision mediump float;
+
+in vec2 a_position;
+
+uniform vec2 u_resolution;
+uniform float u_scrollX;
+
+void main() {
+    vec2 position = vec2(a_position.x - u_scrollX, a_position.y);
+    vec2 zeroToOne = position / u_resolution;
+    vec2 clip = vec2(
+        zeroToOne.x * 2.0 - 1.0,
+        1.0 - zeroToOne.y * 2.0
+    );
+
+    gl_Position = vec4(clip, 0.0, 1.0);
 }`;
-const FRAGMENT_SHADER_SOURCE = `#version 300 es
-precision mediump float;
-
-uniform vec4 u_color;
-out vec4 outColor;
-
-void main() {
-    outColor = u_color;
+const FRAGMENT_SHADER_SOURCE = `#version 300 es
+precision mediump float;
+
+uniform vec4 u_color;
+out vec4 outColor;
+
+void main() {
+    outColor = u_color;
 }`;
 const UNIT_QUAD = new Float32Array([
     0, 0,

package/dist/version.d.ts

@@ -1,2 +1,2 @@
-export declare const VERSION: string;
+export declare const VERSION = "0.7.5-alpha.0";
 //# sourceMappingURL=version.d.ts.map

package/dist/version.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"version.d.ts","sourceRoot":"","sources":["../src/version.ts"],"names":[],"mappings":"AACA,eAAO,MAAM,OAAO,QAAc,CAAA"}
+{"version":3,"file":"version.d.ts","sourceRoot":"","sources":["../src/version.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,OAAO,kBAAkB,CAAA"}

package/dist/version.js

@@ -1,3 +1,2 @@
-import pkg from '../package.json';
-export const VERSION = pkg.version;
+export const VERSION = "0.7.5-alpha.0";
 //# sourceMappingURL=version.js.map

package/dist/version.js.map

@@ -1 +1 @@
-{"version":3,"file":"version.js","sourceRoot":"","sources":["../src/version.ts"],"names":[],"mappings":"AAAA,OAAO,GAAG,MAAM,iBAAiB,CAAA;AACjC,MAAM,CAAC,MAAM,OAAO,GAAG,GAAG,CAAC,OAAO,CAAA"}
+{"version":3,"file":"version.js","sourceRoot":"","sources":["../src/version.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,OAAO,GAAG,eAAe,CAAA"}