fix(viz): add stability guards for smoothing and data mapping

- Clamp delta time to minimum of 0 to prevent negative interpolation.
- Add protection against division by zero in SNR color mapping.
- Ensure trajectory points exist before fading alpha calculation.
- Standardize p.deltaTime usage for cross-browser stability.

steps/src/drawUtils.js

@@ -246,6 +246,11 @@ export function drawPointCloud(p, points, plotScales, pointSize = 4) {
       if (snrVals.length > 1) {
         minSnr = Math.min(...snrVals);
         maxSnr = Math.max(...snrVals);
+        // If all SNR values are the same, add a small range to avoid division by zero
+        if (minSnr === maxSnr) {
+          minSnr -= 1;
+          maxSnr += 1;
+        }
       } else if (snrVals.length === 1) {
         minSnr = snrVals[0] - 1;
         maxSnr = snrVals[0] + 1;
@@ -450,6 +455,7 @@ export function drawTrajectories(p, plotScales, scaleFactor = 1) {
         p.drawingContext.setLineDash([]);
 
         // Fading trajectory logic (works for both modes)
+        if (trajPts.length > 0) {
           for (let i = 1; i < trajPts.length; i++) {
             const alpha = p.map(i, 0, trajPts.length, 50, 255);
             trajectoryColor.setAlpha(alpha);
@@ -464,6 +470,7 @@ export function drawTrajectories(p, plotScales, scaleFactor = 1) {
               currPt[1] * plotScales.plotScaleY
             );
           }
+        }
         // --- END: New Dynamic Coloring Logic ---
       }
 

steps/src/p5/radarSketch.js

@@ -211,7 +211,8 @@ export const radarSketch = function (p) {
         } else {
           // --- START: Frame-Rate Independent FPS Smoothing ---
           const baseFactor = 0.05; // Smoothing factor at 60 FPS
-          const adjustedFactor = 1 - Math.pow(1 - baseFactor, delta / (1000 / 60));
+          const dt = Math.max(0, delta);
+          const adjustedFactor = 1 - Math.pow(1 - baseFactor, dt / (1000 / 60));
           appState.fps = p.lerp(appState.fps, currentFps, adjustedFactor);
           // --- END: Frame-Rate Independent FPS Smoothing ---
         }
@@ -382,7 +383,8 @@ export const radarSketch = function (p) {
       // We use p.deltaTime to adjust the smoothing factor so that the animation
       // speed remains consistent across different monitor refresh rates.
       const baseSmoothing = 0.5; // Target smoothing at 60 FPS
-      const adjustedSmoothing = 1 - Math.pow(1 - baseSmoothing, p.deltaTime / (1000 / 60));
+      const dt = Math.max(0, p.deltaTime);
+      const adjustedSmoothing = 1 - Math.pow(1 - baseSmoothing, dt / (1000 / 60));
 
       // Linearly interpolate the smoothed position towards the actual mouse position.
       smoothedMouseX = p.lerp(smoothedMouseX, p.mouseX, adjustedSmoothing);

steps/src/p5/zoomSketch.js

@@ -275,7 +275,8 @@ export const zoomSketch = function (p) {
         // We use p.deltaTime to adjust the smoothing factor so that the animation
         // speed remains consistent across different monitor refresh rates.
         const baseSmoothing = 0.05; // Target smoothing at 60 FPS
-        const adjustedSmoothing = 1 - Math.pow(1 - baseSmoothing, p.deltaTime / (1000 / 60));
+        const dt = Math.max(0, p.deltaTime);
+        const adjustedSmoothing = 1 - Math.pow(1 - baseSmoothing, dt / (1000 / 60));
         smoothedAvgX = p.lerp(smoothedAvgX, targetAvgX, adjustedSmoothing);
         smoothedAvgY = p.lerp(smoothedAvgY, targetAvgY, adjustedSmoothing);
         // --- END: Frame-Rate Independent Smoothing ---