@363045841yyt/klinechart-core 0.7.3 → 0.7.5

package/dist/engine/chart.js

@@ -1,4 +1,4 @@
-import { createSignal } from '../reactivity/signal';
+import { createSignal, computed } from '../reactivity/signal';
 import { getVisibleRange } from './viewport/viewport';
 import { Pane, UpdateLevel } from './layout/pane';
 import { InteractionController } from './controller/interaction';
@@ -97,11 +97,11 @@ export class Chart {
     /** Overlay 帧复用的最近主渲染结果 */
     cachedDrawFrame = null;
     /** 副图管理器 */
-    subPaneManager;
-    /** 当前激活的主图指标列表（如 ['boll', 'ma']） */
-    activeMainIndicators = new Set();
-    /** 主图指标参数配置 */
-    mainIndicatorParams = {
+    subPaneManager = new SubPaneManager();
+    /** 主图指标激活状态与参数（存在即激活，默认参数在 enable 时初始化） */
+    _mainIndicatorsSignal = createSignal(new Map());
+    /** 主图指标默认参数 */
+    static DEFAULT_MAIN_PARAMS = {
         MA: { ma5: true, ma10: true, ma20: true, ma30: true, ma60: true },
         BOLL: { period: 20, multiplier: 2, showUpper: true, showMiddle: true, showLower: true, showBand: true },
         EXPMA: { fastPeriod: 12, slowPeriod: 50 },
@@ -133,26 +133,29 @@ export class Chart {
             console.warn(`[Chart] 未知的主图指标: ${indicatorId}`);
             return false;
         }
-        if (this.activeMainIndicators.has(id)) {
+        const map = this._mainIndicatorsSignal.peek();
+        const existing = map.get(id);
+        if (existing) {
             // 已启用，更新参数
             if (params) {
-                this.mainIndicatorParams[id] = { ...this.mainIndicatorParams[id], ...params };
+                const next = new Map(map);
+                next.set(id, { params: { ...existing.params, ...params } });
+                this._mainIndicatorsSignal.set(next);
                 this.updateIndicatorSchedulerConfig(id);
-                this.syncIndicatorsSignal();
             }
             return true;
         }
-        this.activeMainIndicators.add(id);
         // 合并默认参数和传入参数
-        if (params) {
-            this.mainIndicatorParams[id] = { ...this.mainIndicatorParams[id], ...params };
-        }
+        const defaults = Chart.DEFAULT_MAIN_PARAMS[id] ?? {};
+        const merged = params ? { ...defaults, ...params } : defaults;
+        const next = new Map(map);
+        next.set(id, { params: merged });
+        this._mainIndicatorsSignal.set(next);
         // 启用对应的渲染器
         this.enableMainIndicatorRenderer(id);
         // 更新调度器配置
         this.updateIndicatorSchedulerConfig(id);
         this.scheduleDraw();
-        this.syncIndicatorsSignal();
         return true;
     }
     /**
@@ -162,15 +165,17 @@ export class Chart {
      */
     disableMainIndicator(indicatorId) {
         const id = indicatorId.toUpperCase();
-        if (!this.activeMainIndicators.has(id))
+        const map = this._mainIndicatorsSignal.peek();
+        if (!map.has(id))
             return false;
-        this.activeMainIndicators.delete(id);
+        const next = new Map(map);
+        next.delete(id);
+        this._mainIndicatorsSignal.set(next);
         // 禁用对应的渲染器
         this.disableMainIndicatorRenderer(id);
         // 更新调度器配置
         this.updateIndicatorSchedulerConfig(id);
         this.scheduleDraw();
-        this.syncIndicatorsSignal();
         return true;
     }
     /**
@@ -191,14 +196,14 @@ export class Chart {
      * @returns 激活的指标ID数组
      */
     getActiveMainIndicators() {
-        return Array.from(this.activeMainIndicators);
+        return [...this._mainIndicatorsSignal.peek().keys()];
     }
     /**
      * 检查主图指标是否激活
      * @param indicatorId 指标ID
      */
     isMainIndicatorActive(indicatorId) {
-        return this.activeMainIndicators.has(indicatorId.toUpperCase());
+        return this._mainIndicatorsSignal.peek().has(indicatorId.toUpperCase());
     }
     /**
      * 更新主图指标参数
@@ -207,38 +212,41 @@ export class Chart {
      */
     updateMainIndicatorParams(indicatorId, params) {
         const id = indicatorId.toUpperCase();
-        if (!this.mainIndicatorParams[id]) {
-            this.mainIndicatorParams[id] = {};
-        }
-        this.mainIndicatorParams[id] = { ...this.mainIndicatorParams[id], ...params };
+        const map = this._mainIndicatorsSignal.peek();
+        const entry = map.get(id);
+        if (!entry)
+            return;
+        const merged = { ...entry.params, ...params };
+        const next = new Map(map);
+        next.set(id, { params: merged });
+        this._mainIndicatorsSignal.set(next);
         // 同步更新渲染器配置
         const rendererName = id.toLowerCase();
         const renderer = this.getRenderer(rendererName);
         if (renderer && renderer.setConfig) {
-            renderer.setConfig(this.mainIndicatorParams[id]);
+            renderer.setConfig(merged);
         }
         // 更新调度器
         this.updateIndicatorSchedulerConfig(id);
         this.scheduleDraw();
-        this.syncIndicatorsSignal();
     }
     /**
      * 获取主图指标参数
      * @param indicatorId 指标ID
      */
     getMainIndicatorParams(indicatorId) {
-        return this.mainIndicatorParams[indicatorId.toUpperCase()] ?? null;
+        return this._mainIndicatorsSignal.peek().get(indicatorId.toUpperCase())?.params ?? null;
     }
     /**
      * 清除所有主图指标
      */
     clearMainIndicators() {
-        for (const id of this.activeMainIndicators) {
+        const map = this._mainIndicatorsSignal.peek();
+        for (const id of map.keys()) {
             this.disableMainIndicatorRenderer(id);
         }
-        this.activeMainIndicators.clear();
+        this._mainIndicatorsSignal.set(new Map());
         this.scheduleDraw();
-        this.syncIndicatorsSignal();
     }
     /**
      * 启用主图指标渲染器（内部方法）
@@ -395,8 +403,9 @@ export class Chart {
      * 更新调度器配置（内部方法）
      */
     updateIndicatorSchedulerConfig(indicatorId) {
-        const isActive = this.activeMainIndicators.has(indicatorId);
-        const params = this.mainIndicatorParams[indicatorId] || {};
+        const entry = this._mainIndicatorsSignal.peek().get(indicatorId);
+        const isActive = entry !== undefined;
+        const params = entry?.params ?? {};
         switch (indicatorId) {
             case 'MA':
                 this.indicatorScheduler.updateMAConfig({
@@ -475,7 +484,7 @@ export class Chart {
     setActiveMainIndicators(indicators) {
         // 计算需要启用和禁用的指标
         const newSet = new Set(indicators.map(i => i.toUpperCase()));
-        const currentSet = new Set(this.activeMainIndicators);
+        const currentSet = new Set(this._mainIndicatorsSignal.peek().keys());
         // 禁用不再激活的
         for (const id of currentSet) {
             if (!newSet.has(id)) {
@@ -523,11 +532,20 @@ export class Chart {
             this.indicatorScheduler.registerIndicator(definition);
         }
         this.indicatorScheduler.setInvalidateCallback(() => this.scheduleDraw());
-        // 初始化副图管理器
-        this.subPaneManager = new SubPaneManager();
         // 注册副图活跃列表提供者，调度器据此只计算启用的副图
         this.indicatorScheduler.setActiveSubPaneProvider(() => this.subPaneManager.getPaneIds());
         this.initPanes();
+        // dev: 主副图状态变更日志
+        if (import.meta.env?.MODE !== 'production') {
+            this._indicatorsComputed.subscribe(() => {
+                const instances = this._indicatorsComputed.peek();
+                console.log('[Chart] indicators signal changed:', instances);
+            });
+            this._subPanesComputed.subscribe(() => {
+                const subPanes = this._subPanesComputed.peek();
+                console.log('[Chart] subPanes signal changed:', subPanes);
+            });
+        }
         // 注册绘图主插件（负责绘制 shape，layer: 'main'）
         this.useRenderer(createDrawingRendererPlugin({ store: this.drawingStore }));
         // 注册绘图标签插件（负责推送选中绘图的轴标签，layer: 'overlay'）
@@ -707,7 +725,7 @@ export class Chart {
         // 3. 更新交互控制器坐标映射
         this.interaction.setKLinePositions(kLinePositions, range, kWidthPx);
         // 4. 通知调度器当前活跃主图指标 + 获取价格范围
-        this.indicatorScheduler.setActiveMainIndicators(Array.from(this.activeMainIndicators));
+        this.indicatorScheduler.setActiveMainIndicators([...this._mainIndicatorsSignal.peek().keys()]);
         const mainIndicatorRange = useCachedFrame ? null : this.indicatorScheduler.getMainIndicatorPriceRange();
         const hasCrosshair = this.interaction.getCrosshairIndex() !== null;
         // 5. 遍历所有 Pane 渲染主层 / overlay / Y 轴
@@ -1101,7 +1119,6 @@ export class Chart {
             ratios[id] = ratio;
         });
         this._paneRatiosSignal.set(ratios);
-        this.syncSubPanesSignal();
         this.onPaneLayoutChange?.(this.getPaneLayoutSpecs());
     }
     applyPaneLayoutSpecs(panes) {
@@ -1257,8 +1274,6 @@ export class Chart {
         }
         this.upsertPane({ id: paneId, ratio: this._internalPaneRatios.get(paneId) ?? 1, visible: true, role: 'indicator' });
         const success = this.subPaneManager.create(this, paneId, indicatorId, params ?? this.getDefaultSubPaneParams(indicatorId));
-        this.syncIndicatorsSignal();
-        this.syncSubPanesSignal();
         return success;
     }
     /**
@@ -1267,9 +1282,6 @@ export class Chart {
      */
     removeSubPane(paneId) {
         this.subPaneManager.remove(this, paneId);
-        this._internalPaneRatios.delete(paneId);
-        this.syncIndicatorsSignal();
-        this.syncSubPanesSignal();
     }
     /**
      * 替换副图的指标类型
@@ -1279,8 +1291,6 @@ export class Chart {
      */
     replaceSubPaneIndicator(paneId, newIndicatorId, params) {
         this.subPaneManager.replaceIndicator(this, paneId, newIndicatorId, params ?? this.getDefaultSubPaneParams(newIndicatorId));
-        this.syncIndicatorsSignal();
-        this.syncSubPanesSignal();
     }
     /**
      * 更新副图指标参数
@@ -1289,7 +1299,6 @@ export class Chart {
      */
     updateSubPaneParams(paneId, params) {
         this.subPaneManager.updateParams(this, paneId, params);
-        this.syncIndicatorsSignal();
     }
     /**
      * 清除所有副图面板
@@ -1307,8 +1316,6 @@ export class Chart {
         }
         // 更新布局，移除所有副图 pane
         this.applyPaneLayoutSpecs(this.opt.panes.filter((spec) => !subPaneIds.includes(spec.id)));
-        this.syncIndicatorsSignal();
-        this.syncSubPanesSignal();
     }
     /**
      * 获取当前所有副图指标类型
@@ -1848,8 +1855,6 @@ export class Chart {
     });
     _dataSignal = createSignal([]);
     _themeSignal = createSignal('light');
-    _indicatorsSignal = createSignal([]);
-    _subPanesSignal = createSignal([]);
     _drawingToolSignal = createSignal(null);
     _drawingsSignal = createSignal([]);
     _paneRatiosSignal = createSignal({});
@@ -1869,6 +1874,35 @@ export class Chart {
         hoveredPaneBoundaryId: null,
         isHoveringRightAxis: false,
     });
+    _indicatorsComputed = computed(() => {
+        const mainIndicators = [...this._mainIndicatorsSignal().entries()].map(([id, entry]) => ({
+            id,
+            definitionId: id,
+            label: id,
+            name: id,
+            role: 'main',
+            params: { ...entry.params },
+        }));
+        const subIndicators = this.subPaneManager.entriesSignal().map(entry => ({
+            id: entry.paneId,
+            definitionId: entry.indicatorId,
+            label: entry.indicatorId,
+            name: entry.indicatorId,
+            role: 'sub',
+            paneId: entry.paneId,
+            params: { ...entry.params },
+        }));
+        return [...mainIndicators, ...subIndicators];
+    });
+    _subPanesComputed = computed(() => {
+        const ratios = this._paneRatiosSignal();
+        return this.subPaneManager.entriesSignal().map(entry => ({
+            paneId: entry.paneId,
+            indicatorId: entry.indicatorId,
+            params: { ...entry.params },
+            ratio: ratios[entry.paneId] ?? 1,
+        }));
+    });
     /** 视口状态信号 */
     get viewport() {
         return this._viewportSignal;
@@ -1881,13 +1915,13 @@ export class Chart {
     get theme() {
         return this._themeSignal;
     }
-    /** 指标实例列表信号 */
+    /** 指标实例列表信号（派生信号，自动随主/副图状态更新） */
     get indicators() {
-        return this._indicatorsSignal;
+        return this._indicatorsComputed;
     }
-    /** 子图信息信号 */
+    /** 子图信息信号（派生信号，自动随副图条目/比例更新） */
     get subPanes() {
-        return this._subPanesSignal;
+        return this._subPanesComputed;
     }
     /** 当前绘图工具信号 */
     get drawingTool() {
@@ -2120,8 +2154,6 @@ export class Chart {
             const success = this.enableMainIndicator(definitionId, params);
             if (!success)
                 return null;
-            // 更新 indicators signal
-            this.syncIndicatorsSignal();
             return definitionId.toUpperCase();
         }
         else {
@@ -2130,9 +2162,6 @@ export class Chart {
             const success = this.createSubPane(paneId, definitionId, params);
             if (!success)
                 return null;
-            // 更新 signals
-            this.syncIndicatorsSignal();
-            this.syncSubPanesSignal();
             return paneId;
         }
     }
@@ -2143,23 +2172,16 @@ export class Chart {
      */
     removeIndicator(instanceId) {
         const id = instanceId.toUpperCase();
-        // 先尝试作为主图指标移除（直接检查内部状态，不依赖 signal）
-        if (this.activeMainIndicators.has(id)) {
-            const success = this.disableMainIndicator(instanceId);
-            if (success) {
-                this.syncIndicatorsSignal();
-            }
-            return success;
+        // 先尝试作为主图指标移除
+        if (this._mainIndicatorsSignal.peek().has(id)) {
+            return this.disableMainIndicator(instanceId);
         }
-        // 再尝试作为副图指标移除（检查 sub pane 是否存在）
+        // 再尝试作为副图指标移除
         const subPaneEntry = this.getSubPaneEntry(instanceId);
         if (subPaneEntry) {
             this.removeSubPane(instanceId);
-            this.syncIndicatorsSignal();
-            this.syncSubPanesSignal();
             return true;
         }
-        // 都没找到，返回 false
         return false;
     }
     /**
@@ -2170,20 +2192,17 @@ export class Chart {
      */
     updateIndicatorParams(instanceId, params) {
         const id = instanceId.toUpperCase();
-        // 先尝试作为主图指标更新（直接检查内部状态）
-        if (this.activeMainIndicators.has(id)) {
+        // 先尝试作为主图指标更新
+        if (this._mainIndicatorsSignal.peek().has(id)) {
             this.updateMainIndicatorParams(instanceId, params);
-            this.syncIndicatorsSignal();
             return true;
         }
         // 再尝试作为副图指标更新
         const subPaneEntry = this.getSubPaneEntry(instanceId);
         if (subPaneEntry) {
             this.updateSubPaneParams(instanceId, params);
-            this.syncIndicatorsSignal();
             return true;
         }
-        // 都没找到
         return false;
     }
     /**
@@ -2197,42 +2216,6 @@ export class Chart {
         console.warn('[Chart] reorderIndicators not fully implemented yet');
         return false;
     }
-    /**
-     * 同步 indicators signal
-     */
-    syncIndicatorsSignal() {
-        const mainIndicators = this.getActiveMainIndicators().map(id => ({
-            id,
-            definitionId: id,
-            label: id,
-            name: id,
-            role: 'main',
-            params: this.getMainIndicatorParams(id) ?? {},
-        }));
-        const subIndicators = this.getSubPaneEntries().map(entry => ({
-            id: entry.paneId,
-            definitionId: entry.indicatorId,
-            label: entry.indicatorId,
-            name: entry.indicatorId,
-            role: 'sub',
-            paneId: entry.paneId,
-            params: entry.params,
-        }));
-        this._indicatorsSignal.set([...mainIndicators, ...subIndicators]);
-    }
-    /**
-     * 同步 sub panes signal
-     */
-    syncSubPanesSignal() {
-        const entries = this.getSubPaneEntries();
-        const subPanes = entries.map(entry => ({
-            paneId: entry.paneId,
-            indicatorId: entry.indicatorId,
-            params: entry.params,
-            ratio: this._internalPaneRatios.get(entry.paneId) ?? 1,
-        }));
-        this._subPanesSignal.set(subPanes);
-    }
     // ---------- Sub Panes ----------
     /**
      * 调整子图大小（高层 API）