@quantlife/qlchart 0.0.1

package/src/plugins/drawing/DrawingAdapter.ts

@@ -0,0 +1,1762 @@
+import type { IChartApi, ISeriesApi, SeriesType as LWCSeriesType, CandlestickData, MouseEventParams, Time, HandleScrollOptions, HandleScaleOptions, Coordinate } from 'lightweight-charts';
+import {
+  DrawingManager,
+  getToolRegistry,
+  type IDrawing,
+  type DrawingEventType,
+  type DrawingEventCallback,
+  type SerializedDrawing,
+  type DrawingStyle,
+  type DrawingOptions,
+  type Anchor,
+} from 'lightweight-charts-drawing';
+import type { DrawingToolType, DrawingStyleConfig, DrawingPersistData } from '../../types/index.js';
+import { mapToolTypeToLib, mapLibTypeToOurs, getToolConfig } from './DrawingToolRegistry.js';
+import { TextLabelOverlay } from './TextLabelOverlay.js';
+
+/**
+ * 绘图创建状态
+ */
+interface CreationState {
+  phase: 'idle' | 'creating';
+  pendingDrawing: IDrawing | null;
+  anchors: Anchor[];
+  requiredCount: number;
+  activeLibTool: string | null;
+}
+
+/**
+ * 整体拖拽状态
+ */
+interface BodyDragState {
+  phase: 'idle' | 'dragging';
+  drawingId: string | null;
+  /** 拖拽起始鼠标位置（相对于container的像素坐标） */
+  startPixel: { x: number; y: number } | null;
+  /** 拖拽起始时所有锚点的原始位置（time/price） */
+  startAnchors: Anchor[] | null;
+}
+
+/**
+ * DrawingAdapter - 绘图适配器
+ * 作为 QLChart 和 lightweight-charts-drawing DrawingManager 的桥接层
+ *
+ * Core/Plugin 层不依赖 React
+ */
+export class DrawingAdapter {
+  private manager: DrawingManager | null = null;
+  private chart: IChartApi | null = null;
+  private series: ISeriesApi<LWCSeriesType> | null = null;
+  private container: HTMLElement | null = null;
+  private unsubscribers: Array<() => void> = [];
+  private chartId = '';
+
+  // ── 绘图创建状态 ──
+  private creationState: CreationState = {
+    phase: 'idle',
+    pendingDrawing: null,
+    anchors: [],
+    requiredCount: 0,
+    activeLibTool: null,
+  };
+
+  // ── 创建模式事件处理器引用（用于取消订阅） ──
+  private chartClickHandler: ((param: MouseEventParams) => void) | null = null;
+  private chartDblClickHandler: ((param: MouseEventParams) => void) | null = null;
+  private containerMouseMoveHandler: ((e: MouseEvent) => void) | null = null;
+  private keydownHandler: ((e: KeyboardEvent) => void) | null = null;
+
+  // ── 默认绘图样式 ──
+  private defaultDrawingStyle: Partial<DrawingStyle> = {
+    lineColor: '#2962ff',
+    lineWidth: 2,
+    lineDash: [],
+  };
+
+  // ── 整体拖拽状态 ──
+  private bodyDragState: BodyDragState = {
+    phase: 'idle',
+    drawingId: null,
+    startPixel: null,
+    startAnchors: null,
+  };
+  private bodyDragStartHandler: ((e: MouseEvent) => void) | null = null;
+  private bodyDragMoveHandler: ((e: MouseEvent) => void) | null = null;
+  private bodyDragEndHandler: ((e: MouseEvent) => void) | null = null;
+
+  // ★ D10: 画笔自由绘制
+  private freeDrawStartHandler: ((e: MouseEvent) => void) | null = null;
+  private freeDrawMoveHandler: ((e: MouseEvent) => void) | null = null;
+  private freeDrawEndHandler: ((e: MouseEvent) => void) | null = null;
+  private freeDrawActive = false;
+  private freeDrawRafId: number | null = null;
+  private freeDrawPendingEvent: MouseEvent | null = null;
+
+  // ── rAF 节流 ──
+  private rafId: number | null = null;
+  private pendingDragEvent: MouseEvent | null = null;
+
+  // Magnet snap
+  private magnetEnabled = false;
+  private candleData: CandlestickData[] = [];
+
+  // Bug2修复：价格范围缓存，避免每次mousemove遍历全量数据
+  private priceRangeCache: { minLow: number; maxHigh: number } | null = null;
+
+  // Bug2修复：保存原始工具类型（pattern-* 需要特殊处理）
+  private activeToolType: DrawingToolType | null = null;
+
+  // Bug1修复：当前图表周期
+  private currentPeriod: string = '1h';
+
+  // Bug4修复：文字标签 overlay
+  private textLabelOverlay: TextLabelOverlay | null = null;
+  private textInputEditor: HTMLInputElement | null = null;
+
+  // ★ V2: 副图绘图支持
+  /** 当前绘图目标 pane index（0 = 主图） */
+  private currentPaneIndex: number = 0;
+  /** paneIndex → 该 pane 的绘图数据（绘图隔离） */
+  private paneDrawingsMap = new Map<number, DrawingPersistData[]>();
+  /** pane 切换请求回调（通知外部获取目标 pane 的 series） */
+  private onPaneSwitchNeededCb?: (paneIndex: number) => void;
+  /** ★ V5 需求1：paneIndex → series 映射（内部维护，不再依赖外部回查） */
+  private paneSeriesInternalMap = new Map<number, ISeriesApi<LWCSeriesType>>();
+
+  // 保存 attach 时 chart 的原始 scroll/scale 配置（从顶层读取）
+  private savedScrollOptions: HandleScrollOptions | null = null;
+  private savedScaleOptions: HandleScaleOptions | null = null;
+
+  // Event callbacks
+  private onDrawingCreatedCb?: (drawing: IDrawing) => void;
+  private onDrawingSelectedCb?: (drawing: IDrawing | null) => void;
+  private onDrawingModifiedCb?: (drawing: IDrawing) => void;
+  private onDrawingRemovedCb?: (id: string) => void;
+  private onToolChangedCb?: (tool: string | null) => void;
+  // Bug2修复：双击回调
+  private onDrawingDoubleClickCb?: (drawing: IDrawing | null) => void;
+
+  /**
+   * 绑定 DrawingManager 到 chart/series/container
+   */
+  attach(
+    chart: IChartApi,
+    series: ISeriesApi<LWCSeriesType>,
+    container: HTMLElement,
+    chartId?: string,
+  ): void {
+    if (this.manager) {
+      this.detach();
+    }
+
+    this.chart = chart;
+    this.series = series;
+    this.container = container;
+    this.chartId = chartId ?? '';
+
+    this.manager = new DrawingManager();
+    this.manager.attach(chart, series as any, container);
+    this.bindEvents();
+
+    // ── 注册绘图创建模式事件 ──
+    this.chartClickHandler = (param) => this.handleChartClick(param);
+    chart.subscribeClick(this.chartClickHandler);
+
+    this.chartDblClickHandler = (param) => this.handleChartDblClick(param);
+    chart.subscribeDblClick(this.chartDblClickHandler);
+
+    this.containerMouseMoveHandler = (e) => this.handleContainerMouseMove(e);
+    container.addEventListener('mousemove', this.containerMouseMoveHandler);
+
+    this.keydownHandler = (e) => this.handleKeydown(e);
+    document.addEventListener('keydown', this.keydownHandler);
+
+    // Bug①修复：绑定拖拽交互——选中绘图时锁定主图pan
+    // 深拷贝 chart 原始 scroll/scale 配置（避免引用污染：applyOptions 会就地修改内部对象）
+    const chartOpts = this.chart.options();
+    const scrollSrc = chartOpts.handleScroll as HandleScrollOptions;
+    this.savedScrollOptions = {
+      pressedMouseMove: scrollSrc.pressedMouseMove,
+      mouseWheel: scrollSrc.mouseWheel,
+      horzTouchDrag: scrollSrc.horzTouchDrag,
+      vertTouchDrag: scrollSrc.vertTouchDrag,
+    };
+    const scaleOpts = chartOpts.handleScale as HandleScaleOptions;
+    // 处理 axisPressedMouseMove / axisDoubleClickReset 可能是 boolean 简写的情况
+    const apmm = scaleOpts.axisPressedMouseMove;
+    const adcr = scaleOpts.axisDoubleClickReset;
+    this.savedScaleOptions = {
+      mouseWheel: scaleOpts.mouseWheel,
+      pinch: scaleOpts.pinch,
+      axisPressedMouseMove: typeof apmm === 'boolean'
+        ? { time: apmm, price: apmm }
+        : { time: apmm.time, price: apmm.price },
+      axisDoubleClickReset: typeof adcr === 'boolean'
+        ? { time: adcr, price: adcr }
+        : { time: adcr.time, price: adcr.price },
+    };
+
+    this.bindDragInteraction();
+
+    // ★ 注册整体拖拽拦截器（capture 阶段，先于库的 mousedown）
+    this.bodyDragStartHandler = (e: MouseEvent) => this.handleBodyDragStart(e);
+    container.addEventListener('mousedown', this.bodyDragStartHandler, true);
+
+    // ★ D10: 注册画笔自由绘制拦截器（capture 阶段）
+    this.freeDrawStartHandler = (e: MouseEvent) => this.handleFreeDrawStart(e);
+    container.addEventListener('mousedown', this.freeDrawStartHandler, true);
+
+    // Bug4修复：初始化文字标签 overlay
+    this.textLabelOverlay = new TextLabelOverlay();
+    this.textLabelOverlay.attach(container);
+
+    // Bug4修复：订阅图表滚动/缩放事件，更新文字标签位置
+    this.chart.timeScale().subscribeVisibleLogicalRangeChange(() => {
+      this.updateTextLabels();
+    });
+
+    console.log('[DrawingAdapter] attached successfully', {
+      chartId: this.chartId,
+      hasManager: !!this.manager,
+      managerAttached: this.manager?.isAttached() ?? false,
+      hasBodyDragHandler: !!this.bodyDragStartHandler,
+      hasContainer: !!this.container,
+    });
+  }
+
+  /**
+   * 解绑并销毁 DrawingManager
+   */
+  detach(): void {
+    // ★ 清理整体拖拽事件
+    if (this.container && this.bodyDragStartHandler) {
+      this.container.removeEventListener('mousedown', this.bodyDragStartHandler, true);
+    }
+    // ★ D10: 清理画笔自由绘制事件
+    if (this.container && this.freeDrawStartHandler) {
+      this.container.removeEventListener('mousedown', this.freeDrawStartHandler, true);
+    }
+    if (this.freeDrawMoveHandler) {
+      document.removeEventListener('mousemove', this.freeDrawMoveHandler);
+    }
+    if (this.freeDrawEndHandler) {
+      document.removeEventListener('mouseup', this.freeDrawEndHandler);
+    }
+    if (this.bodyDragMoveHandler) {
+      document.removeEventListener('mousemove', this.bodyDragMoveHandler);
+    }
+    if (this.bodyDragEndHandler) {
+      document.removeEventListener('mouseup', this.bodyDragEndHandler);
+    }
+    this.bodyDragState = { phase: 'idle', drawingId: null, startPixel: null, startAnchors: null };
+    this.bodyDragStartHandler = null;
+    this.bodyDragMoveHandler = null;
+    this.bodyDragEndHandler = null;
+
+    // ★ 清理 rAF
+    if (this.rafId !== null) {
+      cancelAnimationFrame(this.rafId);
+      this.rafId = null;
+    }
+    this.pendingDragEvent = null;
+
+    // ── 注销绘图创建模式事件 ──
+    if (this.chart && this.chartClickHandler) {
+      this.chart.unsubscribeClick(this.chartClickHandler);
+    }
+    if (this.chart && this.chartDblClickHandler) {
+      this.chart.unsubscribeDblClick(this.chartDblClickHandler);
+    }
+    if (this.container && this.containerMouseMoveHandler) {
+      this.container.removeEventListener('mousemove', this.containerMouseMoveHandler);
+    }
+    if (this.keydownHandler) {
+      document.removeEventListener('keydown', this.keydownHandler);
+    }
+    this.cancelCreation();
+    // Bug4修复：清理文字编辑器和 overlay
+    this.hideTextInputEditor();
+    this.textLabelOverlay?.detach();
+    this.textLabelOverlay = null;
+    this.chartClickHandler = null;
+    this.chartDblClickHandler = null;
+    this.containerMouseMoveHandler = null;
+    this.keydownHandler = null;
+
+    this.unbindEvents();
+    if (this.manager) {
+      this.manager.detach();
+      this.manager = null;
+    }
+    this.chart = null;
+    this.series = null;
+    this.container = null;
+  }
+
+  /** 是否已绑定 */
+  isAttached(): boolean {
+    return this.manager?.isAttached() ?? false;
+  }
+
+  // ★ F3: 检查 adapter 是否已完全 attach（manager + container 事件监听）
+  isFullyAttached(): boolean {
+    return !!(this.manager?.isAttached() && this.bodyDragStartHandler && this.container);
+  }
+
+  // ★ F3: 获取 attach 诊断信息
+  getAttachDiagnostics(): Record<string, unknown> {
+    return {
+      hasManager: !!this.manager,
+      managerAttached: this.manager?.isAttached() ?? false,
+      hasChart: !!this.chart,
+      hasSeries: !!this.series,
+      hasContainer: !!this.container,
+      hasBodyDragHandler: !!this.bodyDragStartHandler,
+      chartId: this.chartId,
+    };
+  }
+
+  /**
+   * 设置当前绘图工具
+   * 'cursor' = 取消绘图模式
+   */
+  setActiveTool(toolType: DrawingToolType): void {
+    if (!this.manager) return;
+
+    // 如果正在创建，先取消
+    if (this.creationState.phase === 'creating') {
+      this.cancelCreation();
+    }
+
+    // Bug2修复：保存原始工具类型
+    this.activeToolType = toolType;
+
+    const libType = mapToolTypeToLib(toolType);
+    this.manager.setActiveTool(libType);
+  }
+
+  /** 获取当前工具类型 */
+  getActiveTool(): string | null {
+    return this.manager?.getActiveTool() ?? null;
+  }
+
+  // Bug1修复：设置当前图表周期
+  setPeriod(period: string): void {
+    this.currentPeriod = period;
+    this.refreshMeasureLabels();
+  }
+
+  /** 获取当前周期 */
+  getCurrentPeriod(): string {
+    return this.currentPeriod;
+  }
+
+  /**
+   * Bug1修复：刷新测量器标签 — patch 所有 date-price-range 绘图
+   */
+  private refreshMeasureLabels(): void {
+    if (!this.manager) return;
+    const drawings = this.manager.getAllDrawings();
+    for (const d of drawings) {
+      if (d.type === 'date-price-range') {
+        this.patchMeasureDrawing(d);
+      }
+    }
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    (this.manager as any).requestUpdate?.();
+  }
+
+  /**
+   * Bug1修复：Patch 测量器绘图，覆盖 getMeasureInfo 计算正确的 bars
+   */
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  private patchMeasureDrawing(drawing: IDrawing): void {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    if ((drawing as any)._measurePatched) {
+      // ★ Bug1修复：已 patch 过的只更新 _measurePeriod 值，然后触发重绘
+      // getMeasureInfo 的闭包会读取最新的 _measurePeriod，所以更新值后重绘即可
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      (drawing as any)._measurePeriod = this.currentPeriod;
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      (this.manager as any).requestUpdate?.();
+      return;
+    }
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    const origGetMeasureInfo = (drawing as any).getMeasureInfo?.bind(drawing);
+    if (!origGetMeasureInfo) return;
+
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    (drawing as any)._measurePeriod = this.currentPeriod;
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    (drawing as any).getMeasureInfo = () => {
+      const info = origGetMeasureInfo();
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      const period = (drawing as any)._measurePeriod ?? '1h';
+      const periodSec = this.periodToSeconds(period);
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      const anchors = (drawing as any).anchors ?? [];
+      if (anchors.length >= 2) {
+        const t0 = anchors[0].time;
+        const t1 = anchors[1].time;
+        const sec0 = typeof t0 === 'number' ? t0 : new Date(t0).getTime() / 1000;
+        const sec1 = typeof t1 === 'number' ? t1 : new Date(t1).getTime() / 1000;
+        const totalSeconds = Math.abs(sec1 - sec0);
+        info.bars = Math.max(1, Math.round(totalSeconds / periodSec));
+      }
+      return info;
+    };
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    (drawing as any)._measurePatched = true;
+
+    // 恢复库默认显示
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    (drawing as any).setMeasureOptions?.({
+      showBars: true,
+      showDays: true,
+    });
+  }
+
+  /**
+   * Bug1修复：将周期字符串转换为秒数
+   */
+  private periodToSeconds(period: string): number {
+    const match = period.match(/^(\d+)([mhdwM])$/);
+    if (!match) return 3600;
+    const n = parseInt(match[1], 10);
+    switch (match[2]) {
+      case 'm': return n * 60;
+      case 'h': return n * 3600;
+      case 'd': return n * 86400;
+      case 'w': return n * 604800;
+      case 'M': return n * 2592000;
+      default: return 3600;
+    }
+  }
+
+  /**
+   * Bug1修复：公开方法 — patch 测量器绘图（供外部调用）
+   */
+  patchMeasureDrawingPublic(drawing: IDrawing): void {
+    if (drawing.type === 'date-price-range') {
+      this.patchMeasureDrawing(drawing);
+    }
+  }
+
+  /** 获取所有绘图实例 */
+  getAllDrawings(): IDrawing[] {
+    return this.manager?.getAllDrawings() ?? [];
+  }
+
+  // ★ D8: 批量操作
+  /** 设置所有绘图的可见性 */
+  setAllVisible(visible: boolean): void {
+    this.manager?.getAllDrawings().forEach(d => {
+      d.updateOptions({ visible } as any);
+    });
+  }
+
+  /** 获取所有绘图是否可见 */
+  getAllVisible(): boolean {
+    const drawings = this.manager?.getAllDrawings() ?? [];
+    return drawings.length > 0 && drawings.every(d => (d.options as any).visible !== false);
+  }
+
+  /** 选中某个绘图 */
+  selectDrawing(id: string): void {
+    this.manager?.selectDrawing(id);
+  }
+
+  /** 取消选中 */
+  deselectAll(): void {
+    this.manager?.deselectAll();
+  }
+
+  /** 获取当前选中的绘图 */
+  getSelectedDrawing(): IDrawing | null {
+    return this.manager?.getSelectedDrawing() ?? null;
+  }
+
+  /** 删除指定绘图 */
+  removeDrawing(id: string): void {
+    this.manager?.removeDrawing(id);
+  }
+
+  /** 删除当前选中的绘图 */
+  removeSelected(): void {
+    const selected = this.getSelectedDrawing();
+    if (selected) {
+      this.removeDrawing(selected.id);
+    }
+  }
+
+  /** 清空所有绘图 */
+  clearAll(): void {
+    this.manager?.clearAll();
+  }
+
+  /**
+   * 导出绘图数据（用于持久化）
+   */
+  exportDrawings(): DrawingPersistData[] {
+    if (!this.manager) return [];
+    const serialized = this.manager.exportDrawings();
+    return serialized.map((s) => ({
+      id: s.id,
+      chartId: this.chartId,
+      type: s.type,
+      anchors: s.anchors.map((a: { time: unknown; price: number }) => {
+        const t = typeof a.time === 'number' ? a.time : 0;
+        return { time: t, price: a.price };
+      }),
+      style: {
+        lineColor: s.style.lineColor,
+        lineWidth: s.style.lineWidth,
+        lineDash: s.style.lineDash,
+        fillColor: s.style.fillColor,
+        fillOpacity: s.style.fillOpacity,
+        showLabels: s.style.showLabels,
+        labelFont: s.style.labelFont,
+        labelColor: s.style.labelColor,
+      },
+      options: {
+        ...s.options,
+        // Bug4修复：文字标签持久化
+        labelText: this.textLabelOverlay?.getLabel(s.id) ?? '',
+        // ★ 多周期共享修复：保存原始锚点（export时的精确时间）
+        originalAnchors: s.anchors.map((a: { time: unknown; price: number }) => {
+          const t = typeof a.time === 'number' ? a.time : 0;
+          return { time: t, price: a.price };
+        }),
+      },
+      createdAt: Date.now(),
+      updatedAt: Date.now(),
+      // ★ V2: 添加 paneIndex
+      paneIndex: this.currentPaneIndex,
+    }));
+  }
+
+  /**
+   * 导入绘图数据（从后端加载恢复）
+   */
+  importDrawings(data: DrawingPersistData[]): void {
+    if (!this.manager) return;
+
+    // ★ V3修复：导入前清除现有绘图（防止library追加模式导致重复）
+    this.manager.clearAll();
+
+    const serialized: SerializedDrawing[] = data.map((d) => {
+      // ★ 多周期共享修复：优先使用originalAnchors（精确时间），再对齐到当前周期
+      const originalAnchors = (d.options as any)?.originalAnchors as Array<{ time: number; price: number }> | undefined;
+      const sourceAnchors = originalAnchors ?? d.anchors;
+      const alignedAnchors = this.alignAnchorsToPeriod(
+        sourceAnchors.map(a => ({ time: a.time, price: a.price })),
+      );
+
+      return {
+        id: d.id,
+        type: d.type,
+        anchors: alignedAnchors.map(a => ({
+          time: a.time as any,
+          price: a.price,
+        })),
+        style: d.style as DrawingStyle,
+        options: d.options as DrawingOptions,
+      };
+    });
+
+    // factory: 使用 ToolRegistry 创建对应类型的绘图实例
+    const registry = getToolRegistry();
+    this.manager.importDrawings(serialized, (type, s) => {
+      // Bug4修复：恢复文字标签
+      const labelText = (s.options as any)?.labelText as string | undefined;
+      if (labelText && this.textLabelOverlay && this.container) {
+        // 延迟设置位置，等绘图渲染后通过 updatePositions 更新
+        // 先设置一个占位位置，后续在 chart 更新时修正
+        this.textLabelOverlay.setLabel(s.id, labelText, 0, 0);
+      }
+      return registry.createDrawing(type, s.id, s.anchors as any[], s.style, s.options);
+    });
+
+    // Bug1修复：patch 所有导入的测量工具
+    for (const d of this.manager!.getAllDrawings()) {
+      if (d.type === 'date-price-range') {
+        this.patchMeasureDrawing(d);
+      }
+    }
+  }
+
+  /**
+   * 更新主序列引用（数据重载后调用）
+   */
+  updateSeries(series: ISeriesApi<LWCSeriesType>): void {
+    // 如果series引用没变且已完全attach，无需更新
+    if (this.series === series && this.isFullyAttached()) return;
+    this.series = series;
+    // 如果DrawingManager已attach，需要重新绑定以更新内部series引用
+    if (this.manager && this.chart && this.container) {
+      const currentTool = this.manager.getActiveTool();
+      // 导出当前绘图以防重新attach后丢失
+      const savedDrawings = this.manager.exportDrawings();
+      this.manager.detach();
+      this.manager.attach(this.chart, series as any, this.container);
+      // 恢复绘图
+      if (savedDrawings.length > 0) {
+        // ★ Bug2修复：使用 this.importDrawings 而非 this.manager.importDrawings
+        // this.importDrawings 内部会 clearAll + alignAnchorsToPeriod
+        this.importDrawings(savedDrawings.map(s => ({
+          id: s.id,
+          chartId: this.chartId,
+          type: s.type,
+          anchors: s.anchors.map(a => ({
+            time: typeof a.time === 'number' ? a.time : 0,
+            price: a.price,
+          })),
+          style: s.style as any,
+          options: s.options as any,
+          createdAt: Date.now(),
+          updatedAt: Date.now(),
+        })));
+      }
+      if (currentTool) {
+        this.manager.setActiveTool(currentTool);
+      }
+    } else if (this.chart && this.container) {
+      // ★ F4: 未 attach 时执行完整 attach（最后防线）
+      console.warn('[DrawingAdapter] updateSeries called before attach, performing full attach');
+      this.attach(this.chart, series, this.container, this.chartId);
+    }
+  }
+
+  /**
+   * ★ Bug5修复：切换绘图目标series（用于在副图中绘图）
+   */
+  setTargetSeries(series: ISeriesApi<LWCSeriesType>): void {
+    if (this.series === series) return;
+    this.updateSeries(series);
+  }
+
+  /** 设置K线数据（用于磁铁吸附计算） */
+  setCandleData(data: CandlestickData[]): void {
+    this.candleData = data;
+    this.priceRangeCache = null;  // ★ Bug2修复：数据变化时清除缓存
+  }
+
+  /**
+   * ★ 多周期共享修复：二分查找最接近targetTime的K线时间戳
+   * candleData按time升序排列（由transformCandlestickData保证）
+   * 时间复杂度: O(log n)
+   */
+  private findNearestCandleTime(targetTime: number): number {
+    if (this.candleData.length === 0) return targetTime;
+
+    const data = this.candleData;
+    let lo = 0, hi = data.length - 1;
+
+    // 边界检查
+    const firstTime = data[0].time as number;
+    const lastTime = data[hi].time as number;
+    if (targetTime <= firstTime) return firstTime;
+    if (targetTime >= lastTime) return lastTime;
+
+    // 二分查找：找到第一个 >= targetTime 的位置
+    while (lo < hi) {
+      const mid = (lo + hi) >> 1;
+      const midTime = data[mid].time as number;
+      if (midTime === targetTime) return midTime;
+      if (midTime < targetTime) lo = mid + 1;
+      else hi = mid;
+    }
+
+    // lo指向第一个 >= targetTime 的位置，比较 lo 和 lo-1 哪个更近
+    const after = data[lo].time as number;
+    const before = data[lo - 1].time as number;
+    return (after - targetTime) < (targetTime - before) ? after : before;
+  }
+
+  /**
+   * ★ 多周期共享修复：将锚点时间对齐到当前周期的K线时间戳
+   * 用于跨周期共享时解决时间戳不匹配问题
+   */
+  private alignAnchorsToPeriod(
+    anchors: Array<{ time: number; price: number }>,
+  ): Array<{ time: number; price: number }> {
+    if (!this.candleData || this.candleData.length === 0) return anchors;
+
+    return anchors.map(anchor => ({
+      time: this.findNearestCandleTime(anchor.time),
+      price: anchor.price,  // price不需要对齐（所有周期通用）
+    }));
+  }
+
+  /** 设置磁铁吸附开关 */
+  setMagnetEnabled(enabled: boolean): void {
+    this.magnetEnabled = enabled;
+  }
+
+  /**
+   * 获取鼠标位置最近的K线价格（磁铁吸附）
+   */
+  getNearestPrice(clientX: number, clientY: number): { time: number; price: number } | null {
+    if (!this.chart || !this.candleData.length) return null;
+
+    try {
+      const timeScale = this.chart.timeScale();
+      const logicalTime = timeScale.coordinateToTime(clientX);
+      if (logicalTime === null) return null;
+
+      const timeNumber = logicalTime as number;
+      let nearest = this.candleData[0];
+      let minDist = Math.abs((nearest.time as number) - timeNumber);
+
+      for (const candle of this.candleData) {
+        const dist = Math.abs((candle.time as number) - timeNumber);
+        if (dist < minDist) {
+          minDist = dist;
+          nearest = candle;
+        }
+      }
+
+      return {
+        time: nearest.time as number,
+        price: nearest.close,
+      };
+    } catch {
+      return null;
+    }
+  }
+
+  /** 设置事件回调 */
+  onDrawingCreated(cb: (drawing: IDrawing) => void): void {
+    this.onDrawingCreatedCb = cb;
+  }
+  onDrawingSelected(cb: (drawing: IDrawing | null) => void): void {
+    this.onDrawingSelectedCb = cb;
+  }
+  onDrawingModified(cb: (drawing: IDrawing) => void): void {
+    this.onDrawingModifiedCb = cb;
+  }
+  onDrawingRemoved(cb: (id: string) => void): void {
+    this.onDrawingRemovedCb = cb;
+  }
+  onToolChanged(cb: (tool: string | null) => void): void {
+    this.onToolChangedCb = cb;
+  }
+
+  // Bug2修复：双击回调注册
+  onDrawingDoubleClick(cb: (drawing: IDrawing | null) => void): void {
+    this.onDrawingDoubleClickCb = cb;
+  }
+
+  /** Bug3修复：设置绘图文字标签（从属性面板调用） */
+  setDrawingText(drawingId: string, text: string): void {
+    if (!this.textLabelOverlay || !this.manager) return;
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    const drawing = (this.manager as any).getDrawing?.(drawingId);
+    if (!drawing) return;
+
+    // 获取绘图锚点的像素坐标
+    const anchors = drawing.anchors ?? [];
+    if (anchors.length === 0) return;
+
+    if (!this.chart || !this.series) return;
+
+    let pixel: { x: number; y: number };
+    try {
+      const x = this.chart.timeScale().timeToCoordinate(anchors[0].time as Time);
+      const y = this.series.priceToCoordinate(anchors[0].price);
+      if (x === null || y === null) return;
+      pixel = { x: x as number, y: y as number };
+    } catch {
+      return;
+    }
+
+    if (text) {
+      this.textLabelOverlay.setLabel(drawingId, text, pixel.x, pixel.y);
+    } else {
+      this.textLabelOverlay.removeLabel(drawingId);
+    }
+    this.onDrawingModifiedCb?.(drawing);
+  }
+
+  /** 销毁 */
+  dispose(): void {
+    this.detach();
+    this.onDrawingCreatedCb = undefined;
+    this.onDrawingSelectedCb = undefined;
+    this.onDrawingModifiedCb = undefined;
+    this.onDrawingRemovedCb = undefined;
+    this.onToolChangedCb = undefined;
+    this.onDrawingDoubleClickCb = undefined;
+    // ★ V2: 清理 pane 相关状态
+    this.paneDrawingsMap.clear();
+    this.currentPaneIndex = 0;
+    this.onPaneSwitchNeededCb = undefined;
+  }
+
+  // ═════════════════════════════════════════════
+  // ★ V2: 副图绘图支持方法
+  // ═════════════════════════════════════════════
+
+  /**
+   * ★ V2: 检测点击落在哪个 pane
+   * LWC v5 提供 chart.panes() API，每个 pane 有 getHeight()
+   */
+  private detectPaneIndex(clickY: number): number {
+    if (!this.chart) return 0;
+    try {
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      const panes = (this.chart as any).panes?.();
+      if (!panes || !Array.isArray(panes)) return 0;
+
+      // 从顶部开始累加各pane高度，判断clickY落在哪个pane
+      let accumulatedHeight = 0;
+      for (let i = 0; i < panes.length; i++) {
+        const paneHeight = panes[i].getHeight?.() ?? 0;
+        if (clickY >= accumulatedHeight && clickY < accumulatedHeight + paneHeight) {
+          return i;
+        }
+        accumulatedHeight += paneHeight;
+      }
+      return 0; // fallback：主图
+    } catch {
+      return 0;
+    }
+  }
+
+  /**
+   * ★ V2: 切换绘图目标 pane（带绘图隔离）
+   */
+  switchPane(paneIndex: number, paneSeries: ISeriesApi<LWCSeriesType>): void {
+    if (this.currentPaneIndex === paneIndex) return;
+
+    // 1. 保存当前 pane 的绘图
+    const currentDrawings = this.exportDrawings();
+    this.paneDrawingsMap.set(this.currentPaneIndex, currentDrawings);
+
+    // 2. 切换 series
+    this.currentPaneIndex = paneIndex;
+    this.setTargetSeries(paneSeries);
+
+    // 3. 恢复目标 pane 的绘图
+    const targetDrawings = this.paneDrawingsMap.get(paneIndex) ?? [];
+    this.clearAll();
+    if (targetDrawings.length > 0) {
+      this.importDrawings(targetDrawings);
+    }
+  }
+
+  /**
+   * ★ V2: 获取当前目标 pane index
+   */
+  getCurrentPaneIndex(): number {
+    return this.currentPaneIndex;
+  }
+
+  /**
+   * ★ V2: 重置到主图 pane
+   */
+  resetToMainPane(): void {
+    if (this.currentPaneIndex !== 0) {
+      // 切回主图 series
+      const mainSeries = this.paneSeriesInternalMap.get(0);
+      if (mainSeries) {
+        this.switchPane(0, mainSeries);
+      }
+    }
+    this.currentPaneIndex = 0;
+  }
+
+  /**
+   * ★ V6 需求1：清除所有 pane series 映射（指标 clearAll 后调用）
+   */
+  clearPaneSeriesMap(): void {
+    // 保留 pane 0（主图）的映射
+    const mainSeries = this.paneSeriesInternalMap.get(0);
+    this.paneSeriesInternalMap.clear();
+    if (mainSeries) {
+      this.paneSeriesInternalMap.set(0, mainSeries);
+    }
+    // 清除绘图隔离数据
+    this.paneDrawingsMap.clear();
+  }
+
+  /**
+   * ★ V5 需求1：注册 pane series 映射（供内部 detectPaneIndex 自动切换）
+   */
+  registerPaneSeries(paneIndex: number, series: ISeriesApi<LWCSeriesType>): void {
+    this.paneSeriesInternalMap.set(paneIndex, series);
+  }
+
+  /**
+   * ★ V5 需求1：取消注册 pane series
+   */
+  unregisterPaneSeries(paneIndex: number): void {
+    this.paneSeriesInternalMap.delete(paneIndex);
+  }
+
+  /**
+   * ★ V2: 设置 pane 切换请求回调
+   */
+  onPaneSwitchNeeded(cb: (paneIndex: number) => void): void {
+    this.onPaneSwitchNeededCb = cb;
+  }
+
+  // ── Private ──
+
+  /**
+   * Bug①修复：绑定拖拽交互
+   * 选中绘图时禁用 chart 的平移和缩放，取消选中时恢复
+   * 关键：handleScroll/handleScale 是 ChartOptions 顶层属性，pressedMouseMove 是正确属性名
+   */
+  private bindDragInteraction(): void {
+    if (!this.manager) return;
+
+    // 选中绘图 → 禁用 chart 的平移和缩放
+    this.manager.on('drawing:selected', () => {
+      if (!this.chart) return;
+      try {
+        this.chart.applyOptions({
+          handleScroll: {
+            pressedMouseMove: false,
+            mouseWheel: false,
+            horzTouchDrag: false,
+            vertTouchDrag: false,
+          },
+          handleScale: {
+            mouseWheel: false,
+            pinch: false,
+            axisPressedMouseMove: {
+              time: false,
+              price: false,
+            },
+            axisDoubleClickReset: {
+              time: true,
+              price: true,
+            },
+          },
+        });
+      } catch (e) {
+        console.warn('[DrawingAdapter] Failed to disable chart scroll/scale:', e);
+      }
+    });
+
+    // 取消选中 → 恢复 chart 的平移和缩放
+    this.manager.on('drawing:deselected', () => {
+      if (!this.chart) return;
+      try {
+        const defaultScroll: HandleScrollOptions = {
+          pressedMouseMove: true,
+          mouseWheel: true,
+          horzTouchDrag: true,
+          vertTouchDrag: true,
+        };
+        const defaultScale: HandleScaleOptions = {
+          mouseWheel: true,
+          pinch: true,
+          axisPressedMouseMove: { time: true, price: true },
+          axisDoubleClickReset: { time: true, price: true },
+        };
+        // 传入深拷贝副本，确保 savedXxxOptions 不被 applyOptions 的 merge 再次污染
+        const scrollRestore = this.savedScrollOptions
+          ? { ...this.savedScrollOptions }
+          : { ...defaultScroll };
+        const scaleRestore = this.savedScaleOptions
+          ? {
+              mouseWheel: this.savedScaleOptions.mouseWheel,
+              pinch: this.savedScaleOptions.pinch,
+              axisPressedMouseMove: { ...this.savedScaleOptions.axisPressedMouseMove as { time: boolean; price: boolean } },
+              axisDoubleClickReset: { ...this.savedScaleOptions.axisDoubleClickReset as { time: boolean; price: boolean } },
+            }
+          : { ...defaultScale };
+        this.chart.applyOptions({
+          handleScroll: scrollRestore,
+          handleScale: scaleRestore,
+        });
+      } catch (e) {
+        console.warn('[DrawingAdapter] Failed to restore chart scroll/scale:', e);
+      }
+    });
+  }
+
+  private bindEvents(): void {
+    if (!this.manager) return;
+
+    const events: Array<{ event: DrawingEventType; cb: DrawingEventCallback }> = [
+      { event: 'drawing:added', cb: (e) => { if (e.drawing) this.onDrawingCreatedCb?.(e.drawing); } },
+      { event: 'drawing:selected', cb: (e) => this.onDrawingSelectedCb?.(e.drawing ?? null) },
+      { event: 'drawing:deselected', cb: () => this.onDrawingSelectedCb?.(null) },
+      { event: 'drawing:updated', cb: (e) => { if (e.drawing) this.onDrawingModifiedCb?.(e.drawing); } },
+      { event: 'drawing:removed', cb: (e) => this.onDrawingRemovedCb?.(e.drawingId ?? '') },
+      { event: 'tool:changed', cb: (e) => this.onToolChangedCb?.(e.toolType ?? null) },
+    ];
+
+    for (const { event, cb } of events) {
+      const unsub = this.manager!.on(event, cb);
+      this.unsubscribers.push(unsub);
+    }
+  }
+
+  private unbindEvents(): void {
+    for (const unsub of this.unsubscribers) {
+      unsub();
+    }
+    this.unsubscribers = [];
+  }
+
+  // ── 绘图创建状态机 ──
+
+  /**
+   * 处理图表点击 — 绘图创建核心逻辑
+   */
+  private handleChartClick(param: MouseEventParams): void {
+    if (!this.manager || !this.chart || !this.series) return;
+    if (!param.point || param.time === undefined) return;
+
+    const activeTool = this.manager.getActiveTool();
+    if (!activeTool) {
+      // 无活跃工具 → 让 DrawingManager 处理选择逻辑
+      return;
+    }
+
+    // ★ V5 需求1：检测点击是否在副图区域，如果是则同步切换 pane 并继续画线
+    const clickedPaneIndex = this.detectPaneIndex(param.point.y);
+    if (clickedPaneIndex !== this.currentPaneIndex) {
+      // 先尝试内部映射同步切换
+      const paneSeries = this.paneSeriesInternalMap.get(clickedPaneIndex);
+      if (paneSeries) {
+        // 同步切换 pane
+        this.switchPane(clickedPaneIndex, paneSeries);
+        // 通知外部更新 store 状态
+        this.onPaneSwitchNeededCb?.(clickedPaneIndex);
+        // ★ 不 return，继续处理这次点击作为绘图的第一个锈点
+      } else {
+        // 内部映射没有，通过回调异步切换（fallback）
+        this.onPaneSwitchNeededCb?.(clickedPaneIndex);
+        return; // 外部切换后用户需再次点击
+      }
+    }
+
+    // ★ D10: brush/path 使用自由绘制模式，跳过 click 状态机
+    // Bug2修复：pattern-* 工具虽然映射为 path，但使用预设锚点数
+    if (this.freeDrawActive || activeTool === 'brush' ||
+        (activeTool === 'path' && !this.activeToolType?.startsWith('pattern-'))) {
+      return;
+    }
+
+    // Bug2修复：pattern-* 工具使用预设锚点数，不走自由绘制模式
+    if (this.activeToolType?.startsWith('pattern-')) {
+      const time = param.time as Time;
+      const price = this.series.coordinateToPrice(param.point.y);
+      if (price === null) return;
+
+      // ★ Bug2修复：限制点击创建锚点价格范围
+      const anchor: Anchor = { time, price: this.clampPriceToData(price) };
+      const toolConfig = getToolConfig(this.activeToolType);
+      const anchorCount = toolConfig?.anchorCount ?? 2;
+
+      if (this.creationState.phase === 'idle') {
+        this.startCreation(activeTool, anchor, anchorCount);
+      } else {
+        this.addAnchor(anchor);
+      }
+      return;
+    }
+
+    // 获取点击位置的 time 和 price
+    const time = param.time as Time;
+    const price = this.series.coordinateToPrice(param.point.y);
+    if (price === null) return;
+
+    // ★ Bug2修复：限制点击创建锚点价格范围
+    const anchor: Anchor = { time, price: this.clampPriceToData(price) };
+    const ourType = mapLibTypeToOurs(activeTool);
+    const toolConfig = ourType ? getToolConfig(ourType) : undefined;
+    const anchorCount = toolConfig?.anchorCount ?? 2;
+
+    if (this.creationState.phase === 'idle') {
+      // 开始新的绘图创建
+      this.startCreation(activeTool, anchor, anchorCount);
+    } else {
+      // 继续添加锚点
+      this.addAnchor(anchor);
+    }
+  }
+
+  /**
+   * 开始创建绘图
+   */
+  private startCreation(libTool: string, firstAnchor: Anchor, anchorCount: number): void {
+    const registry = getToolRegistry();
+    const id = `${Date.now()}-${Math.random().toString(36).slice(2, 9)}`;
+
+    const drawing = registry.createDrawing(
+      libTool, id, [firstAnchor], this.defaultDrawingStyle, {},
+    );
+    if (!drawing) return;
+
+    // 添加到 DrawingManager
+    this.manager!.addDrawing(drawing);
+
+    if (anchorCount === 1) {
+      // 单锚点工具 → 立即完成
+      this.completeCreation();
+      return;
+    }
+
+    // 进入创建状态
+    this.creationState = {
+      phase: 'creating',
+      pendingDrawing: drawing,
+      anchors: [firstAnchor],
+      requiredCount: anchorCount,
+      activeLibTool: libTool,
+    };
+  }
+
+  /**
+   * 添加锚点
+   */
+  private addAnchor(anchor: Anchor): void {
+    const { pendingDrawing, anchors, requiredCount } = this.creationState;
+    if (!pendingDrawing) return;
+
+    anchors.push(anchor);
+
+    if (requiredCount === -1) {
+      // 动态锚点（path/brush）：每次点击追加一个点，双击结束
+      pendingDrawing.setAnchors([...anchors]);
+      return;
+    }
+
+    if (anchors.length >= requiredCount) {
+      // 预设锚点数已满 → 完成
+      pendingDrawing.setAnchors([...anchors]);
+      this.completeCreation();
+    } else {
+      // 预览：设置已收集的锚点
+      pendingDrawing.setAnchors([...anchors]);
+    }
+  }
+
+  /**
+   * 完成创建 — 重置状态，自动切回光标
+   */
+  private completeCreation(): void {
+    this.creationState = {
+      phase: 'idle',
+      pendingDrawing: null,
+      anchors: [],
+      requiredCount: 0,
+      activeLibTool: null,
+    };
+    // 自动切回光标
+    this.manager?.setActiveTool(null);
+  }
+
+  /**
+   * 取消创建 — 移除创建中的绘图，重置状态
+   */
+  private cancelCreation(): void {
+    if (this.creationState.pendingDrawing && this.manager) {
+      this.manager.removeDrawing(this.creationState.pendingDrawing.id);
+    }
+    this.creationState = {
+      phase: 'idle',
+      pendingDrawing: null,
+      anchors: [],
+      requiredCount: 0,
+      activeLibTool: null,
+    };
+    this.manager?.setActiveTool(null);
+  }
+
+  /**
+   * 处理双击 — 动态锚点工具结束创建
+   */
+  private handleChartDblClick(param: MouseEventParams): void {
+    // 处理动态锯点的创建结束
+    if (this.creationState.phase === 'creating') {
+      if (this.creationState.requiredCount !== -1) return;  // 非动态工具忽略
+
+      // 双击前会触发两次 click，弹出最后一次重复的 anchor
+      if (this.creationState.anchors.length > 0) {
+        this.creationState.anchors.pop();
+        // 同步更新绘图
+        if (this.creationState.pendingDrawing) {
+          this.creationState.pendingDrawing.setAnchors([...this.creationState.anchors]);
+        }
+      }
+
+      if (this.creationState.anchors.length >= 2) {
+        this.completeCreation();
+      } else {
+        this.cancelCreation();
+      }
+      return;
+    }
+
+    // Bug4修复：非创建模式下，双击已完成绘图显示文字输入框
+    if (!param.point || param.time === undefined) return;
+    if (!this.manager || !this.container) return;
+
+    const pixel = { x: param.point.x, y: param.point.y };
+
+    // hitTest 找到双击的绘图
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    const hitDrawing = (this.manager as any).hitTest?.(pixel) as IDrawing | null;
+
+    // ★ Fib Bug修复：斐波那契等线类绘图的 testHit 命中范围极小（5px），
+    // 双击时极易 miss。当 hitTest 返回 null 时做一次扩大范围的 fallback 检测。
+    const fallbackHit = hitDrawing ?? this.hitTestFallback(pixel, 15);
+
+    if (fallbackHit) {
+      // Bug2修复：双击绘图 → 触发属性面板回调
+      this.onDrawingDoubleClickCb?.(fallbackHit);
+
+      // 同时保留原有的文字编辑功能
+      const supportedTypes = [
+        'trend-line', 'horizontal-line', 'vertical-line', 'ray',
+        'parallel-channel', 'rectangle', 'circle',
+      ];
+      if (supportedTypes.includes(fallbackHit.type)) {
+        this.showTextInputEditor(fallbackHit, pixel);
+      }
+    } else {
+      // Bug2修复：双击空白 → 关闭面板
+      this.onDrawingDoubleClickCb?.(null);
+    }
+  }
+
+  /**
+   * 处理鼠标移动 — 实时预览创建中的绘图
+   */
+  private handleContainerMouseMove(e: MouseEvent): void {
+    if (this.creationState.phase !== 'creating') return;
+    if (!this.creationState.pendingDrawing || !this.chart || !this.series || !this.container) return;
+
+    const rect = this.container.getBoundingClientRect();
+    const x = e.clientX - rect.left;
+    const y = e.clientY - rect.top;
+
+    const time = this.chart.timeScale().coordinateToTime(x);
+    const price = this.series.coordinateToPrice(y);
+    if (time === null || price === null) return;
+
+    // ★ Bug2修复：限制预览锈点价格范围，防止纵坐标无限延伸
+    const clampedPrice = this.clampPriceToData(price);
+
+    // 将当前鼠标位置作为临时锈点，附加到已收集锈点后
+    const previewAnchor: Anchor = { time: time as Time, price: clampedPrice };
+    const allAnchors = [...this.creationState.anchors, previewAnchor];
+    this.creationState.pendingDrawing.setAnchors(allAnchors);
+  }
+
+  /**
+   * 处理键盘 — Esc 取消创建
+   */
+  private handleKeydown(e: KeyboardEvent): void {
+    if (e.key === 'Escape' && this.creationState.phase === 'creating') {
+      this.cancelCreation();
+    }
+  }
+
+  // ══════════════════════════════════════════════
+  // 整体拖拽：选中绘图后拖拽本体移动整个图形
+  // ══════════════════════════════════════════════
+
+  /**
+   * 整体拖拽：启动检测（capture 阶段，先于库的 mousedown）
+   */
+  private handleBodyDragStart(e: MouseEvent): void {
+    if (!this.manager || !this.chart || !this.series || !this.container) return;
+
+    // 只处理左键
+    if (e.button !== 0) return;
+
+    // 创建模式中不拦截
+    if (this.creationState.phase === 'creating') return;
+
+    const rect = this.container.getBoundingClientRect();
+    const pixel = { x: e.clientX - rect.left, y: e.clientY - rect.top };
+
+    // 获取当前选中的绘图
+    let selected = this.manager.getSelectedDrawing();
+
+    // ★ Fix①：无选中绘图时，尝试 hitTest 预选中（点住即拖）
+    if (!selected) {
+      const hitDrawing = this.manager.hitTest(pixel);
+      if (hitDrawing && !hitDrawing.options.locked) {
+        this.manager.selectDrawing(hitDrawing.id);
+        selected = hitDrawing;
+      }
+    }
+
+    if (!selected || selected.options.locked) return;
+
+    // 构造 viewport
+    const viewport = this.getViewport();
+    if (!viewport) return;
+
+    // Step 1: 命中锚点 → 不拦截（让库处理锚点拖拽）
+    const anchorHit = selected.hitTestAnchor(pixel, viewport);
+    if (anchorHit !== null) return;
+
+    // Step 2: 命中绘图本体 → 拦截！
+    const bodyHit = selected.testHit(pixel, viewport);
+    if (!bodyHit) return;
+
+    // ★ 启动整体拖拽
+    e.preventDefault();
+    e.stopPropagation();
+
+    this.bodyDragState = {
+      phase: 'dragging',
+      drawingId: selected.id,
+      startPixel: pixel,
+      startAnchors: selected.anchors.map(a => ({ ...a })),
+    };
+
+    selected.setState('editing');
+
+    // 注册 document 级 move/up（拖拽过程中鼠标可能移出 container）
+    this.bodyDragMoveHandler = (ev: MouseEvent) => this.handleBodyDragMove(ev);
+    this.bodyDragEndHandler = (ev: MouseEvent) => this.handleBodyDragEnd(ev);
+    document.addEventListener('mousemove', this.bodyDragMoveHandler);
+    document.addEventListener('mouseup', this.bodyDragEndHandler);
+  }
+
+  /**
+   * 整体拖拽：移动入口（rAF节流）
+   */
+  private handleBodyDragMove(e: MouseEvent): void {
+    if (this.bodyDragState.phase !== 'dragging') return;
+
+    this.pendingDragEvent = e;
+
+    // ★ Fix④：rAF节流，每帧最多执行一次 setAnchors
+    if (this.rafId === null) {
+      this.rafId = requestAnimationFrame(() => {
+        this.rafId = null;
+        if (this.pendingDragEvent) {
+          this.processBodyDragMove(this.pendingDragEvent);
+          this.pendingDragEvent = null;
+        }
+      });
+    }
+  }
+
+  /**
+   * 整体拖拽：实际移动逻辑（逐锚点像素转换方案）
+   */
+  private processBodyDragMove(e: MouseEvent): void {
+    if (this.bodyDragState.phase !== 'dragging' || !this.bodyDragState.drawingId) return;
+    if (!this.manager || !this.chart || !this.series || !this.container) return;
+
+    const drawing = this.manager.getDrawing(this.bodyDragState.drawingId);
+    if (!drawing) return;
+
+    const rect = this.container.getBoundingClientRect();
+    const currentX = e.clientX - rect.left;
+    const currentY = e.clientY - rect.top;
+
+    // 像素偏移量
+    const dx = currentX - this.bodyDragState.startPixel!.x;
+    const dy = currentY - this.bodyDragState.startPixel!.y;
+
+    const timeScale = this.chart.timeScale();
+
+    // 逐锚点转换：每个锚点的原始像素位置 + delta → 新的 time/price
+    const newAnchors = this.bodyDragState.startAnchors!.map(a => {
+      // 原锚点在起始时的像素位置
+      const origPixelX = timeScale.timeToCoordinate(a.time as Time);
+      const origPixelY = this.series!.priceToCoordinate(a.price);
+      if (origPixelX === null || origPixelY === null) return a;
+
+      // 加上 delta
+      const newPixelX = (origPixelX as number) + dx;
+      const newPixelY = (origPixelY as number) + dy;
+
+      // 转回 time/price
+      const newTime = timeScale.coordinateToTime(newPixelX as Coordinate);
+      const newPrice = this.series!.coordinateToPrice(newPixelY as Coordinate);
+      if (newTime === null || newPrice === null) return a;
+
+      // ★ Bug2修复：限制拖拽锈点价格范围
+      return { time: newTime as Time, price: this.clampPriceToData(newPrice) };
+    });
+
+    drawing.setAnchors(newAnchors);
+    this.onDrawingModifiedCb?.(drawing);
+  }
+
+  /**
+   * 整体拖拽：结束
+   */
+  private handleBodyDragEnd(_e: MouseEvent): void {
+    if (this.bodyDragState.phase !== 'dragging') return;
+
+    const drawing = this.bodyDragState.drawingId
+      ? this.manager?.getDrawing(this.bodyDragState.drawingId)
+      : null;
+
+    if (drawing) {
+      drawing.setState('selected');
+      this.onDrawingModifiedCb?.(drawing);
+    }
+
+    // 注销 document 级事件
+    if (this.bodyDragMoveHandler) {
+      document.removeEventListener('mousemove', this.bodyDragMoveHandler);
+    }
+    if (this.bodyDragEndHandler) {
+      document.removeEventListener('mouseup', this.bodyDragEndHandler);
+    }
+
+    // ★ Fix③：如果有 pending 的 rAF，立即执行最终帧确保位置不丢
+    if (this.rafId !== null) {
+      cancelAnimationFrame(this.rafId);
+      this.rafId = null;
+      if (this.pendingDragEvent) {
+        this.processBodyDragMove(this.pendingDragEvent);
+        this.pendingDragEvent = null;
+      }
+    }
+
+    this.bodyDragState = {
+      phase: 'idle',
+      drawingId: null,
+      startPixel: null,
+      startAnchors: null,
+    };
+  }
+
+  // ═════════════════════════════════════════════
+  // ★ D10: 画笔自由绘制模式
+  // ═════════════════════════════════════════════
+
+  /**
+   * 画笔自由绘制：mousedown 拦截
+   */
+  private handleFreeDrawStart(e: MouseEvent): void {
+    if (!this.manager || !this.chart || !this.series || !this.container) return;
+    if (e.button !== 0) return;
+
+    const activeTool = this.manager.getActiveTool();
+    if (activeTool !== 'brush' && activeTool !== 'path') return;
+    // Bug2修复：pattern-* 工具不走自由绘制
+    if (this.activeToolType?.startsWith('pattern-')) return;
+    if (this.creationState.phase === 'creating') return; // 已在创建中
+
+    const rect = this.container.getBoundingClientRect();
+    const x = e.clientX - rect.left;
+    const y = e.clientY - rect.top;
+    const time = this.chart.timeScale().coordinateToTime(x as Coordinate);
+    const price = this.series.coordinateToPrice(y as Coordinate);
+    if (time === null || price === null) return;
+
+    // 拦截！阻止 chart click 和 body drag
+    e.preventDefault();
+    e.stopPropagation();
+
+    this.freeDrawActive = true;
+
+    // 启动创建
+    const anchor: Anchor = { time: time as Time, price };
+    const ourType = mapLibTypeToOurs(activeTool);
+    const toolConfig = ourType ? getToolConfig(ourType) : undefined;
+    const anchorCount = toolConfig?.anchorCount ?? -1; // 动态锚点
+    this.startCreation(activeTool, anchor, anchorCount);
+
+    // 注册 document 级事件
+    this.freeDrawMoveHandler = (ev) => this.handleFreeDrawMove(ev);
+    this.freeDrawEndHandler = (ev) => this.handleFreeDrawEnd(ev);
+    document.addEventListener('mousemove', this.freeDrawMoveHandler);
+    document.addEventListener('mouseup', this.freeDrawEndHandler);
+  }
+
+  /**
+   * 画笔自由绘制：mousemove（rAF节流）
+   */
+  private handleFreeDrawMove(e: MouseEvent): void {
+    if (!this.freeDrawActive) return;
+    this.freeDrawPendingEvent = e;
+
+    if (this.freeDrawRafId === null) {
+      this.freeDrawRafId = requestAnimationFrame(() => {
+        this.freeDrawRafId = null;
+        if (this.freeDrawPendingEvent && this.creationState.pendingDrawing) {
+          const ev = this.freeDrawPendingEvent;
+          this.freeDrawPendingEvent = null;
+
+          const rect = this.container!.getBoundingClientRect();
+          const x = ev.clientX - rect.left;
+          const y = ev.clientY - rect.top;
+          const time = this.chart!.timeScale().coordinateToTime(x as Coordinate);
+          const price = this.series!.coordinateToPrice(y as Coordinate);
+          if (time !== null && price !== null) {
+            // ★ Bug2修复：限制画笔自由绘制价格范围
+            this.addAnchor({ time: time as Time, price: this.clampPriceToData(price) });
+          }
+        }
+      });
+    }
+  }
+
+  /**
+   * 画笔自由绘制：mouseup
+   */
+  private handleFreeDrawEnd(_e: MouseEvent): void {
+    if (!this.freeDrawActive) return;
+    this.freeDrawActive = false;
+
+    // 执行最终帧
+    if (this.freeDrawRafId !== null) {
+      cancelAnimationFrame(this.freeDrawRafId);
+      this.freeDrawRafId = null;
+      if (this.freeDrawPendingEvent) {
+        const ev = this.freeDrawPendingEvent;
+        this.freeDrawPendingEvent = null;
+        if (this.creationState.pendingDrawing && this.container && this.chart && this.series) {
+          const rect = this.container.getBoundingClientRect();
+          const x = ev.clientX - rect.left;
+          const y = ev.clientY - rect.top;
+          const time = this.chart.timeScale().coordinateToTime(x as Coordinate);
+          const price = this.series.coordinateToPrice(y as Coordinate);
+          if (time !== null && price !== null) {
+            // ★ Bug2修复：限制画笔自由绘制价格范围
+            this.addAnchor({ time: time as Time, price: this.clampPriceToData(price) });
+          }
+        }
+      }
+    }
+
+    // 至少 2 个锚点才完成
+    if (this.creationState.anchors.length >= 2) {
+      this.completeCreation();
+    } else {
+      this.cancelCreation();
+    }
+
+    // 清理 document 事件
+    if (this.freeDrawMoveHandler) {
+      document.removeEventListener('mousemove', this.freeDrawMoveHandler);
+    }
+    if (this.freeDrawEndHandler) {
+      document.removeEventListener('mouseup', this.freeDrawEndHandler);
+    }
+    this.freeDrawMoveHandler = null;
+    this.freeDrawEndHandler = null;
+  }
+
+  // ═══════════════════════════════════════════
+  // Bug4修复：文字标签编辑
+  // ═══════════════════════════════════════════
+
+  /**
+   * 显示文字输入编辑器
+   */
+  private showTextInputEditor(
+    drawing: IDrawing,
+    pixel: { x: number; y: number },
+  ): void {
+    this.hideTextInputEditor();
+    if (!this.container) return;
+
+    const input = document.createElement('input');
+    input.type = 'text';
+    input.className = 'qlchart-drawing-text-editor';
+
+    // 获取已有文字
+    const existingText = this.textLabelOverlay?.getLabel(drawing.id) ?? '';
+    input.value = existingText;
+    input.placeholder = '输入文字标注...';
+
+    input.style.cssText = `
+      position: absolute;
+      left: ${pixel.x + 8}px;
+      top: ${pixel.y - 12}px;
+      z-index: 1001;
+      padding: 4px 8px;
+      border: 1px solid #2962ff;
+      border-radius: 3px;
+      font-size: 12px;
+      background: rgba(255, 255, 255, 0.95);
+      color: #333;
+      outline: none;
+      min-width: 100px;
+    `;
+
+    const commit = () => {
+      const text = input.value.trim();
+      if (text) {
+        this.textLabelOverlay?.setLabel(drawing.id, text, pixel.x, pixel.y);
+      } else {
+        this.textLabelOverlay?.removeLabel(drawing.id);
+      }
+      this.hideTextInputEditor();
+      this.onDrawingModifiedCb?.(drawing);
+    };
+
+    input.addEventListener('blur', commit);
+    input.addEventListener('keydown', (e) => {
+      if (e.key === 'Enter') { e.preventDefault(); input.blur(); }
+      if (e.key === 'Escape') { this.hideTextInputEditor(); }
+    });
+
+    this.container.appendChild(input);
+    requestAnimationFrame(() => { input.focus(); input.select(); });
+    this.textInputEditor = input;
+  }
+
+  /**
+   * 隐藏文字输入编辑器
+   */
+  private hideTextInputEditor(): void {
+    if (this.textInputEditor) {
+      this.textInputEditor.remove();
+      this.textInputEditor = null;
+    }
+  }
+
+  /**
+   * Bug4修复：更新所有文字标签位置（图表滚动/缩放后调用）
+   */
+  private updateTextLabels(): void {
+    if (!this.textLabelOverlay || !this.manager || !this.chart || !this.series) return;
+
+    this.textLabelOverlay.updatePositions((id) => {
+      const drawing = this.manager?.getAllDrawings().find(d => d.id === id);
+      if (!drawing) return null;
+
+      const anchors = drawing.anchors ?? [];
+      if (anchors.length === 0) return null;
+
+      // 使用第一个猫点作为定位参考
+      const anchor = anchors[0];
+      const x = this.chart!.timeScale().timeToCoordinate(anchor.time as Time);
+      const y = this.series!.priceToCoordinate(anchor.price);
+      if (x === null || y === null) return null;
+
+      return { x: x as number, y: y as number };
+    });
+  }
+
+  /**
+   * 辅助：构造 Viewport
+   */
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  private getViewport(): { width: number; height: number; timeScale: any; priceScale: any } | null {
+    if (!this.chart || !this.series || !this.container) return null;
+    // ★ Fix②(v2)：对齐 DrawingManager.getViewport() 的 wrapper 格式
+    // library 的 anchorToPixel 需要 viewport.priceScale.priceToCoordinate()
+    const ts = this.chart.timeScale();
+    const series = this.series;
+    return {
+      width: ts.width(),
+      height: this.container.clientHeight,
+      timeScale: {
+        coordinateToTime: (e: any) => ts.coordinateToTime(e),
+        timeToCoordinate: (e: any) => ts.timeToCoordinate(e),
+        logicalToCoordinate: (e: any) => ts.logicalToCoordinate(e),
+      },
+      priceScale: {
+        coordinateToPrice: (e: any) => series.coordinateToPrice(e),
+        priceToCoordinate: (e: any) => series.priceToCoordinate(e),
+      },
+    };
+  }
+
+  // ═════════════════════════════════════════════
+  // ★ Bug2修复：价格范围限制（Clamp）
+  // 防止绘图预览/拖拽锈点导致纵坐标无限延伸
+  // ═════════════════════════════════════════════
+
+  /**
+   * Bug2修复：获取K线价格范围（带缓存）
+   */
+  private getPriceRange(): { minLow: number; maxHigh: number } {
+    if (this.priceRangeCache) return this.priceRangeCache;
+
+    let minLow = Infinity;
+    let maxHigh = -Infinity;
+    for (const candle of this.candleData) {
+      if (candle.low < minLow) minLow = candle.low;
+      if (candle.high > maxHigh) maxHigh = candle.high;
+    }
+
+    this.priceRangeCache = { minLow, maxHigh };
+    return this.priceRangeCache;
+  }
+
+  /**
+   * Bug2修复：限制价格在K线数据的合理范围内
+   * 允许 20% 的超出余量，避免完全锁死影响用户体验
+   */
+  private clampPriceToData(price: number): number {
+    if (this.candleData.length === 0) return price;
+
+    const { minLow, maxHigh } = this.getPriceRange();
+    const range = maxHigh - minLow;
+    if (range === 0) return price;
+    const margin = range * 0.2;
+
+    return Math.max(minLow - margin, Math.min(maxHigh + margin, price));
+  }
+
+  // ═════════════════════════════════════════════
+  // ★ Fib Bug修复：扩大范围的 fallback 命中检测
+  // 斐波那契等线类绘图的 testHit 命中范围极小（5px），
+  // 双击时用更大的阈值做一次 fallback
+  // ═════════════════════════════════════════════
+
+  /**
+   * Fib Bug修复：扩大命中范围的 fallback hitTest
+   * @param pixel 鼠标像素坐标
+   * @param threshold 扩大的命中阈值（像素）
+   * @return 最近的命中绘图，或 null
+   */
+  private hitTestFallback(pixel: { x: number; y: number }, threshold: number): IDrawing | null {
+    if (!this.manager) return null;
+
+    const viewport = this.getViewport();
+    if (!viewport) return null;
+
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    const allDrawings = (this.manager as any).getAllDrawings() as IDrawing[];
+    if (!allDrawings || allDrawings.length === 0) return null;
+
+    // 扩大范围重试：用更大的 threshold 判断是否命中线条
+    let bestHit: IDrawing | null = null;
+    let bestDist = threshold;
+
+    for (const drawing of allDrawings) {
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      if (!(drawing as any).options?.visible) continue;
+
+      // 先尝试原生 testHit（可能命中）
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      if (typeof (drawing as any).testHit === 'function') {
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        if ((drawing as any).testHit(pixel, viewport)) return drawing;
+      }
+
+      // 检查锈点附近（锈点是用户可拖拽的点，应该也是双击的有效区域）
+      const anchors = drawing.anchors ?? [];
+      for (const anchor of anchors) {
+        const ax = viewport.timeScale.timeToCoordinate(anchor.time as Time);
+        const ay = viewport.priceScale.priceToCoordinate(anchor.price);
+        if (ax === null || ay === null) continue;
+
+        const dist = Math.sqrt(
+          (pixel.x - (ax as number)) ** 2 + (pixel.y - (ay as number)) ** 2,
+        );
+        if (dist <= bestDist) {
+          bestDist = dist;
+          bestHit = drawing;
+        }
+      }
+    }
+
+    return bestHit;
+  }
+}