circuit-to-canvas 0.0.28 → 0.0.29

package/dist/index.js

@@ -196,6 +196,30 @@ function drawPill(params) {
   ctx.restore();
 }
 
+// lib/drawer/shapes/polygon.ts
+import { applyToPoint as applyToPoint5 } from "transformation-matrix";
+function drawPolygon(params) {
+  const { ctx, points, fill, realToCanvasMat } = params;
+  if (points.length < 3) return;
+  ctx.beginPath();
+  const canvasPoints = points.map(
+    (p) => applyToPoint5(realToCanvasMat, [p.x, p.y])
+  );
+  const firstPoint = canvasPoints[0];
+  if (!firstPoint) return;
+  const [firstX, firstY] = firstPoint;
+  ctx.moveTo(firstX, firstY);
+  for (let i = 1; i < canvasPoints.length; i++) {
+    const point = canvasPoints[i];
+    if (!point) continue;
+    const [x, y] = point;
+    ctx.lineTo(x, y);
+  }
+  ctx.closePath();
+  ctx.fillStyle = fill;
+  ctx.fill();
+}
+
 // lib/drawer/elements/pcb-plated-hole.ts
 function drawPcbPlatedHole(params) {
   const { ctx, hole, realToCanvasMat, colorMap } = params;
@@ -325,6 +349,61 @@ function drawPcbPlatedHole(params) {
     });
     return;
   }
+  if (hole.shape === "hole_with_polygon_pad") {
+    const padOutline = hole.pad_outline;
+    if (padOutline && padOutline.length >= 3) {
+      const padPoints = padOutline.map((point) => ({
+        x: hole.x + point.x,
+        y: hole.y + point.y
+      }));
+      drawPolygon({
+        ctx,
+        points: padPoints,
+        fill: colorMap.copper.top,
+        realToCanvasMat
+      });
+    }
+    const holeX = hole.x + (hole.hole_offset_x ?? 0);
+    const holeY = hole.y + (hole.hole_offset_y ?? 0);
+    const holeShape = hole.hole_shape;
+    if (holeShape === "circle") {
+      drawCircle({
+        ctx,
+        center: { x: holeX, y: holeY },
+        radius: (hole.hole_diameter ?? 0) / 2,
+        fill: colorMap.drill,
+        realToCanvasMat
+      });
+    } else if (holeShape === "oval") {
+      drawOval({
+        ctx,
+        center: { x: holeX, y: holeY },
+        width: hole.hole_width ?? 0,
+        height: hole.hole_height ?? 0,
+        fill: colorMap.drill,
+        realToCanvasMat
+      });
+    } else if (holeShape === "pill") {
+      drawPill({
+        ctx,
+        center: { x: holeX, y: holeY },
+        width: hole.hole_width ?? 0,
+        height: hole.hole_height ?? 0,
+        fill: colorMap.drill,
+        realToCanvasMat
+      });
+    } else if (holeShape === "rotated_pill") {
+      drawPill({
+        ctx,
+        center: { x: holeX, y: holeY },
+        width: hole.hole_width ?? 0,
+        height: hole.hole_height ?? 0,
+        fill: colorMap.drill,
+        realToCanvasMat
+      });
+    }
+    return;
+  }
 }
 
 // lib/drawer/elements/pcb-via.ts
@@ -417,30 +496,6 @@ function drawPcbHole(params) {
   }
 }
 
