From d5704254026f2405470a1c8ff7ede4c2ea66ac56 Mon Sep 17 00:00:00 2001 From: Julien Calixte Date: Sat, 20 Jun 2026 15:01:21 +0200 Subject: [PATCH] fix(editor): align the playhead with the chart's left gutter valToPos returns CSS pixels relative to the plot area, but the overlay sits on the canvas, so the playhead was short by the y-axis width and started before x=0. --- src/components/SimChart.vue | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/components/SimChart.vue b/src/components/SimChart.vue index b338f67..5f9f67d 100644 --- a/src/components/SimChart.vue +++ b/src/components/SimChart.vue @@ -57,7 +57,9 @@ function syncMarker(): void { } // bbox is in device pixels; the overlay is laid out in CSS pixels. const ratio = window.devicePixelRatio || 1 - markerX.value = plot.valToPos(props.marker, "x") + // valToPos (CSS px) is relative to the plot area's left edge, but the overlay + // is positioned against the canvas, so add the left gutter (the y-axis width). + markerX.value = plot.bbox.left / ratio + plot.valToPos(props.marker, "x") markerTop.value = plot.bbox.top / ratio markerHeight.value = plot.bbox.height / ratio }