From b8ffc20360dce5dc42b650713d3ef2cd8fd1ea15 Mon Sep 17 00:00:00 2001 From: ztimson Date: Wed, 24 Jun 2026 23:44:05 -0400 Subject: [PATCH] Fixed up sensor cards --- client/src/components/Seismic.vue | 33 +++++++++++++++++++++---------- 1 file changed, 23 insertions(+), 10 deletions(-) diff --git a/client/src/components/Seismic.vue b/client/src/components/Seismic.vue index 1a1d91e..3414968 100644 --- a/client/src/components/Seismic.vue +++ b/client/src/components/Seismic.vue @@ -9,16 +9,29 @@ const W = 320, H = 60, MAX_PTS = 120; let interval: ReturnType; function toPath(pts: number[]) { - if(!pts.length) return ''; + if (!pts.length) return ''; const mid = H / 2, amp = H / 2 - 4; - const max = Math.max(...pts) || 1; - return pts.map((v, i) => { - const x = (i / (MAX_PTS - 1)) * W; - const normalized = v / max; - const flipped = i % 2 === 0 ? normalized : -normalized; - const y = mid - flipped * amp; - return `${i === 0 ? 'M' : 'L'} ${x.toFixed(1)} ${y.toFixed(1)}`; - }).join(' '); + const max = Math.max(Math.max(...pts), 1.0); // 1.0 = min scale floor + + // Fixed px per point — path grows left→right, never stretches + const segW = W / (MAX_PTS - 1); + + const subPts: { x: number; y: number }[] = []; + + pts.forEach((v, i) => { + const norm = (v / max) * amp; + const baseX = i * segW; + const s = segW / 4; + + subPts.push({ x: baseX, y: mid - norm * 0.5 }); + subPts.push({ x: baseX + s, y: mid - norm }); + subPts.push({ x: baseX + s * 2, y: mid + norm }); + subPts.push({ x: baseX + s * 3, y: mid }); + }); + + return subPts.map((p, i) => + `${i === 0 ? 'M' : 'L'} ${p.x.toFixed(1)} ${p.y.toFixed(1)}` + ).join(' '); } async function poll() { @@ -39,7 +52,7 @@ svg { width: 100%; height: 60px; overflow: visible; }
🫨 Seismic
- +