From 62ed43cc5f3e2581951fbb1a1e1a692fb588a45e Mon Sep 17 00:00:00 2001
From: dekun <dekun@local>
Date: Wed, 27 May 2026 15:02:34 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 public/js/app.js | 23 +++++++++++++++++++++++
 1 file changed, 23 insertions(+)

diff --git a/public/js/app.js b/public/js/app.js
index f2ac6ee..36ba370 100644
--- a/public/js/app.js
+++ b/public/js/app.js
@@ -219,6 +219,20 @@
     targetCtx.restore();
   }
 
+  function drawDragGuideLine(targetCtx, y, color) {
+    const w = targetCtx.canvas.width;
+    targetCtx.save();
+    targetCtx.strokeStyle = color;
+    targetCtx.lineWidth = 1.5;
+    targetCtx.setLineDash([10, 6]);
+    targetCtx.globalAlpha = 0.9;
+    targetCtx.beginPath();
+    targetCtx.moveTo(0, y);
+    targetCtx.lineTo(w, y);
+    targetCtx.stroke();
+    targetCtx.restore();
+  }
+
   function redraw() {
     if (!imageLoaded) return;
     ctx.clearRect(0, 0, canvas.width, canvas.height);
@@ -233,6 +247,11 @@
         i === selectedIndex
       );
     });
+    if (isDraggingMarker && dragIndex >= 0) {
+      const dragging = markers[dragIndex];
+      const p = ratioToXY(dragging);
+      drawDragGuideLine(ctx, p.y, dragging.color);
+    }
   }
 
   function updateZoomLabel() {
@@ -659,10 +678,14 @@
   }
 
   function endPointer() {
+    const wasDraggingMarker = isDraggingMarker;
     endPan();
     isDraggingMarker = false;
     dragIndex = -1;
     canvas.classList.remove("can-drag", "can-pan");
+    if (wasDraggingMarker && imageLoaded) {
+      redraw();
+    }
   }
 
   canvas.addEventListener("mouseup", function () {