feat:优化虚拟光标定位

src/editor/core/cursor/Cursor.ts

@@ -47,18 +47,17 @@ export class Cursor {
     const cursorPosition = this.draw.getPosition().getCursorPosition()
     if (!cursorPosition) return
     // 设置光标代理
-    const { lineHeight, metrics, coordinate: { rightTop } } = cursorPosition
+    const { metrics, coordinate: { leftTop, rightTop }, ascent } = cursorPosition
     const height = metrics.fontBoundingBoxAscent + metrics.fontBoundingBoxDescent
     const agentCursorDom = this.cursorAgent.getAgentCursorDom()
     agentCursorDom.focus()
     agentCursorDom.setSelectionRange(0, 0)
-    const lineBottom = rightTop[1] + lineHeight
     const curosrleft = `${rightTop[0]}px`
     agentCursorDom.style.left = curosrleft
-    agentCursorDom.style.top = `${lineBottom - 12}px`
+    agentCursorDom.style.top = `${leftTop[1] + ascent - 12}px`
     // 模拟光标显示
     this.cursorDom.style.left = curosrleft
-    this.cursorDom.style.top = `${lineBottom - height}px`
+    this.cursorDom.style.top = `${leftTop[1] + ascent - metrics.fontBoundingBoxAscent}px`
     this.cursorDom.style.display = 'block'
     this.cursorDom.style.height = `${height}px`
     setTimeout(() => {

src/editor/core/draw/Draw.ts

@@ -183,6 +183,7 @@ export class Draw {
           value: element.value,
           rowNo: i,
           metrics,
+          ascent: curRow.ascent,
           lineHeight: curRow.height,
           isLastLetter: j === curRow.elementList.length - 1,
           coordinate: {

src/editor/interface/Element.ts

@@ -21,6 +21,7 @@ export interface IElementPosition {
   index: number;
   value: string,
   rowNo: number;
+  ascent: number;
   lineHeight: number;
   metrics: TextMetrics;
   isLastLetter: boolean,