feat: gate sectioon

src/components/dsp408/LinearGraph/LinearGraph.tsx

@@ -196,11 +196,27 @@ export const LinearGraph = forwardRef<LinearGraphHandle, LinearGraphProps>(funct
     }
 
     // clip to plot area so user drawing can't bleed into labels
+    const clipPad = 2;
     ctx.save();
     ctx.beginPath();
-    ctx.rect(plot.x, plot.y, plot.width, plot.height);
+    ctx.rect(
+      plot.x - clipPad,
+      plot.y - clipPad,
+      plot.width + clipPad * 2,
+      plot.height + clipPad * 2
+    );
     ctx.clip();
 
+    // draw the frame border first, so data drawn on the edge sits on top of it
+    ctx.strokeStyle = axisColor;
+    ctx.lineWidth = 1;
+    ctx.strokeRect(
+      Math.round(plot.x) + 0.5,
+      Math.round(plot.y) + 0.5,
+      Math.round(plot.width) - 1,
+      Math.round(plot.height) - 1
+    );
+
     if (showGrid) {
       ctx.strokeStyle = gridColor;
       ctx.lineWidth = 1;