circuit-to-canvas 0.0.36 → 0.0.38

package/dist/index.js

@@ -249,17 +249,252 @@ function drawPolygon(params) {
   ctx.fill();
 }
 
+// lib/drawer/elements/soldermask-margin.ts
+import { applyToPoint as applyToPoint6 } from "transformation-matrix";
+function drawSoldermaskRingForRect(ctx, center, width, height, margin, borderRadius, rotation, realToCanvasMat, soldermaskColor, padColor) {
+  const [cx, cy] = applyToPoint6(realToCanvasMat, [center.x, center.y]);
+  const scaledWidth = width * Math.abs(realToCanvasMat.a);
+  const scaledHeight = height * Math.abs(realToCanvasMat.a);
+  const scaledMargin = Math.abs(margin) * Math.abs(realToCanvasMat.a);
+  const scaledRadius = borderRadius * Math.abs(realToCanvasMat.a);
+  ctx.save();
+  ctx.translate(cx, cy);
+  if (rotation !== 0) {
+    ctx.rotate(-rotation * (Math.PI / 180));
+  }
+  const prevCompositeOp = ctx.globalCompositeOperation;
+  if (ctx.globalCompositeOperation !== void 0) {
+    ctx.globalCompositeOperation = "source-atop";
+  }
+  const outerWidth = scaledWidth;
+  const outerHeight = scaledHeight;
+  const outerRadius = scaledRadius;
+  ctx.beginPath();
+  if (outerRadius > 0) {
+    const x = -outerWidth / 2;
+    const y = -outerHeight / 2;
+    const r = Math.min(outerRadius, outerWidth / 2, outerHeight / 2);
+    ctx.moveTo(x + r, y);
+    ctx.lineTo(x + outerWidth - r, y);
+    ctx.arcTo(x + outerWidth, y, x + outerWidth, y + r, r);
+    ctx.lineTo(x + outerWidth, y + outerHeight - r);
+    ctx.arcTo(
+      x + outerWidth,
+      y + outerHeight,
+      x + outerWidth - r,
+      y + outerHeight,
+      r
+    );
+    ctx.lineTo(x + r, y + outerHeight);
+    ctx.arcTo(x, y + outerHeight, x, y + outerHeight - r, r);
+    ctx.lineTo(x, y + r);
+    ctx.arcTo(x, y, x + r, y, r);
+  } else {
+    ctx.rect(-outerWidth / 2, -outerHeight / 2, outerWidth, outerHeight);
+  }
+  ctx.fillStyle = soldermaskColor;
+  ctx.fill();
+  if (ctx.globalCompositeOperation !== void 0) {
+    ctx.globalCompositeOperation = prevCompositeOp || "source-over";
+  }
+  const innerWidth = scaledWidth - scaledMargin * 2;
+  const innerHeight = scaledHeight - scaledMargin * 2;
+  const innerRadius = Math.max(0, scaledRadius - scaledMargin);
+  if (innerWidth > 0 && innerHeight > 0) {
+    ctx.beginPath();
+    if (innerRadius > 0) {
+      const x = -innerWidth / 2;
+      const y = -innerHeight / 2;
+      const r = Math.min(innerRadius, innerWidth / 2, innerHeight / 2);
+      ctx.moveTo(x + r, y);
+      ctx.lineTo(x + innerWidth - r, y);
+      ctx.arcTo(x + innerWidth, y, x + innerWidth, y + r, r);
+      ctx.lineTo(x + innerWidth, y + innerHeight - r);
+      ctx.arcTo(
+        x + innerWidth,
+        y + innerHeight,
+        x + innerWidth - r,
+        y + innerHeight,
+        r
+      );
+      ctx.lineTo(x + r, y + innerHeight);
+      ctx.arcTo(x, y + innerHeight, x, y + innerHeight - r, r);
+      ctx.lineTo(x, y + r);
+      ctx.arcTo(x, y, x + r, y, r);
+    } else {
+      ctx.rect(-innerWidth / 2, -innerHeight / 2, innerWidth, innerHeight);
+    }
+    ctx.fillStyle = padColor;
+    ctx.fill();
+  }
+  ctx.restore();
+}
+function drawSoldermaskRingForCircle(ctx, center, radius, margin, realToCanvasMat, soldermaskColor, padColor) {
+  const [cx, cy] = applyToPoint6(realToCanvasMat, [center.x, center.y]);
+  const scaledRadius = radius * Math.abs(realToCanvasMat.a);
+  const scaledMargin = Math.abs(margin) * Math.abs(realToCanvasMat.a);
+  ctx.save();
+  const prevCompositeOp = ctx.globalCompositeOperation;
+  if (ctx.globalCompositeOperation !== void 0) {
+    ctx.globalCompositeOperation = "source-atop";
+  }
+  ctx.beginPath();
+  ctx.arc(cx, cy, scaledRadius, 0, Math.PI * 2);
+  ctx.fillStyle = soldermaskColor;
+  ctx.fill();
+  if (ctx.globalCompositeOperation !== void 0) {
+    ctx.globalCompositeOperation = prevCompositeOp || "source-over";
+  }
+  const innerRadius = Math.max(0, scaledRadius - scaledMargin);
+  if (innerRadius > 0) {
+    ctx.beginPath();
+    ctx.arc(cx, cy, innerRadius, 0, Math.PI * 2);
+    ctx.fillStyle = padColor;
+    ctx.fill();
+  }
+  ctx.restore();
+}
+function drawSoldermaskRingForPill(ctx, center, width, height, margin, rotation, realToCanvasMat, soldermaskColor, padColor) {
+  const [cx, cy] = applyToPoint6(realToCanvasMat, [center.x, center.y]);
+  const scaledWidth = width * Math.abs(realToCanvasMat.a);
+  const scaledHeight = height * Math.abs(realToCanvasMat.a);
+  const scaledMargin = Math.abs(margin) * Math.abs(realToCanvasMat.a);
+  ctx.save();
+  ctx.translate(cx, cy);
+  if (rotation !== 0) {
+    ctx.rotate(-rotation * (Math.PI / 180));
+  }
+  const prevCompositeOp = ctx.globalCompositeOperation;
+  if (ctx.globalCompositeOperation !== void 0) {
+    ctx.globalCompositeOperation = "source-atop";
+  }
+  const outerWidth = scaledWidth;
+  const outerHeight = scaledHeight;
+  ctx.beginPath();
+  if (outerWidth > outerHeight) {
+    const radius = outerHeight / 2;
+    const straightLength = outerWidth - outerHeight;
+    ctx.moveTo(-straightLength / 2, -radius);
+    ctx.lineTo(straightLength / 2, -radius);
+    ctx.arc(straightLength / 2, 0, radius, -Math.PI / 2, Math.PI / 2);
+    ctx.lineTo(-straightLength / 2, radius);
+    ctx.arc(-straightLength / 2, 0, radius, Math.PI / 2, -Math.PI / 2);
+  } else if (outerHeight > outerWidth) {
+    const radius = outerWidth / 2;
+    const straightLength = outerHeight - outerWidth;
+    ctx.moveTo(radius, -straightLength / 2);
+    ctx.lineTo(radius, straightLength / 2);
+    ctx.arc(0, straightLength / 2, radius, 0, Math.PI);
+    ctx.lineTo(-radius, -straightLength / 2);
+    ctx.arc(0, -straightLength / 2, radius, Math.PI, 0);
+  } else {
+    ctx.arc(0, 0, outerWidth / 2, 0, Math.PI * 2);
+  }
+  ctx.fillStyle = soldermaskColor;
+  ctx.fill();
+  if (ctx.globalCompositeOperation !== void 0) {
+    ctx.globalCompositeOperation = prevCompositeOp || "source-over";
+  }
+  const innerWidth = scaledWidth - scaledMargin * 2;
+  const innerHeight = scaledHeight - scaledMargin * 2;
+  if (innerWidth > 0 && innerHeight > 0) {
+    ctx.beginPath();
+    if (innerWidth > innerHeight) {
+      const radius = innerHeight / 2;
+      const straightLength = innerWidth - innerHeight;
+      ctx.moveTo(-straightLength / 2, -radius);
+      ctx.lineTo(straightLength / 2, -radius);
+      ctx.arc(straightLength / 2, 0, radius, -Math.PI / 2, Math.PI / 2);
+      ctx.lineTo(-straightLength / 2, radius);
+      ctx.arc(-straightLength / 2, 0, radius, Math.PI / 2, -Math.PI / 2);
+    } else if (innerHeight > innerWidth) {
+      const radius = innerWidth / 2;
+      const straightLength = innerHeight - innerWidth;
+      ctx.moveTo(radius, -straightLength / 2);
+      ctx.lineTo(radius, straightLength / 2);
+      ctx.arc(0, straightLength / 2, radius, 0, Math.PI);
+      ctx.lineTo(-radius, -straightLength / 2);
+      ctx.arc(0, -straightLength / 2, radius, Math.PI, 0);
+    } else {
+      ctx.arc(0, 0, innerWidth / 2, 0, Math.PI * 2);
+    }
+    ctx.fillStyle = padColor;
+    ctx.fill();
+  }
+  ctx.restore();
+}
+function drawSoldermaskRingForOval(ctx, center, radius_x, radius_y, margin, rotation, realToCanvasMat, soldermaskColor, holeColor) {
+  const [cx, cy] = applyToPoint6(realToCanvasMat, [center.x, center.y]);
+  const scaledRadiusX = radius_x * Math.abs(realToCanvasMat.a);
+  const scaledRadiusY = radius_y * Math.abs(realToCanvasMat.a);
+  const scaledMargin = Math.abs(margin) * Math.abs(realToCanvasMat.a);
+  ctx.save();
+  ctx.translate(cx, cy);
+  if (rotation !== 0) {
+    ctx.rotate(-rotation * (Math.PI / 180));
+  }
+  const prevCompositeOp = ctx.globalCompositeOperation;
+  if (ctx.globalCompositeOperation !== void 0) {
+    ctx.globalCompositeOperation = "source-atop";
+  }
+  ctx.beginPath();
+  ctx.ellipse(0, 0, scaledRadiusX, scaledRadiusY, 0, 0, Math.PI * 2);
+  ctx.fillStyle = soldermaskColor;
+  ctx.fill();
+  if (ctx.globalCompositeOperation !== void 0) {
+    ctx.globalCompositeOperation = prevCompositeOp || "source-over";
+  }
+  const innerRadiusX = Math.max(0, scaledRadiusX - scaledMargin);
+  const innerRadiusY = Math.max(0, scaledRadiusY - scaledMargin);
+  if (innerRadiusX > 0 && innerRadiusY > 0) {
+    ctx.beginPath();
+    ctx.ellipse(0, 0, innerRadiusX, innerRadiusY, 0, 0, Math.PI * 2);
+    ctx.fillStyle = holeColor;
+    ctx.fill();
+  }
+  ctx.restore();
+}
+
 // lib/drawer/elements/pcb-plated-hole.ts
