From 2a9dff856d938a2655d1ac69e354cd87244ca794 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=A5=94=E8=B7=91=E7=9A=84=E9=9D=A2=E6=9D=A1?=
 <1262327911@qq.com>
Date: Mon, 15 Jun 2026 11:22:20 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E4=BC=98=E5=8C=96=E5=AF=B9=E9=BD=90?=
 =?UTF-8?q?=E7=BA=BF=E7=AE=97=E6=B3=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../chart/ContentEdit/hooks/useDrag.hook.ts   | 20 +++++++++++++------
 1 file changed, 14 insertions(+), 6 deletions(-)

diff --git a/src/views/chart/ContentEdit/hooks/useDrag.hook.ts b/src/views/chart/ContentEdit/hooks/useDrag.hook.ts
index be7a6365..26e3bb70 100644
--- a/src/views/chart/ContentEdit/hooks/useDrag.hook.ts
+++ b/src/views/chart/ContentEdit/hooks/useDrag.hook.ts
@@ -308,15 +308,23 @@ const _runAlignSnap = (
 
   if (bestX) {
     const { y: ry, h: rh } = bestX.ref.attr
-    const spanStart = Math.min(finalY, ry)
-    const spanEnd = Math.max(finalY + sh, ry + rh)
-    _drawAlignLine(container, false, bestX.coord, spanStart, spanEnd, `${Math.round(bestX.delta)}px`, color)
+    // 两组件在 Y 方向上最近的两条边（间隙区域）
+    const highBottom = Math.min(finalY + sh, ry + rh)
+    const lowTop = Math.max(finalY, ry)
+    const spanStart = Math.min(highBottom, lowTop)
+    const spanEnd = Math.max(highBottom, lowTop)
+    const gapDist = Math.max(0, lowTop - highBottom)
+    _drawAlignLine(container, false, bestX.coord, spanStart, spanEnd, `${Math.round(gapDist)}px`, color)
   }
   if (bestY) {
     const { x: rx, w: rw } = bestY.ref.attr
-    const spanStart = Math.min(finalX, rx)
-    const spanEnd = Math.max(finalX + sw, rx + rw)
-    _drawAlignLine(container, true, bestY.coord, spanStart, spanEnd, `${Math.round(bestY.delta)}px`, color)
+    // 两组件在 X 方向上最近的两条边（间隙区域）
+    const leftRight = Math.min(finalX + sw, rx + rw)
+    const rightLeft = Math.max(finalX, rx)
+    const spanStart = Math.min(leftRight, rightLeft)
+    const spanEnd = Math.max(leftRight, rightLeft)
+    const gapDist = Math.max(0, rightLeft - leftRight)
+    _drawAlignLine(container, true, bestY.coord, spanStart, spanEnd, `${Math.round(gapDist)}px`, color)
   }
 
   return { x: finalX, y: finalY }