Selaa lähdekoodia

Fix elevation tooltip position: appear above cursor, not over profile

Previously the tooltip was vertically centred on the cursor Y, which
placed it directly over the elevation profile line most of the time.

New logic: prefer above the cursor (cy - height - 8px gap); fall back
to below (cy + 8px) only when there is not enough space above. Keeps
existing left-clamping so it never overflows the canvas edge.

No backend restart required.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
k4be 8 tuntia sitten
vanhempi
commit
71c91a8289
1 muutettua tiedostoa jossa 14 lisäystä ja 2 poistoa
  1. 14 2
      gpx-vis-frontend/js/elevation.js

+ 14 - 2
gpx-vis-frontend/js/elevation.js

@@ -280,8 +280,20 @@ const Elevation = (() => {
     tooltip.innerHTML = formatTooltip(point, trackMeta);
     tooltip.classList.add('visible');
     const cRect = canvas.getBoundingClientRect();
-    tooltip.style.left = Math.min(cx + 10, cRect.width  - tooltip.offsetWidth  - 4) + 'px';
-    tooltip.style.top  = Math.max(4,        cy - tooltip.offsetHeight / 2)           + 'px';
+    const tw = tooltip.offsetWidth;
+    const th = tooltip.offsetHeight;
+    const gap = 8;
+
+    // Prefer above cursor; fall back to below if not enough room
+    const topAbove = cy - th - gap;
+    const top = topAbove >= 0 ? topAbove : cy + gap;
+
+    // Prefer right of indicator; clamp to canvas bounds
+    const leftRight = cx + gap;
+    const left = Math.min(leftRight, cRect.width - tw - 4);
+
+    tooltip.style.left = Math.max(0, left) + 'px';
+    tooltip.style.top  = top + 'px';
   }
 
   function hideTooltip() {