+function getSoldermaskColor(layers, colorMap) {
+  const layer = layers?.includes("top") ? "top" : "bottom";
+  return colorMap.soldermaskOverCopper[layer] ?? colorMap.soldermaskOverCopper.top;
+}
 function drawPcbPlatedHole(params) {
   const { ctx, hole, realToCanvasMat, colorMap } = params;
+  const hasSoldermask = hole.is_covered_with_solder_mask === true && hole.soldermask_margin !== void 0 && hole.soldermask_margin !== 0;
+  const margin = hasSoldermask ? hole.soldermask_margin : 0;
+  const soldermaskRingColor = getSoldermaskColor(hole.layers, colorMap);
+  const positiveMarginColor = colorMap.substrate;
+  const copperColor = colorMap.copper.top;
   if (hole.shape === "circle") {
+    if (hasSoldermask && margin > 0) {
+      drawCircle({
+        ctx,
+        center: { x: hole.x, y: hole.y },
+        radius: hole.outer_diameter / 2 + margin,
+        fill: positiveMarginColor,
+        realToCanvasMat
+      });
+    }
     drawCircle({
       ctx,
       center: { x: hole.x, y: hole.y },
       radius: hole.outer_diameter / 2,
-      fill: colorMap.copper.top,
+      fill: copperColor,
       realToCanvasMat
     });
+    if (hasSoldermask && margin < 0) {
+      drawSoldermaskRingForCircle(
+        ctx,
+        { x: hole.x, y: hole.y },
+        hole.outer_diameter / 2,
+        margin,
+        realToCanvasMat,
+        soldermaskRingColor,
+        copperColor
+      );
+    }
     drawCircle({
       ctx,
       center: { x: hole.x, y: hole.y },
@@ -270,15 +505,39 @@ function drawPcbPlatedHole(params) {
     return;
   }
   if (hole.shape === "oval") {
+    if (hasSoldermask && margin > 0) {
+      drawOval({
+        ctx,
+        center: { x: hole.x, y: hole.y },
+        radius_x: hole.outer_width / 2 + margin,
+        radius_y: hole.outer_height / 2 + margin,
+        fill: positiveMarginColor,
+        realToCanvasMat,
+        rotation: hole.ccw_rotation
+      });
+    }
     drawOval({
       ctx,
       center: { x: hole.x, y: hole.y },
       radius_x: hole.outer_width / 2,
       radius_y: hole.outer_height / 2,
-      fill: colorMap.copper.top,
+      fill: copperColor,
       realToCanvasMat,
       rotation: hole.ccw_rotation
     });
+    if (hasSoldermask && margin < 0) {
+      drawSoldermaskRingForOval(
+        ctx,
+        { x: hole.x, y: hole.y },
+        hole.outer_width / 2,
+        hole.outer_height / 2,
+        margin,
+        hole.ccw_rotation ?? 0,
+        realToCanvasMat,
+        soldermaskRingColor,
+        copperColor
+      );
+    }
     drawOval({
       ctx,
       center: { x: hole.x, y: hole.y },
@@ -291,15 +550,39 @@ function drawPcbPlatedHole(params) {
     return;
   }
   if (hole.shape === "pill") {
+    if (hasSoldermask && margin > 0) {
+      drawPill({
+        ctx,
+        center: { x: hole.x, y: hole.y },
+        width: hole.outer_width + margin * 2,
+        height: hole.outer_height + margin * 2,
+        fill: positiveMarginColor,
+        realToCanvasMat,
+        rotation: hole.ccw_rotation
+      });
+    }
     drawPill({
       ctx,
       center: { x: hole.x, y: hole.y },
       width: hole.outer_width,
       height: hole.outer_height,
-      fill: colorMap.copper.top,
+      fill: copperColor,
       realToCanvasMat,
       rotation: hole.ccw_rotation
     });
+    if (hasSoldermask && margin < 0) {
+      drawSoldermaskRingForPill(
+        ctx,
+        { x: hole.x, y: hole.y },
+        hole.outer_width,
+        hole.outer_height,
+        margin,
+        hole.ccw_rotation ?? 0,
+        realToCanvasMat,
+        soldermaskRingColor,
+        copperColor
+      );
+    }
     drawPill({
       ctx,
       center: { x: hole.x, y: hole.y },
@@ -312,15 +595,40 @@ function drawPcbPlatedHole(params) {
     return;
   }
   if (hole.shape === "circular_hole_with_rect_pad") {
+    if (hasSoldermask && margin > 0) {
+      drawRect({
+        ctx,
+        center: { x: hole.x, y: hole.y },
+        width: hole.rect_pad_width + margin * 2,
+        height: hole.rect_pad_height + margin * 2,
+        fill: positiveMarginColor,
+        realToCanvasMat,
+        borderRadius: (hole.rect_border_radius ?? 0) + margin
+      });
+    }
     drawRect({
       ctx,
       center: { x: hole.x, y: hole.y },
       width: hole.rect_pad_width,
       height: hole.rect_pad_height,
-      fill: colorMap.copper.top,
+      fill: copperColor,
       realToCanvasMat,
       borderRadius: hole.rect_border_radius ?? 0
     });
+    if (hasSoldermask && margin < 0) {
+      drawSoldermaskRingForRect(
+        ctx,
+        { x: hole.x, y: hole.y },
+        hole.rect_pad_width,
+        hole.rect_pad_height,
+        margin,
+        hole.rect_border_radius ?? 0,
+        0,
+        realToCanvasMat,
+        soldermaskRingColor,
+        copperColor
+      );
+    }
     const holeX = hole.x + (hole.hole_offset_x ?? 0);
     const holeY = hole.y + (hole.hole_offset_y ?? 0);
     drawCircle({
@@ -333,15 +641,40 @@ function drawPcbPlatedHole(params) {
     return;
   }
   if (hole.shape === "pill_hole_with_rect_pad") {
+    if (hasSoldermask && margin > 0) {
+      drawRect({
+        ctx,
+        center: { x: hole.x, y: hole.y },
+        width: hole.rect_pad_width + margin * 2,
+        height: hole.rect_pad_height + margin * 2,
+        fill: positiveMarginColor,
+        realToCanvasMat,
+        borderRadius: (hole.rect_border_radius ?? 0) + margin
+      });
+    }
     drawRect({
       ctx,
       center: { x: hole.x, y: hole.y },
       width: hole.rect_pad_width,
       height: hole.rect_pad_height,
-      fill: colorMap.copper.top,
+      fill: copperColor,
       realToCanvasMat,
       borderRadius: hole.rect_border_radius ?? 0
     });
+    if (hasSoldermask && margin < 0) {
+      drawSoldermaskRingForRect(
+        ctx,
+        { x: hole.x, y: hole.y },
+        hole.rect_pad_width,
+        hole.rect_pad_height,
+        margin,
+        hole.rect_border_radius ?? 0,
+        0,
+        realToCanvasMat,
+        soldermaskRingColor,
+        copperColor
+      );
+    }
     const holeX = hole.x + (hole.hole_offset_x ?? 0);
     const holeY = hole.y + (hole.hole_offset_y ?? 0);
     drawPill({
@@ -355,16 +688,42 @@ function drawPcbPlatedHole(params) {
     return;
   }
   if (hole.shape === "rotated_pill_hole_with_rect_pad") {
+    if (hasSoldermask && margin > 0) {
+      drawRect({
+        ctx,
+        center: { x: hole.x, y: hole.y },
+        width: hole.rect_pad_width + margin * 2,
+        height: hole.rect_pad_height + margin * 2,
+        fill: positiveMarginColor,
+        realToCanvasMat,
+        borderRadius: (hole.rect_border_radius ?? 0) + margin,
+        rotation: hole.rect_ccw_rotation
+      });
+    }
     drawRect({
       ctx,
       center: { x: hole.x, y: hole.y },
       width: hole.rect_pad_width,
       height: hole.rect_pad_height,
-      fill: colorMap.copper.top,
+      fill: copperColor,
       realToCanvasMat,
       borderRadius: hole.rect_border_radius ?? 0,
       rotation: hole.rect_ccw_rotation
     });
+    if (hasSoldermask && margin < 0) {
+      drawSoldermaskRingForRect(
+        ctx,
+        { x: hole.x, y: hole.y },
+        hole.rect_pad_width,
+        hole.rect_pad_height,
+        margin,
+        hole.rect_border_radius ?? 0,
+        hole.rect_ccw_rotation ?? 0,
+        realToCanvasMat,
+        soldermaskRingColor,
+        copperColor
+      );
+    }
     const holeX = hole.x + (hole.hole_offset_x ?? 0);
     const holeY = hole.y + (hole.hole_offset_y ?? 0);
     drawPill({
@@ -388,7 +747,7 @@ function drawPcbPlatedHole(params) {
       drawPolygon({
         ctx,
         points: padPoints,
-        fill: colorMap.copper.top,
+        fill: copperColor,
         realToCanvasMat
       });
     }
@@ -589,217 +948,11 @@ function drawPcbHole(params) {
   }
 }
 
-// lib/drawer/elements/soldermask-margin.ts
-import { applyToPoint as applyToPoint6 } from "transformation-matrix";
-function drawSoldermaskRingForRect(ctx, center, width, height, margin, borderRadius, rotation, realToCanvasMat, soldermaskColor, padColor) {
-  const [cx, cy] = applyToPoint6(realToCanvasMat, [center.x, center.y]);
-  const scaledWidth = width * Math.abs(realToCanvasMat.a);
-  const scaledHeight = height * Math.abs(realToCanvasMat.a);
-  const scaledMargin = Math.abs(margin) * Math.abs(realToCanvasMat.a);
-  const scaledRadius = borderRadius * Math.abs(realToCanvasMat.a);
-  ctx.save();
-  ctx.translate(cx, cy);
-  if (rotation !== 0) {
-    ctx.rotate(-rotation * (Math.PI / 180));
-  }
-  const prevCompositeOp = ctx.globalCompositeOperation;
-  if (ctx.globalCompositeOperation !== void 0) {
-    ctx.globalCompositeOperation = "source-atop";
-  }
-  const outerWidth = scaledWidth;
-  const outerHeight = scaledHeight;
-  const outerRadius = scaledRadius;
-  ctx.beginPath();
-  if (outerRadius > 0) {
-    const x = -outerWidth / 2;
-    const y = -outerHeight / 2;
-    const r = Math.min(outerRadius, outerWidth / 2, outerHeight / 2);
-    ctx.moveTo(x + r, y);
-    ctx.lineTo(x + outerWidth - r, y);
-    ctx.arcTo(x + outerWidth, y, x + outerWidth, y + r, r);
-    ctx.lineTo(x + outerWidth, y + outerHeight - r);
-    ctx.arcTo(
-      x + outerWidth,
-      y + outerHeight,
-      x + outerWidth - r,
-      y + outerHeight,
-      r
-    );
-    ctx.lineTo(x + r, y + outerHeight);
-    ctx.arcTo(x, y + outerHeight, x, y + outerHeight - r, r);
-    ctx.lineTo(x, y + r);
-    ctx.arcTo(x, y, x + r, y, r);
-  } else {
-    ctx.rect(-outerWidth / 2, -outerHeight / 2, outerWidth, outerHeight);
-  }
-  ctx.fillStyle = soldermaskColor;
-  ctx.fill();
-  if (ctx.globalCompositeOperation !== void 0) {
-    ctx.globalCompositeOperation = prevCompositeOp || "source-over";
-  }
-  const innerWidth = scaledWidth - scaledMargin * 2;
-  const innerHeight = scaledHeight - scaledMargin * 2;
-  const innerRadius = Math.max(0, scaledRadius - scaledMargin);
-  if (innerWidth > 0 && innerHeight > 0) {
-    ctx.beginPath();
-    if (innerRadius > 0) {
-      const x = -innerWidth / 2;
-      const y = -innerHeight / 2;
-      const r = Math.min(innerRadius, innerWidth / 2, innerHeight / 2);
-      ctx.moveTo(x + r, y);
-      ctx.lineTo(x + innerWidth - r, y);
-      ctx.arcTo(x + innerWidth, y, x + innerWidth, y + r, r);
-      ctx.lineTo(x + innerWidth, y + innerHeight - r);
-      ctx.arcTo(
-        x + innerWidth,
-        y + innerHeight,
-        x + innerWidth - r,
-        y + innerHeight,
-        r
-      );
-      ctx.lineTo(x + r, y + innerHeight);
-      ctx.arcTo(x, y + innerHeight, x, y + innerHeight - r, r);
-      ctx.lineTo(x, y + r);
-      ctx.arcTo(x, y, x + r, y, r);
-    } else {
-      ctx.rect(-innerWidth / 2, -innerHeight / 2, innerWidth, innerHeight);
-    }
-    ctx.fillStyle = padColor;
-    ctx.fill();
-  }
-  ctx.restore();
-}
-function drawSoldermaskRingForCircle(ctx, center, radius, margin, realToCanvasMat, soldermaskColor, padColor) {
-  const [cx, cy] = applyToPoint6(realToCanvasMat, [center.x, center.y]);
-  const scaledRadius = radius * Math.abs(realToCanvasMat.a);
-  const scaledMargin = Math.abs(margin) * Math.abs(realToCanvasMat.a);
-  ctx.save();
-  const prevCompositeOp = ctx.globalCompositeOperation;
-  if (ctx.globalCompositeOperation !== void 0) {
-    ctx.globalCompositeOperation = "source-atop";
-  }
-  ctx.beginPath();
-  ctx.arc(cx, cy, scaledRadius, 0, Math.PI * 2);
-  ctx.fillStyle = soldermaskColor;
-  ctx.fill();
-  if (ctx.globalCompositeOperation !== void 0) {
-    ctx.globalCompositeOperation = prevCompositeOp || "source-over";
-  }
-  const innerRadius = Math.max(0, scaledRadius - scaledMargin);
-  if (innerRadius > 0) {
-    ctx.beginPath();
-    ctx.arc(cx, cy, innerRadius, 0, Math.PI * 2);
-    ctx.fillStyle = padColor;
-    ctx.fill();
-  }
-  ctx.restore();
-}
-function drawSoldermaskRingForPill(ctx, center, width, height, margin, rotation, realToCanvasMat, soldermaskColor, padColor) {
-  const [cx, cy] = applyToPoint6(realToCanvasMat, [center.x, center.y]);
-  const scaledWidth = width * Math.abs(realToCanvasMat.a);
-  const scaledHeight = height * Math.abs(realToCanvasMat.a);
-  const scaledMargin = Math.abs(margin) * Math.abs(realToCanvasMat.a);
-  ctx.save();
-  ctx.translate(cx, cy);
-  if (rotation !== 0) {
-    ctx.rotate(-rotation * (Math.PI / 180));
-  }
-  const prevCompositeOp = ctx.globalCompositeOperation;
-  if (ctx.globalCompositeOperation !== void 0) {
-    ctx.globalCompositeOperation = "source-atop";
-  }
-  const outerWidth = scaledWidth;
-  const outerHeight = scaledHeight;
-  ctx.beginPath();
-  if (outerWidth > outerHeight) {
-    const radius = outerHeight / 2;
-    const straightLength = outerWidth - outerHeight;
-    ctx.moveTo(-straightLength / 2, -radius);
-    ctx.lineTo(straightLength / 2, -radius);
-    ctx.arc(straightLength / 2, 0, radius, -Math.PI / 2, Math.PI / 2);
-    ctx.lineTo(-straightLength / 2, radius);
-    ctx.arc(-straightLength / 2, 0, radius, Math.PI / 2, -Math.PI / 2);
-  } else if (outerHeight > outerWidth) {
-    const radius = outerWidth / 2;
-    const straightLength = outerHeight - outerWidth;
-    ctx.moveTo(radius, -straightLength / 2);
-    ctx.lineTo(radius, straightLength / 2);
-    ctx.arc(0, straightLength / 2, radius, 0, Math.PI);
-    ctx.lineTo(-radius, -straightLength / 2);
-    ctx.arc(0, -straightLength / 2, radius, Math.PI, 0);
-  } else {
-    ctx.arc(0, 0, outerWidth / 2, 0, Math.PI * 2);
-  }
-  ctx.fillStyle = soldermaskColor;
-  ctx.fill();
-  if (ctx.globalCompositeOperation !== void 0) {
-    ctx.globalCompositeOperation = prevCompositeOp || "source-over";
-  }
-  const innerWidth = scaledWidth - scaledMargin * 2;
-  const innerHeight = scaledHeight - scaledMargin * 2;
-  if (innerWidth > 0 && innerHeight > 0) {
-    ctx.beginPath();
-    if (innerWidth > innerHeight) {
-      const radius = innerHeight / 2;
-      const straightLength = innerWidth - innerHeight;
-      ctx.moveTo(-straightLength / 2, -radius);
-      ctx.lineTo(straightLength / 2, -radius);
-      ctx.arc(straightLength / 2, 0, radius, -Math.PI / 2, Math.PI / 2);
-      ctx.lineTo(-straightLength / 2, radius);
-      ctx.arc(-straightLength / 2, 0, radius, Math.PI / 2, -Math.PI / 2);
-    } else if (innerHeight > innerWidth) {
-      const radius = innerWidth / 2;
-      const straightLength = innerHeight - innerWidth;
-      ctx.moveTo(radius, -straightLength / 2);
-      ctx.lineTo(radius, straightLength / 2);
-      ctx.arc(0, straightLength / 2, radius, 0, Math.PI);
-      ctx.lineTo(-radius, -straightLength / 2);
-      ctx.arc(0, -straightLength / 2, radius, Math.PI, 0);
-    } else {
-      ctx.arc(0, 0, innerWidth / 2, 0, Math.PI * 2);
-    }
-    ctx.fillStyle = padColor;
-    ctx.fill();
-  }
-  ctx.restore();
-}
-function drawSoldermaskRingForOval(ctx, center, radius_x, radius_y, margin, rotation, realToCanvasMat, soldermaskColor, holeColor) {
-  const [cx, cy] = applyToPoint6(realToCanvasMat, [center.x, center.y]);
-  const scaledRadiusX = radius_x * Math.abs(realToCanvasMat.a);
-  const scaledRadiusY = radius_y * Math.abs(realToCanvasMat.a);
-  const scaledMargin = Math.abs(margin) * Math.abs(realToCanvasMat.a);
-  ctx.save();
-  ctx.translate(cx, cy);
-  if (rotation !== 0) {
-    ctx.rotate(-rotation * (Math.PI / 180));
-  }
-  const prevCompositeOp = ctx.globalCompositeOperation;
-  if (ctx.globalCompositeOperation !== void 0) {
-    ctx.globalCompositeOperation = "source-atop";
-  }
-  ctx.beginPath();
-  ctx.ellipse(0, 0, scaledRadiusX, scaledRadiusY, 0, 0, Math.PI * 2);
-  ctx.fillStyle = soldermaskColor;
-  ctx.fill();
-  if (ctx.globalCompositeOperation !== void 0) {
-    ctx.globalCompositeOperation = prevCompositeOp || "source-over";
-  }
-  const innerRadiusX = Math.max(0, scaledRadiusX - scaledMargin);
-  const innerRadiusY = Math.max(0, scaledRadiusY - scaledMargin);
-  if (innerRadiusX > 0 && innerRadiusY > 0) {
-    ctx.beginPath();
-    ctx.ellipse(0, 0, innerRadiusX, innerRadiusY, 0, 0, Math.PI * 2);
-    ctx.fillStyle = holeColor;
-    ctx.fill();
-  }
-  ctx.restore();
-}
-
 // lib/drawer/elements/pcb-smtpad.ts
 function layerToColor(layer, colorMap) {
   return colorMap.copper[layer] ?? colorMap.copper.top;
 }
-function getSoldermaskColor(layer, colorMap) {
+function getSoldermaskColor2(layer, colorMap) {
   return colorMap.soldermaskOverCopper[layer] ?? colorMap.soldermaskOverCopper.top;
 }
 function drawPcbSmtPad(params) {
@@ -807,7 +960,7 @@ function drawPcbSmtPad(params) {
   const color = layerToColor(pad.layer, colorMap);
   const hasSoldermask = pad.is_covered_with_solder_mask === true && pad.soldermask_margin !== void 0 && pad.soldermask_margin !== 0;
   const margin = hasSoldermask ? pad.soldermask_margin : 0;
-  const soldermaskRingColor = getSoldermaskColor(pad.layer, colorMap);
+  const soldermaskRingColor = getSoldermaskColor2(pad.layer, colorMap);
   const positiveMarginColor = colorMap.substrate;
   if (pad.shape === "rect") {
     if (hasSoldermask && margin > 0) {
@@ -1766,78 +1919,76 @@ function drawDimensionLine(params) {
       x: anchor.x + extensionDirection.x * extensionLength,
       y: anchor.y + extensionDirection.y * extensionLength
     };
-    const halfWidth2 = strokeWidth / 2;
+    const halfWidth = strokeWidth / 2;
     const extPerpendicular = {
       x: -extensionDirection.y,
       y: extensionDirection.x
     };
     return [
       {
-        x: anchor.x + extPerpendicular.x * halfWidth2,
-        y: anchor.y + extPerpendicular.y * halfWidth2
+        x: anchor.x + extPerpendicular.x * halfWidth,
+        y: anchor.y + extPerpendicular.y * halfWidth
       },
       {
-        x: anchor.x - extPerpendicular.x * halfWidth2,
-        y: anchor.y - extPerpendicular.y * halfWidth2
+        x: anchor.x - extPerpendicular.x * halfWidth,
+        y: anchor.y - extPerpendicular.y * halfWidth
       },
       {
-        x: endPoint.x - extPerpendicular.x * halfWidth2,
-        y: endPoint.y - extPerpendicular.y * halfWidth2
+        x: endPoint.x - extPerpendicular.x * halfWidth,
+        y: endPoint.y - extPerpendicular.y * halfWidth
       },
       {
-        x: endPoint.x + extPerpendicular.x * halfWidth2,
-        y: endPoint.y + extPerpendicular.y * halfWidth2
+        x: endPoint.x + extPerpendicular.x * halfWidth,
+        y: endPoint.y + extPerpendicular.y * halfWidth
       }
     ];
   };
-  const ext1 = getExtensionPoints(from);
-  allPoints.push(...ext1, ext1[0]);
-  const ext2 = getExtensionPoints(to);
-  allPoints.push(...ext2, ext2[0]);
-  const halfWidth = strokeWidth / 2;
-  const mainLine = [
-    {
-      x: fromBase.x + perpendicular.x * halfWidth,
-      y: fromBase.y + perpendicular.y * halfWidth
-    },
-    {
-      x: fromBase.x - perpendicular.x * halfWidth,
-      y: fromBase.y - perpendicular.y * halfWidth
-    },
-    {
-      x: toBase.x - perpendicular.x * halfWidth,
-      y: toBase.y - perpendicular.y * halfWidth
-    },
-    {
-      x: toBase.x + perpendicular.x * halfWidth,
-      y: toBase.y + perpendicular.y * halfWidth
-    }
-  ];
-  allPoints.push(...mainLine, mainLine[0]);
-  const arrow1 = [
-    fromOffset,
-    {
-      x: fromOffset.x + direction.x * arrowSize + perpendicular.x * (arrowSize / 2),
-      y: fromOffset.y + direction.y * arrowSize + perpendicular.y * (arrowSize / 2)
-    },
-    {
-      x: fromOffset.x + direction.x * arrowSize - perpendicular.x * (arrowSize / 2),
-      y: fromOffset.y + direction.y * arrowSize - perpendicular.y * (arrowSize / 2)
-    }
-  ];
-  allPoints.push(...arrow1, arrow1[0]);
-  const arrow2 = [
-    toOffset,
-    {
-      x: toOffset.x - direction.x * arrowSize + perpendicular.x * (arrowSize / 2),
-      y: toOffset.y - direction.y * arrowSize + perpendicular.y * (arrowSize / 2)
-    },
-    {
-      x: toOffset.x - direction.x * arrowSize - perpendicular.x * (arrowSize / 2),
-      y: toOffset.y - direction.y * arrowSize - perpendicular.y * (arrowSize / 2)
-    }
-  ];
-  allPoints.push(...arrow2, arrow2[0]);
+  allPoints.push(fromOffset);
+  allPoints.push({
+    x: fromBase.x + perpendicular.x * (arrowSize / 2),
+    y: fromBase.y + perpendicular.y * (arrowSize / 2)
+  });
+  allPoints.push({
+    x: fromBase.x + perpendicular.x * (strokeWidth / 2),
+    y: fromBase.y + perpendicular.y * (strokeWidth / 2)
+  });
+  allPoints.push({
+    x: toBase.x + perpendicular.x * (strokeWidth / 2),
+    y: toBase.y + perpendicular.y * (strokeWidth / 2)
+  });
+  allPoints.push({
+    x: toBase.x + perpendicular.x * (arrowSize / 2),
+    y: toBase.y + perpendicular.y * (arrowSize / 2)
+  });
+  allPoints.push(toOffset);
+  allPoints.push({
+    x: toBase.x - perpendicular.x * (arrowSize / 2),
+    y: toBase.y - perpendicular.y * (arrowSize / 2)
+  });
+  allPoints.push({
+    x: toBase.x - perpendicular.x * (strokeWidth / 2),
+    y: toBase.y - perpendicular.y * (strokeWidth / 2)
+  });
+  allPoints.push({
+    x: fromBase.x - perpendicular.x * (strokeWidth / 2),
+    y: fromBase.y - perpendicular.y * (strokeWidth / 2)
+  });
+  allPoints.push({
+    x: fromBase.x - perpendicular.x * (arrowSize / 2),
+    y: fromBase.y - perpendicular.y * (arrowSize / 2)
+  });
+  allPoints.push(fromOffset);
+  const startPoint = allPoints[0];
+  const addTick = (anchor) => {
+    const pts = getExtensionPoints(anchor);
+    allPoints.push(startPoint);
+    allPoints.push(pts[0]);
+    allPoints.push(...pts);
+    allPoints.push(pts[0]);
+    allPoints.push(startPoint);
+  };
+  addTick(from);
+  addTick(to);
   drawPolygon({
     ctx,
     points: allPoints,
@@ -1873,9 +2024,9 @@ function drawDimensionLine(params) {
       const rotationRad = textRotation * Math.PI / 180;
       const sinRot = Math.abs(Math.sin(rotationRad));
       const cosRot = Math.abs(Math.cos(rotationRad));
-      const halfWidth2 = textWidth / 2;
+      const halfWidth = textWidth / 2;
       const halfHeight = textHeight / 2;
-      const maxExtension = halfWidth2 * sinRot + halfHeight * cosRot;
+      const maxExtension = halfWidth * sinRot + halfHeight * cosRot;
       additionalOffset = maxExtension + fontSize * TEXT_INTERSECTION_PADDING_MULTIPLIER;
     }
     const textOffset = arrowSize * TEXT_OFFSET_MULTIPLIER + additionalOffset;
@@ -2039,8 +2190,11 @@ var CircuitToCanvasDrawer = class {
     const hasSoldermaskHoles = elements.some(
       (el) => el.type === "pcb_hole" && el.is_covered_with_solder_mask === true
     );
+    const hasSoldermaskPlatedHoles = elements.some(
+      (el) => el.type === "pcb_plated_hole" && el.is_covered_with_solder_mask === true
+    );
     for (const element of elements) {
-      if (element.type === "pcb_board" && (hasSoldermaskPads || hasSoldermaskHoles)) {
+      if (element.type === "pcb_board" && (hasSoldermaskPads || hasSoldermaskHoles || hasSoldermaskPlatedHoles)) {
         this.drawBoardWithSoldermask(element);
       } else {
         this.drawElement(element, options);