From fc6b25e0dae304ab7afe50a208cc824a7c253335 Mon Sep 17 00:00:00 2001
From: Antonio De Lucreziis <antonio.delucreziis@gmail.com>
Date: Sun, 2 Aug 2026 16:04:49 +0200
Subject: [PATCH] ui: highlight plot point nearest the mouse in 2d

---
 src/components/plots.tsx | 13 ++++++++-----
 1 file changed, 8 insertions(+), 5 deletions(-)

diff --git a/src/components/plots.tsx b/src/components/plots.tsx
index 8be3fb1..830487c 100644
--- a/src/components/plots.tsx
+++ b/src/components/plots.tsx
@@ -78,12 +78,13 @@ export function LinePlot({
         onMouseMove={(e) => {
           const r = e.currentTarget.getBoundingClientRect()
           const vbx = ((e.clientX - r.left) / r.width) * width
-          const targetT =
-            t0 + ((vbx - pad) / (width - pad * 2)) * tspan
+          const vby = ((e.clientY - r.top) / r.height) * height
           let idx = 0
           let best = Infinity
           for (let i = 0; i < values.length; i++) {
-            const d = Math.abs(times[i]! - targetT)
+            const dx = x(i) - vbx
+            const dy = y(values[i]!) - vby
+            const d = dx * dx + dy * dy
             if (d < best) {
               best = d
               idx = i
@@ -232,12 +233,14 @@ export function AggregatePlot({
         onMouseMove={(e) => {
           const r = e.currentTarget.getBoundingClientRect()
           const vbx = ((e.clientX - r.left) / r.width) * width
-          const targetT = t0 + ((vbx - pad) / (width - pad * 2)) * tspan
+          const vby = ((e.clientY - r.top) / r.height) * height
           let best: { sample: MetricEntry; machine: string } | null = null
           let bd = Infinity
           for (const s of series) {
             for (const e0 of s.samples) {
-              const d = Math.abs(e0.ts - targetT)
+              const dx = xForT(e0.ts) - vbx
+              const dy = y(e0.value) - vby
+              const d = dx * dx + dy * dy
               if (d < bd) {
                 bd = d
                 best = { sample: e0, machine: s.machine }