@363045841yyt/klinechart-core 0.8.14 → 0.8.15-alpha.0

package/dist/engine/chart.js

@@ -1,4 +1,4 @@
-import { createSignal } from '../reactivity/signal';
+import { createStateStore, createSignal } from '../reactivity/signal';
 import { InteractionController } from './controller/interaction';
 import { ChartDataManager } from './data/chartDataManager';
 import { ChartIndicatorManager } from './indicators/chartIndicatorManager';
@@ -19,7 +19,7 @@ import { createVolumeLookbacks, pushToVolumeLookbacks, } from '../alerts/rolling
 export { getPhysicalKLineConfig };
 export class Chart {
     dom;
-    opt;
+    _optionsSignal;
     dataManager;
     viewportManager;
     layoutManager;
@@ -43,12 +43,8 @@ export class Chart {
     _activeMode;
     _kLineMode = new KLineMode();
     _timeShareMode = new TimeShareMode();
-    /** 模式切换时保存的渲染状态（退出分时时恢复） */
-    _modeSavedKWidth = 0;
-    _modeSavedKGap = 0;
-    _modeSavedZoomLevel = 0;
-    /** 分时模式激活前的 pane Y 轴刻度类型（退出分时时恢复） */
-    _savedScaleTypes;
+    /** 进入分时模式时保存的快照，退出时恢复（包含 zoom/scale/indicators） */
+    _savedTimeShareState = null;
     /** 上次预警评估的最新 K 线时间戳（用于去重） */
     _lastAlertTimestamp = null;
     /** 预警控制器 */
@@ -100,11 +96,11 @@ export class Chart {
         this.dom = dom;
         const { kWidth: _kWidth, kGap: _kGap, ...restOpt } = opt;
         // Chart 不持有业务 SSOT，kWidth/kGap/zoomLevel 由外部通过 applyRenderState() 传入
-        this.opt = { ...restOpt, kWidth: _kWidth ?? 0, kGap: _kGap ?? 0 };
+        this._optionsSignal = createSignal({ ...restOpt, kWidth: _kWidth ?? 0, kGap: _kGap ?? 0 });
         this._activeMode = this._kLineMode;
         this.interaction = new InteractionController(this);
         this.interaction.setOnInteractionChange((snapshot) => {
-            this._interactionSignal.set(snapshot);
+            this.state.set.interaction(snapshot);
         });
         this.pluginHost = createPluginHost();
         this.rendererPluginManager = new RendererPluginManager();
@@ -112,44 +108,49 @@ export class Chart {
         // 注入依赖
         this.rendererPluginManager.setPluginHost(this.pluginHost);
         this.rendererPluginManager.setInvalidateCallback(() => this.scheduleDraw());
+        const initialOpt = this._optionsSignal.peek();
         this.viewportManager = new ChartViewportManager({
             getDom: () => this.dom,
-            getBottomAxisHeight: () => this.opt.bottomAxisHeight,
+            getBottomAxisHeight: () => this._optionsSignal.peek().bottomAxisHeight,
             getLeftLoadBufferWidth: () => this.dataManager.getLeftLoadBufferWidth(),
             getZoomLevel: () => this.zoomController.currentZoomLevel,
-            getLastVisibleRange: () => this.dataManager.lastVisibleRange,
-            getKWidth: () => this.opt.kWidth,
-            getKGap: () => this.opt.kGap,
+            getLastVisibleRange: () => this.dataManager.getCurrentVisibleRange() ?? { start: 0, end: 0 },
+            getKWidth: () => this._optionsSignal.peek().kWidth,
+            getKGap: () => this._optionsSignal.peek().kGap,
             scheduleDraw: (level) => this.scheduleDraw(level),
             onResizeCompleted: () => {
                 this.resize();
             },
             resizeSharedWebGLSurface: (plotWidth, plotHeight, dpr) => this.sharedWebGLSurface.resize(plotWidth, plotHeight, dpr),
         });
-        this.layoutManager = new ChartPaneLayout(this.opt.panes, {
+        this.viewportManager.setContentWidthProvider(() => Math.max(this.dataManager.getContentWidth(), this.dataManager.getLeftLoadBufferWidth()));
+        this.layoutManager = new ChartPaneLayout(initialOpt.panes, {
             getDom: () => this.dom,
-            getOption: () => ({
-                rightAxisWidth: this.opt.rightAxisWidth,
-                leftAxisWidth: this.opt.leftAxisWidth,
-                yPaddingPx: this.opt.yPaddingPx,
-                priceLabelWidth: this.opt.priceLabelWidth,
-                paneGap: this.opt.paneGap,
-                defaultPaneMinHeightPx: this.opt.defaultPaneMinHeightPx,
-            }),
+            getOption: () => {
+                const o = this._optionsSignal.peek();
+                return {
+                    rightAxisWidth: o.rightAxisWidth,
+                    leftAxisWidth: o.leftAxisWidth,
+                    yPaddingPx: o.yPaddingPx,
+                    priceLabelWidth: o.priceLabelWidth,
+                    paneGap: o.paneGap,
+                    defaultPaneMinHeightPx: o.defaultPaneMinHeightPx,
+                };
+            },
             getViewport: () => this.viewportManager.getViewport(),
             getSharedWebGLSurface: () => this.sharedWebGLSurface,
             setKnownPaneIds: (ids) => this.rendererPluginManager.setKnownPaneIds(ids),
             notifyPaneResize: (paneId, pane) => this.rendererPluginManager.notifyResize(paneId, wrapPaneInfo(pane)),
             scheduleDraw: (level) => this.scheduleDraw(level),
             onLayoutChange: (ratios, specs) => {
-                this._paneRatiosSignal.set(ratios);
-                this._paneLayoutSignal.set(specs);
-                this.opt = { ...this.opt, panes: specs };
+                this.state.set.paneRatios(ratios);
+                this.state.set.paneLayout(specs);
+                this._optionsSignal.set({ ...this._optionsSignal.peek(), panes: specs });
             },
         });
         this.alertController = createAlertController();
         this.dataManager = new ChartDataManager({
-            getOption: () => this.opt,
+            getOption: () => this._optionsSignal.peek(),
             getEffectiveDpr: () => this.viewportManager.getEffectiveDpr(),
             getLogicalScrollLeft: () => this.viewportManager.getLogicalScrollLeft(),
             getCachedScrollLeft: () => this.viewportManager.getCachedScrollLeft(),
@@ -162,9 +163,6 @@ export class Chart {
             scheduleDraw: (level) => this.scheduleDraw(level),
             resetInteraction: () => this.interaction.reset(),
             getIndicatorScheduler: () => this.indicatorManager.indicatorSchedulerAccessor,
-            setPendingIndicatorDataUpdate: (v) => {
-                this.dataManager.pendingIndicatorDataUpdate = v;
-            },
             isPointerDown: () => this.interaction.isPointerDown(),
             onTimeShareDataReady: (dataLength) => {
                 const vp = this.viewportManager.computeViewport();
@@ -173,12 +171,8 @@ export class Chart {
                 const result = this._activeMode.computeKWidth(dataLength, vp.plotWidth, vp.dpr);
                 if (result) {
                     this.applyRenderState(result.kWidth, result.kGap);
-                    const container = this.dom.container;
-                    if (container) {
-                        const leftBuffer = this.dataManager.getLeftLoadBufferWidth();
-                        this.viewportManager.setScrollLeft(leftBuffer);
-                        this.viewportManager.applyPendingScrollLeft(container);
-                    }
+                    const leftBuffer = this.dataManager.getLeftLoadBufferWidth();
+                    this.viewportManager.setScrollLeft(leftBuffer);
                 }
             },
             onDataProcessed: (data, range) => this.evaluateAlerts(data, range), // Alert 管线绑定
@@ -186,28 +180,23 @@ export class Chart {
         this.zoomController = new ChartZoomController({
             getLogicalScrollLeft: () => this.viewportManager.getLogicalScrollLeft(),
             getCurrentDpr: () => this.viewportManager.getEffectiveDpr(),
-            getLeftLoadBufferWidth: () => this.dataManager.getLeftLoadBufferWidth(),
-            getContentWidth: () => this.dataManager.getContentWidth(),
             getClientWidth: () => this.viewportManager.getViewport()?.viewWidth ?? this.dom.container?.clientWidth ?? 0,
+            getDataLength: () => this.dataManager.getData().length,
+            getPlotWidth: () => this.dataManager.getLeftLoadBufferWidth(),
             setScrollLeft: (v) => {
                 this.viewportManager.setScrollLeft(v);
             },
-            onZoomCommitted: (result) => {
-                this.opt = { ...this.opt, kWidth: result.kWidth, kGap: result.kGap };
-                this.updateViewportSignal();
-                this.scheduleDraw();
+            onChange: () => {
+                this.syncKWidthKGap();
             },
-            getKWidth: () => this.opt.kWidth,
-            getKGap: () => this.opt.kGap,
-            getMinKWidth: () => this.opt.minKWidth,
-            getMaxKWidth: () => this.opt.maxKWidth,
-            zoomLevelCount: Math.max(2, Math.round(this.opt.zoomLevels ?? 20)),
-            initialZoomLevel: this.opt.initialZoomLevel ?? 1,
+            getMinKWidth: () => this._optionsSignal.peek().minKWidth,
+            getMaxKWidth: () => this._optionsSignal.peek().maxKWidth,
+            zoomLevelCount: Math.max(2, Math.round(this._optionsSignal.peek().zoomLevels ?? 20)),
+            initialZoomLevel: this._optionsSignal.peek().initialZoomLevel ?? 1,
         });
-        // 注意：初始 kWidth/kGap 应由外部通过 applyRenderState() 传入
         // 初始化指标管理器
         this.indicatorManager = new ChartIndicatorManager({
-            getOption: () => this.opt,
+            getOption: () => this._optionsSignal.peek(),
             getPluginHost: () => this.pluginHost,
             getRenderer: (name) => this.getRenderer(name),
             useRenderer: (plugin, config) => this.useRenderer(plugin, config),
@@ -218,40 +207,41 @@ export class Chart {
             upsertPane: (def) => this.layoutManager.upsertPane(def),
             removePaneDefinition: (paneId) => this.layoutManager.removePaneDefinition(paneId),
             getPaneSpecs: () => this.layoutManager.getPaneSpecs(),
-            getPaneRatiosSignal: () => this._paneRatiosSignal,
+            getPaneRatiosSignal: () => this.state.signals.paneRatios,
             getInternalPaneRatios: () => this.layoutManager.getInternalPaneRatios(),
             setInternalPaneRatio: (paneId, ratio) => this.layoutManager.setInternalPaneRatio(paneId, ratio),
             deleteInternalPaneRatio: (paneId) => this.layoutManager.deleteInternalPaneRatio(paneId),
             applyPaneLayoutSpecs: (specs) => this.layoutManager.applyPaneLayoutSpecs(specs),
-            getLastVisibleRange: () => this.dataManager.lastVisibleRange,
+            getLastVisibleRange: () => this.dataManager.getCurrentVisibleRange() ?? { start: 0, end: 0 },
             getCrosshairPos: () => this.interaction.crosshairPos,
             getCrosshairPrice: () => this.interaction.crosshairPrice,
             getActivePaneId: () => this.interaction.activePaneId,
             scheduleDraw: (level) => this.scheduleDraw(level),
-            setPendingIndicatorDataUpdate: (v) => {
-                this.dataManager.pendingIndicatorDataUpdate = v;
-            },
             getRenderContext: (paneId) => this.renderer?.getPaneCtxMap()?.get(paneId) ?? null,
             addLayer: (layer) => this.renderer?.getScene()?.addLayer(layer),
             removeLayer: (id) => this.renderer?.getScene()?.removeLayer(id) ?? false,
             getLayer: (id) => this.renderer?.getScene()?.getLayer(id) ?? null,
             setLayerVisibility: (id, visible) => this.renderer?.getScene()?.setLayerVisibility(id, visible),
+            getIndicatorScheduler: () => this.indicatorManager.indicatorSchedulerAccessor,
+            getRightAxisWidth: () => this._optionsSignal.peek().rightAxisWidth,
+            getPriceLabelWidth: () => this._optionsSignal.peek().priceLabelWidth ?? 60,
+            getYPaddingPx: () => this._optionsSignal.peek().yPaddingPx,
         });
         // Worker 异步结果就绪后串联 Alert 管线
         this.indicatorManager.indicatorSchedulerAccessor.setOnResultsApplied(() => {
             const data = this.dataManager.getInternalData();
-            this.evaluateAlerts(data, this.dataManager.lastVisibleRange);
+            this.evaluateAlerts(data, this.dataManager.getCurrentVisibleRange() ?? { start: 0, end: 0 });
         });
         // 初始化渲染器
         this.renderer = new ChartRenderer({
             getDom: () => this.dom,
-            getOption: () => this.opt,
+            getOption: () => this._optionsSignal.peek(),
             getPaneRenderers: () => this.paneRenderers,
             getInteraction: () => this.interaction,
             getSharedWebGLSurface: () => this.sharedWebGLSurface,
             getPluginHost: () => this.pluginHost,
             getRendererPluginManager: () => this.rendererPluginManager,
-            getTheme: () => this._themeSignal.peek(),
+            getTheme: () => this.state.signals.theme.peek(),
             getCurrentZoomLevel: () => this.zoomController.currentZoomLevel,
             getZoomLevelCount: () => this.zoomController.zoomLevelCount,
             getViewportManager: () => this.viewportManager,
@@ -261,6 +251,7 @@ export class Chart {
         });
         this.renderer.registerDrawingPlugins();
         this.renderer.initCoreRenderers();
+        this.syncKWidthKGap();
         this.viewportManager.init();
     }
     getViewport() {
@@ -276,26 +267,34 @@ export class Chart {
             return;
         const prev = this._activeMode;
         if (mode === this._timeShareMode) {
-            this._modeSavedKWidth = this.opt.kWidth;
-            this._modeSavedKGap = this.opt.kGap;
-            this._modeSavedZoomLevel = this.zoomController.currentZoomLevel;
-            this._savedScaleTypes = new Map();
+            this._savedTimeShareState = {
+                zoomLevel: this.zoomController.currentZoomLevel,
+                scaleTypes: new Map(),
+                mainIndicators: [],
+                subPanes: [],
+            };
             for (const r of this.paneRenderers) {
-                this._savedScaleTypes.set(r.getPane().id, r.getPane().yAxis.getScaleType());
+                this._savedTimeShareState.scaleTypes.set(r.getPane().id, r.getPane().yAxis.getScaleType());
             }
+            for (const [id, entry] of this.indicatorManager.mainIndicatorsSignalPeek) {
+                this._savedTimeShareState.mainIndicators.push({ id, params: { ...entry.params } });
+            }
+            this._savedTimeShareState.subPanes = this.indicatorManager.getSubPaneEntries().map((e) => ({
+                id: e.indicatorId,
+                params: { ...e.params },
+            }));
         }
         else if (prev === this._timeShareMode) {
             for (const renderer of this.paneRenderers) {
                 const p = renderer.getPane();
-                const saved = this._savedScaleTypes?.get(p.id) ?? 'linear';
+                const saved = this._savedTimeShareState?.scaleTypes.get(p.id) ?? 'linear';
                 p.yAxis.setScaleType(saved);
                 p.yAxis.setBasePrice(null);
             }
-            this._savedScaleTypes = undefined;
         }
-        if (this._modeSavedKWidth > 0 && mode !== this._timeShareMode) {
-            this.applyRenderState(this._modeSavedKWidth, this._modeSavedKGap, this._modeSavedZoomLevel);
-            this._modeSavedKWidth = 0;
+        if (this._savedTimeShareState && mode !== this._timeShareMode) {
+            this.zoomController.setZoomLevel(this._savedTimeShareState.zoomLevel);
+            this.syncKWidthKGap();
         }
         prev.onDeactivate({
             enableMainIndicator: (id, p) => this.enableMainIndicator(id, p),
@@ -311,6 +310,28 @@ export class Chart {
             dataManager: this.dataManager,
             currentPeriod: this.dataManager.currentPeriod,
         }, prev);
+        if (mode === this._timeShareMode) {
+            for (const { id } of this._savedTimeShareState.mainIndicators) {
+                if (id !== 'TIMESHARE') {
+                    this.indicatorManager.disableMainIndicator(id);
+                }
+            }
+            this.indicatorManager.clearSubPanes();
+        }
+        else if (prev === this._timeShareMode) {
+            const saved = this._savedTimeShareState;
+            if (saved) {
+                for (const { id, params } of saved.mainIndicators) {
+                    if (id !== 'TIMESHARE') {
+                        this.indicatorManager.enableMainIndicator(id, params);
+                    }
+                }
+                for (const { id, params } of saved.subPanes) {
+                    this.indicatorManager.addIndicator(id, 'sub', params);
+                }
+            }
+            this._savedTimeShareState = null;
+        }
     }
     getCurrentDpr() {
         return this.viewportManager.getEffectiveDpr();
@@ -391,27 +412,34 @@ export class Chart {
         this.renderer.draw(level);
     }
     // ========== Render State API (Vue SSOT) ==========
+    syncKWidthKGap() {
+        const kw = this.zoomController.currentKWidth;
+        const kg = this.zoomController.currentKGap;
+        const current = this._optionsSignal.peek();
+        if (current.kWidth !== kw || current.kGap !== kg) {
+            this._optionsSignal.set({ ...current, kWidth: kw, kGap: kg });
+        }
+        this.scheduleDraw();
+    }
     /**
-     * 应用渲染状态（由 Vue/Store 层在状态更新后调用）
-     * Chart 不拥有业务 SSOT，只负责接收参数并渲染
-     * 这是写入 opt.kWidth/kGap 和 currentZoomLevel 的唯一入口
+     * 应用渲染状态
+     * kWidth/kGap/zoomLevel 由 zoomController 统一管理（SSOT）。
+     * 当 zoomLevel 提供时，kWidth/kGap 由 zoomController 从 zoomLevel 推导。
+     * 当 zoomLevel 不提供时（如分时图），直接设置 kWidth/kGap。
      */
     applyRenderState(kWidth, kGap, zoomLevel) {
-        const nextZoomLevel = zoomLevel !== undefined
-            ? Math.max(1, Math.min(this.zoomController.zoomLevelCount, zoomLevel))
-            : this.zoomController.currentZoomLevel;
-        const renderStateChanged = this.opt.kWidth !== kWidth ||
-            this.opt.kGap !== kGap ||
-            this.zoomController.currentZoomLevel !== nextZoomLevel;
-        if (!renderStateChanged) {
-            return;
-        }
-        this.opt = { ...this.opt, kWidth, kGap };
         if (zoomLevel !== undefined) {
-            this.zoomController.setZoomLevel(nextZoomLevel);
+            const clamped = Math.max(1, Math.min(this.zoomController.zoomLevelCount, zoomLevel));
+            if (this.zoomController.currentZoomLevel === clamped)
+                return;
+            this.zoomController.setZoomLevel(clamped);
         }
-        this.updateViewportSignal();
-        this.scheduleDraw();
+        else {
+            if (this.zoomController.currentKWidth === kWidth && this.zoomController.currentKGap === kGap)
+                return;
+            this.zoomController.setKWidthKGap(kWidth, kGap);
+        }
+        this.syncKWidthKGap();
     }
     /** 获取总缩放级别数 */
     getZoomLevelCount() {
@@ -441,7 +469,7 @@ export class Chart {
     }
     /** 获取当前 ChartOptions（返回内部当前快照） */
     getOption() {
-        return this.opt;
+        return this._optionsSignal.peek();
     }
     /**
      * 更新配置并触发布局/重绘
@@ -458,11 +486,11 @@ export class Chart {
         }
         if (partial.panes) {
             const nextPanes = partial.panes.map((pane) => ({ ...pane }));
-            this.opt = { ...this.opt, ...partial, panes: nextPanes };
+            this._optionsSignal.set({ ...this._optionsSignal.peek(), ...partial, panes: nextPanes });
             this.layoutManager.applyPaneLayoutSpecs(nextPanes);
             return;
         }
-        this.opt = { ...this.opt, ...partial };
+        this._optionsSignal.set({ ...this._optionsSignal.peek(), ...partial });
         this.resize();
     }
     updatePaneLayout(panes) {
@@ -483,7 +511,7 @@ export class Chart {
     /** 更新绘图对象 */
     setDrawings(drawings) {
         this.renderer.getDrawingStore().setAll(drawings);
-        this._drawingsSignal.set(drawings);
+        this.state.signals.drawings.set(drawings);
         this.scheduleDraw();
     }
     /** 更新选中的绘图 ID */
@@ -719,7 +747,7 @@ export class Chart {
     }
     /** 容器尺寸变化时调用 */
     resize() {
-        if (this._activeMode.debugName === 'TimeShare') {
+        if (this._activeMode === this._timeShareMode) {
             const tsData = this.dataManager.getTimeShareData();
             const vp = this.viewportManager.computeViewport();
             if (!vp || vp.plotWidth <= 0)
@@ -728,12 +756,8 @@ export class Chart {
                 const result = this._activeMode.computeKWidth(tsData.length, vp.plotWidth, vp.dpr);
                 if (result) {
                     this.applyRenderState(result.kWidth, result.kGap);
-                    const container = this.dom.container;
-                    if (container) {
-                        const leftBuffer = this.dataManager.getLeftLoadBufferWidth();
-                        this.viewportManager.setScrollLeft(leftBuffer);
-                        this.viewportManager.applyPendingScrollLeft(container);
-                    }
+                    const leftBuffer = this.dataManager.getLeftLoadBufferWidth();
+                    this.viewportManager.setScrollLeft(leftBuffer);
                 }
             }
             this.renderer.clearCachedFrame();
@@ -774,26 +798,28 @@ export class Chart {
         return this.viewportManager.computeViewport();
     }
     // ==================== Facade API (High-level interface for adapters) ====================
-    _themeSignal = createSignal('light');
-    _drawingToolSignal = createSignal(null);
-    _drawingsSignal = createSignal([]);
-    _paneRatiosSignal = createSignal({});
-    _paneLayoutSignal = createSignal([]);
-    _interactionSignal = createSignal({
-        crosshairPos: null,
-        crosshairIndex: null,
-        crosshairPrice: null,
-        hoveredIndex: null,
-        activePaneId: null,
-        tooltipPos: { x: 0, y: 0 },
-        tooltipAnchorPlacement: 'right-bottom',
-        hoveredMarkerData: null,
-        hoveredCustomMarker: null,
-        isDragging: false,
-        isResizingPaneBoundary: false,
-        isHoveringPaneBoundary: false,
-        hoveredPaneBoundaryId: null,
-        isHoveringRightAxis: false,
+    state = createStateStore({
+        theme: 'light',
+        drawingTool: null,
+        drawings: [],
+        paneRatios: {},
+        paneLayout: [],
+        interaction: {
+            crosshairPos: null,
+            crosshairIndex: null,
+            crosshairPrice: null,
+            hoveredIndex: null,
+            activePaneId: null,
+            tooltipPos: { x: 0, y: 0 },
+            tooltipAnchorPlacement: 'right-bottom',
+            hoveredMarkerData: null,
+            hoveredCustomMarker: null,
+            isDragging: false,
+            isResizingPaneBoundary: false,
+            isHoveringPaneBoundary: false,
+            hoveredPaneBoundaryId: null,
+            isHoveringRightAxis: false,
+        },
     });
     /** 视口状态信号 */
     get viewport() {
@@ -829,7 +855,7 @@ export class Chart {
     }
     /** 主题信号 */
     get theme() {
-        return this._themeSignal;
+        return this.state.signals.theme;
     }
     /** 指标实例列表信号（派生信号，自动随主/副图状态更新） */
     get indicators() {
@@ -841,22 +867,22 @@ export class Chart {
     }
     /** 当前绘图工具信号 */
     get drawingTool() {
-        return this._drawingToolSignal;
+        return this.state.signals.drawingTool;
     }
     /** 绘图对象列表信号 */
     get drawings() {
-        return this._drawingsSignal;
+        return this.state.signals.drawings;
     }
     /** 面板比例信号 */
     get paneRatios() {
-        return this._paneRatiosSignal;
+        return this.state.signals.paneRatios;
     }
     get paneLayout() {
-        return this._paneLayoutSignal;
+        return this.state.signals.paneLayout;
     }
     /** 交互状态信号 */
     get interactionState() {
-        return this._interactionSignal;
+        return this.state.signals.interaction;
     }
     // ---------- Data ----------
     setData(data) {
@@ -879,9 +905,17 @@ export class Chart {
         this._lastAlertTimestamp = null;
         const primaryPeriod = specs[0]?.period;
         if (primaryPeriod) {
+            // ⚠️ setActiveMode 必须在 dataManager.setSymbols 之前调用，
+            //    以确保 kWidth/kGap（从 zoom level 恢复）先写入 _optionsSignal，
+            //    后续 scrollLeft 恢复才能正确反推物理像素偏移。
             this.setActiveMode(primaryPeriod === 'timeshare' ? this._timeShareMode : this._kLineMode);
         }
         this.dataManager.setSymbols(specs);
+        // Scroll position 恢复必须放在 setActiveMode + setSymbols 之后，
+        // 此时 kWidth/kGap 已由 zoom level 恢复写回，计算不出错。
+        if (primaryPeriod && primaryPeriod !== 'timeshare') {
+            this.dataManager.tryRestoreScrollFromSnapshot();
+        }
     }
     addComparisonSymbol(spec) {
         this.dataManager.addComparisonSymbol(spec);
@@ -918,7 +952,7 @@ export class Chart {
      * 设置主题（高层 API）
      */
     setTheme(theme) {
-        this._themeSignal.set(theme);
+        this.state.set.theme(theme);
         this.scheduleDraw();
     }
     // ---------- Zoom ----------
@@ -1030,7 +1064,7 @@ export class Chart {
      * 更新缓存的 scrollLeft 并触发交互 controller
      */
     handleScrollEvent() {
-        this.interaction.onScroll({ scheduleDraw: !this.dataManager.pendingIndicatorDataUpdate });
+        this.interaction.onScroll({ scheduleDraw: !this.indicatorManager.indicatorSchedulerAccessor.busySignal.peek() });
         // 更新 viewport signal 中的 visible range
         this.updateViewportSignal();
     }
@@ -1086,7 +1120,7 @@ export class Chart {
      * @param tool 工具类型或 null 取消选择
      */
     setDrawingTool(tool) {
-        this._drawingToolSignal.set(tool);
+        this.state.set.drawingTool(tool);
         // TODO: 当 Chart 支持绘图工具切换时，在这里调用相应方法
     }
     /**