-// lib/drawer/shapes/polygon.ts
-import { applyToPoint as applyToPoint5 } from "transformation-matrix";
-function drawPolygon(params) {
-  const { ctx, points, fill, realToCanvasMat } = params;
-  if (points.length < 3) return;
-  ctx.beginPath();
-  const canvasPoints = points.map(
-    (p) => applyToPoint5(realToCanvasMat, [p.x, p.y])
-  );
-  const firstPoint = canvasPoints[0];
-  if (!firstPoint) return;
-  const [firstX, firstY] = firstPoint;
-  ctx.moveTo(firstX, firstY);
-  for (let i = 1; i < canvasPoints.length; i++) {
-    const point = canvasPoints[i];
-    if (!point) continue;
-    const [x, y] = point;
-    ctx.lineTo(x, y);
-  }
-  ctx.closePath();
-  ctx.fillStyle = fill;
-  ctx.fill();
-}
-
 // lib/drawer/elements/pcb-smtpad.ts
 function layerToColor(layer, colorMap) {
   return colorMap.copper[layer] ?? colorMap.copper.top;

package/lib/drawer/elements/pcb-plated-hole.ts

@@ -5,6 +5,7 @@ import { drawCircle } from "../shapes/circle"
 import { drawRect } from "../shapes/rect"
 import { drawOval } from "../shapes/oval"
 import { drawPill } from "../shapes/pill"
+import { drawPolygon } from "../shapes/polygon"
 
 export interface DrawPcbPlatedHoleParams {
   ctx: CanvasContext
@@ -96,12 +97,12 @@ export function drawPcbPlatedHole(params: DrawPcbPlatedHoleParams): void {
       height: hole.rect_pad_height,
       fill: colorMap.copper.top,
       realToCanvasMat,
-      borderRadius: (hole as any).rect_border_radius ?? 0,
+      borderRadius: hole.rect_border_radius ?? 0,
     })
 
     // Draw circular drill hole (with offset)
-    const holeX = hole.x + ((hole as any).hole_offset_x ?? 0)
-    const holeY = hole.y + ((hole as any).hole_offset_y ?? 0)
+    const holeX = hole.x + (hole.hole_offset_x ?? 0)
+    const holeY = hole.y + (hole.hole_offset_y ?? 0)
     drawCircle({
       ctx,
       center: { x: holeX, y: holeY },
@@ -121,12 +122,12 @@ export function drawPcbPlatedHole(params: DrawPcbPlatedHoleParams): void {
       height: hole.rect_pad_height,
       fill: colorMap.copper.top,
       realToCanvasMat,
-      borderRadius: (hole as any).rect_border_radius ?? 0,
+      borderRadius: hole.rect_border_radius ?? 0,
     })
 
     // Draw pill drill hole (with offset)
-    const holeX = hole.x + ((hole as any).hole_offset_x ?? 0)
-    const holeY = hole.y + ((hole as any).hole_offset_y ?? 0)
+    const holeX = hole.x + (hole.hole_offset_x ?? 0)
+    const holeY = hole.y + (hole.hole_offset_y ?? 0)
     drawPill({
       ctx,
       center: { x: holeX, y: holeY },
@@ -147,13 +148,13 @@ export function drawPcbPlatedHole(params: DrawPcbPlatedHoleParams): void {
       height: hole.rect_pad_height,
       fill: colorMap.copper.top,
       realToCanvasMat,
-      borderRadius: (hole as any).rect_border_radius ?? 0,
+      borderRadius: hole.rect_border_radius ?? 0,
       rotation: hole.rect_ccw_rotation,
     })
 
     // Draw rotated pill drill hole (with offset)
-    const holeX = hole.x + ((hole as any).hole_offset_x ?? 0)
-    const holeY = hole.y + ((hole as any).hole_offset_y ?? 0)
+    const holeX = hole.x + (hole.hole_offset_x ?? 0)
+    const holeY = hole.y + (hole.hole_offset_y ?? 0)
     drawPill({
       ctx,
       center: { x: holeX, y: holeY },
@@ -165,4 +166,65 @@ export function drawPcbPlatedHole(params: DrawPcbPlatedHoleParams): void {
     })
     return
   }
+
+  if (hole.shape === "hole_with_polygon_pad") {
+    // Draw polygon pad
+    const padOutline = hole.pad_outline
+    if (padOutline && padOutline.length >= 3) {
+      // Transform pad_outline points to be relative to hole.x, hole.y
+      const padPoints = padOutline.map((point: { x: number; y: number }) => ({
+        x: hole.x + point.x,
+        y: hole.y + point.y,
+      }))
+      drawPolygon({
+        ctx,
+        points: padPoints,
+        fill: colorMap.copper.top,
+        realToCanvasMat,
+      })
+    }
+
+    // Draw drill hole (with offset)
+    const holeX = hole.x + (hole.hole_offset_x ?? 0)
+    const holeY = hole.y + (hole.hole_offset_y ?? 0)
+    const holeShape = hole.hole_shape
+
+    if (holeShape === "circle") {
+      drawCircle({
+        ctx,
+        center: { x: holeX, y: holeY },
+        radius: (hole.hole_diameter ?? 0) / 2,
+        fill: colorMap.drill,
+        realToCanvasMat,
+      })
+    } else if (holeShape === "oval") {
+      drawOval({
+        ctx,
+        center: { x: holeX, y: holeY },
+        width: hole.hole_width ?? 0,
+        height: hole.hole_height ?? 0,
+        fill: colorMap.drill,
+        realToCanvasMat,
+      })
+    } else if (holeShape === "pill") {
+      drawPill({
+        ctx,
+        center: { x: holeX, y: holeY },
+        width: hole.hole_width ?? 0,
+        height: hole.hole_height ?? 0,
+        fill: colorMap.drill,
+        realToCanvasMat,
+      })
+    } else if (holeShape === "rotated_pill") {
+      drawPill({
+        ctx,
+        center: { x: holeX, y: holeY },
+        width: hole.hole_width ?? 0,
+        height: hole.hole_height ?? 0,
+        fill: colorMap.drill,
+        realToCanvasMat,
+      })
+    }
+    return
+  }
 }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "circuit-to-canvas",
   "main": "dist/index.js",
-  "version": "0.0.28",
+  "version": "0.0.29",
   "type": "module",
   "scripts": {
     "build": "tsup-node ./lib/index.ts --format esm --dts",

package/tests/elements/pcb-plated-hole-polygon.test.ts

@@ -0,0 +1,111 @@
+import { expect, test } from "bun:test"
+import { createCanvas } from "@napi-rs/canvas"
+import type { PcbPlatedHole } from "circuit-json"
+import { CircuitToCanvasDrawer } from "../../lib/drawer"
+
+test("draw hole with polygon pad - circle hole", async () => {
+  const canvas = createCanvas(100, 100)
+  const ctx = canvas.getContext("2d")
+  const drawer = new CircuitToCanvasDrawer(ctx)
+
+  ctx.fillStyle = "#1a1a1a"
+  ctx.fillRect(0, 0, 100, 100)
+
+  const hole: PcbPlatedHole = {
+    type: "pcb_plated_hole",
+    pcb_plated_hole_id: "hole1",
+    shape: "hole_with_polygon_pad",
+    x: 50,
+    y: 50,
+    hole_shape: "circle",
+    hole_diameter: 15,
+    pad_outline: [
+      { x: -20, y: -20 },
+      { x: 20, y: -20 },
+      { x: 25, y: 0 },
+      { x: 20, y: 20 },
+      { x: -20, y: 20 },
+      { x: -25, y: 0 },
+    ],
+    layers: ["top", "bottom"],
+  } as any
+
+  drawer.drawElements([hole])
+
+  await expect(canvas.toBuffer("image/png")).toMatchPngSnapshot(
+    import.meta.path,
+    "hole-with-polygon-pad-circle",
+  )
+})
+
+test("draw hole with polygon pad - pill hole with offset", async () => {
+  const canvas = createCanvas(100, 100)
+  const ctx = canvas.getContext("2d")
+  const drawer = new CircuitToCanvasDrawer(ctx)
+
+  ctx.fillStyle = "#1a1a1a"
+  ctx.fillRect(0, 0, 100, 100)
+
+  const hole: PcbPlatedHole = {
+    type: "pcb_plated_hole",
+    pcb_plated_hole_id: "hole1",
+    shape: "hole_with_polygon_pad",
+    x: 50,
+    y: 50,
+    hole_shape: "pill",
+    hole_width: 12,
+    hole_height: 8,
+    hole_offset_x: 5,
+    hole_offset_y: -3,
+    pad_outline: [
+      { x: -25, y: -15 },
+      { x: 25, y: -15 },
+      { x: 30, y: 0 },
+      { x: 25, y: 15 },
+      { x: -25, y: 15 },
+      { x: -30, y: 0 },
+    ],
+    layers: ["top", "bottom"],
+  } as any
+
+  drawer.drawElements([hole])
+
+  await expect(canvas.toBuffer("image/png")).toMatchPngSnapshot(
+    import.meta.path,
+    "hole-with-polygon-pad-pill-offset",
+  )
+})
+
+test("draw hole with polygon pad - pill hole", async () => {
+  const canvas = createCanvas(100, 100)
+  const ctx = canvas.getContext("2d")
+  const drawer = new CircuitToCanvasDrawer(ctx)
+
+  ctx.fillStyle = "#1a1a1a"
+  ctx.fillRect(0, 0, 100, 100)
+
+  const hole: PcbPlatedHole = {
+    type: "pcb_plated_hole",
+    pcb_plated_hole_id: "hole1",
+    shape: "hole_with_polygon_pad",
+    x: 50,
+    y: 50,
+    hole_shape: "rotated_pill",
+    hole_width: 15,
+    hole_height: 10,
+    pad_outline: [
+      { x: -20, y: -20 },
+      { x: 20, y: -20 },
+      { x: 20, y: 20 },
+      { x: -20, y: 20 },
+    ],
+    layers: ["top", "bottom"],
+  } as any
+
+  drawer.drawElements([hole])
+
+  await expect(canvas.toBuffer("image/png")).toMatchPngSnapshot(
+    import.meta.path,
+    "hole-with-polygon-pad-pill",
+  )
+})