@logomarks/core 0.1.5 → 0.1.8

package/src/analyse/shape/symmetry.js

@@ -0,0 +1,84 @@
+/**
+ * @module @logomarks/core/analyse/shape/symmetry
+ *
+ * How well a mark maps onto itself under a mirror or a turn, measured two ways: its coverage (overlap over union,
+ * which a big solid mass dominates) and its outline (the share of outline pixels that land on the outline, which a
+ * small asymmetric detail inside a badge still breaks).
+ */
+
+import { distance } from '../../raster/distance.js';
+import { bitmap } from './ink.js';
+
+/** @typedef {(x: number, y: number) => [number, number]} PixelMap */
+
+/**
+ * Coverage at a point between pixel centres (bilinear; 0 outside).
+ *
+ * @param {Float32Array} a Coverage, `n` × `n`.
+ * @param {number} n The side.
+ * @param {number} x Pixel coordinates (centres at whole numbers).
+ * @param {number} y
+ * @returns {number} The coverage there.
+ */
+function sample(a, n, x, y) {
+	const x0 = Math.floor(x), y0 = Math.floor(y), fx = x - x0, fy = y - y0;
+	const at = (/** @type {number} */ i, /** @type {number} */ j) => (i < 0 || j < 0 || i >= n || j >= n ? 0 : a[j * n + i]);
+	return at(x0, y0) * (1 - fx) * (1 - fy) + at(x0 + 1, y0) * fx * (1 - fy) + at(x0, y0 + 1) * (1 - fx) * fy + at(x0 + 1, y0 + 1) * fx * fy;
+}
+
+/**
+ * The coverage's overlap with itself mapped by `f` (intersection over union).
+ *
+ * @param {import('./ink.js').Ink} ink The ink.
+ * @param {PixelMap} f Where each pixel centre (x + 0.5, y + 0.5) comes from.
+ * @returns {number} 0–1.
+ */
+export function coverageMatch({ a, n }, f) {
+	let i = 0, u = 0;
+	for (let y = 0; y < n; y++) for (let x = 0; x < n; x++) {
+		const [sx, sy] = f(x + 0.5, y + 0.5), p = a[y * n + x], q = sample(a, n, sx - 0.5, sy - 0.5);
+		i += Math.min(p, q); u += Math.max(p, q);
+	}
+	return u ? i / u : 0;
+}
+
+/**
+ * A matcher for the outline: maps each outline pixel and counts those landing within `tol` pixels of the outline.
+ *
+ * @param {import('./ink.js').Ink} ink The ink.
+ * @param {number[]} outline Its outline pixels (`outlineOf`).
+ * @returns {(f: PixelMap, tol: number) => number} The share matched, 0–1, for a map and a tolerance in pixels.
+ */
+export function outlineMatcher({ n }, outline) {
+	const edge = new Uint8Array(n * n);
+	for (const k of outline) edge[k] = 1;
+	const near = distance(bitmap(edge, n), 0);
+	return (f, tol) => {
+		let ok = 0;
+		for (const k of outline) {
+			const x = k % n, [X, Y] = f(x + 0.5, (k - x) / n + 0.5), i = Math.floor(X), j = Math.floor(Y);
+			if (i >= 0 && j >= 0 && i < n && j < n && near[j * n + i] <= tol) ok++;
+		}
+		return outline.length ? ok / outline.length : 0;
+	};
+}
+
+/**
+ * The mirror across the vertical line x = `cx`.
+ *
+ * @param {number} cx The axis, in pixels.
+ * @returns {PixelMap} The map.
+ */
+export const mirrorX = (cx) => (x, y) => [2 * cx - x, y];
+
+/**
+ * A turn by a whole circle over `order` about `c`.
+ *
+ * @param {number} order How many turns make the circle.
+ * @param {[number, number]} c The centre, in pixels.
+ * @returns {PixelMap} The map.
+ */
+export function turn(order, [cx, cy]) {
+	const t = 2 * Math.PI / order, co = Math.cos(t), si = Math.sin(t);
+	return (x, y) => [cx + (x - cx) * co - (y - cy) * si, cy + (x - cx) * si + (y - cy) * co];
+}

package/src/analyse/shape/thickness.d.ts

@@ -0,0 +1,6 @@
+import type { Ink } from './ink.js';
+
+/** The share of the ink in parts thicker than 2r (covered by discs of radius `r` pixels inside it), 0–1. */
+export function thickShare(ink: Pick<Ink, 'bin' | 'n' | 'count'>, depth: Float32Array, r: number): number;
+/** How drawn-out the pieces are: area over width squared per piece, averaged by area (a stroke ≈ length / width). */
+export function elongation(ink: Pick<Ink, 'bin' | 'n'>, depth: Float32Array): number;

package/src/analyse/shape/thickness.js

@@ -0,0 +1,62 @@
+/**
+ * @module @logomarks/core/analyse/shape/thickness
+ *
+ * How thick a mark's ink is, from its distance transform: the share of the ink in parts thicker than a width (what
+ * an opening by a disc keeps), and how drawn-out its pieces are (a stroke is long for its width; a dot or a block
+ * isn't).
+ */
+
+import { distance } from '../../raster/distance.js';
+import { bitmap } from './ink.js';
+
+/**
+ * The share of the ink covered by discs of radius `r` that fit inside it: the ink in parts thicker than 2r.
+ *
+ * @param {import('./ink.js').Ink} ink The ink.
+ * @param {Float32Array} depth Each ink pixel's distance to the empty space (`distance(ink, 1)`).
+ * @param {number} r The radius in pixels.
+ * @returns {number} 0–1.
+ */
+export function thickShare({ bin, n, count }, depth, r) {
+	const core = new Uint8Array(n * n);
+	let any = false;
+	for (let k = 0; k < n * n; k++) if (bin[k] && depth[k] >= r) { core[k] = 1; any = true; }
+	if (!any || !count) return 0;
+	const near = distance(bitmap(core, n), 0);
+	let kept = 0;
+	for (let k = 0; k < n * n; k++) if (bin[k] && near[k] <= r) kept++;
+	return kept / count;
+}
+
+/**
+ * How drawn-out the pieces are: each 8-connected piece's area over its width squared (its width four times its mean
+ * depth, exact for a long even stroke), averaged by area. A stroke L long and w wide scores about L / w; a dot about
+ * 1.8, a square block 2.3.
+ *
+ * @param {import('./ink.js').Ink} ink The ink.
+ * @param {Float32Array} depth Each ink pixel's distance to the empty space.
+ * @returns {number} The area-weighted mean.
+ */
+export function elongation({ bin, n }, depth) {
+	const seen = new Uint8Array(n * n), stack = [];
+	let sum = 0, total = 0;
+	for (let s = 0; s < n * n; s++) {
+		if (!bin[s] || seen[s]) continue;
+		let area = 0, deep = 0;
+		seen[s] = 1;
+		stack.push(s);
+		while (stack.length) {
+			const k = /** @type {number} */ (stack.pop()), x = k % n, y = (k - x) / n;
+			area++;
+			deep += depth[k];
+			for (let dy = -1; dy <= 1; dy++) for (let dx = -1; dx <= 1; dx++) {
+				const X = x + dx, Y = y + dy, j = Y * n + X;
+				if (X >= 0 && Y >= 0 && X < n && Y < n && bin[j] && !seen[j]) { seen[j] = 1; stack.push(j); }
+			}
+		}
+		const width = 4 * deep / area;
+		sum += area * area / (width * width);
+		total += area;
+	}
+	return total ? sum / total : 0;
+}

package/src/analyse/tags.d.ts

@@ -1,5 +1,21 @@
+import type { ShapeMeasures } from './shape/measures.js';
+
 /** A shape tag measured from a mark's raster. */
 export type ShapeTag = 'wide' | 'tall' | 'round' | 'square' | 'solid' | 'light' | 'symmetric' | 'radial';
 
-/** A fitted mark's shape tags, from its coverage at `size` px (128) and its outline's width and height. */
+/** The thresholds the tags are decided by. */
+export const SHAPE: {
+	wide: number;
+	tall: number;
+	squarish: number;
+	round: { reach: number; ways: Partial<Record<'arc' | 'rim' | 'circularity', number>>[] };
+	square: { fill: number; corners: number };
+	symmetric: { coverage: number; outline: number };
+	radial: { coverage: number; outline: number };
+	light: { elongation: number; thick: number };
+};
+
+/** The shape tags a mark's measures earn, in a fixed order; exactly one of solid and light. */
+export function tagsOf(ms: ShapeMeasures, t?: typeof SHAPE): ShapeTag[];
+/** A fitted mark's shape tags, from its coverage at `size` px (256) and its outline's width and height. */
 export function shapeTags(a: Float32Array, m: { w: number; h: number; size?: number }): ShapeTag[];

package/src/analyse/tags.js

@@ -2,47 +2,82 @@
  * @module @logomarks/core/analyse/tags
  *
  * Shape tags measured from a mark's coverage: wide or tall, round or square, solid or light, symmetric, radial.
+ * Tuned on the 4,040 Logomarks marks against contact sheets (about 95% read right by eye; see docs/tags.md).
  */
 
-import { remap, iou } from '../similar/signature.js';
+import { shapeMeasures } from './shape/measures.js';
+
+/** The thresholds the tags are decided by: the Logomarks settings. */
+export const SHAPE = {
+	/** Width over height beyond which a mark is wide, or below which it is tall. */
+	wide: 1.25,
+	tall: 0.8,
+	/** Round and square marks are about as wide as tall: between this and its inverse. */
+	squarish: 0.9,
+	/** Round: the ink reaches the hull all round, and the hull runs on a circle (any one way). */
+	round: {
+		reach: 0.6,
+		ways: [
+			{ arc: 0.74, circularity: 0.89 },
+			{ arc: 0.65, circularity: 0.96 },
+			{ rim: 0.8, circularity: 0.97 },
+		],
+	},
+	/** Square: the closed silhouette fills its box, every corner too (and it isn't round). */
+	square: { fill: 0.88, corners: 0.6 },
+	/** Symmetric: the left-right mirror matches, coverage and outline both. */
+	symmetric: { coverage: 0.95, outline: 0.95 },
+	/** Radial: a turn of order 3, 4 or 5 matches, coverage and outline both. */
+	radial: { coverage: 0.9, outline: 0.9 },
+	/** Light: strokes (drawn-out pieces) with little mass; every other mark is solid. */
+	light: { elongation: 3, thick: 0.3 },
+};
+
+/**
+ * Whether the measures clear every threshold in `need`.
+ *
+ * @param {import('./shape/measures.js').ShapeMeasures} ms The measures.
+ * @param {Partial<Record<'arc' | 'rim' | 'circularity', number>>} need The thresholds, by measure.
+ * @returns {boolean} All met.
+ */
+const meets = (ms, need) => Object.entries(need).every(([k, v]) => ms[/** @type {'arc' | 'rim' | 'circularity'} */ (k)] >= /** @type {number} */ (v));
+
+/**
+ * The shape tags a mark's measures earn.
+ *
+ * @param {import('./shape/measures.js').ShapeMeasures} ms The measures (`shapeMeasures`).
+ * @param {typeof SHAPE} [t] The thresholds (SHAPE by default).
+ * @returns {import('./tags.js').ShapeTag[]} The tags, in a fixed order; exactly one of solid and light.
+ */
+export function tagsOf(ms, t = SHAPE) {
+	/** @type {import('./tags.js').ShapeTag[]} */
+	const tags = [];
+	if (ms.ratio > t.wide) tags.push('wide'); else if (ms.ratio < t.tall) tags.push('tall');
+	const squarish = ms.ratio > t.squarish && ms.ratio < 1 / t.squarish;
+	if (squarish && ms.reach >= t.round.reach && t.round.ways.some((way) => meets(ms, way))) tags.push('round');
+	else if (squarish && ms.closedFill >= t.square.fill && ms.closedCorners >= t.square.corners) tags.push('square');
+	const light = ms.elongation >= t.light.elongation && Math.min(ms.thick, ms.thickRelative) < t.light.thick;
+	tags.push(light ? 'light' : 'solid');
+	if (ms.mirror.coverage >= t.symmetric.coverage && ms.mirror.outline >= t.symmetric.outline) tags.push('symmetric');
+	if (ms.turns.some((r) => r.coverage >= t.radial.coverage && r.outline >= t.radial.outline)) tags.push('radial');
+	return tags;
+}
 
 /**
- * A fitted mark's shape tags, from its coverage at `size` px (128) and its outline's size on the 512 canvas.
+ * A fitted mark's shape tags, from its coverage at `size` px (256) and its outline's size on the 512 canvas.
  * - wide / tall: wider than 1.25 or narrower than 0.8;
- * - round: about square, every corner of its box empty and the silhouette reaching the edge midpoints and diagonals;
- * - square: about square with three corners or more filled;
- * - solid / light: over 62% or under 30% of its box inked;
- * - symmetric: mirrors onto itself (IoU over 0.94); radial: a quarter turn (0.92) or a half turn (0.94) does.
+ * - round: about square (0.9–1.11), the ink reaching its convex hull all round, and the hull running on a circle;
+ * - square: about square, not round, and its silhouette (gaps up to 60 closed, holes filled) filling its box to the
+ *   corners;
+ * - solid / light: light when it's drawn in strokes with little mass (under 30% of the ink in parts thicker than 48
+ *   units, or than 12% of its short side); every other mark is solid;
+ * - symmetric: its left-right mirror matches (coverage and outline 0.95); a top-bottom mirror alone doesn't count;
+ * - radial: a turn by a third, a quarter or a fifth matches (0.9): rotational symmetry of order 3 or more.
  *
  * @param {Float32Array} a Coverage 0–1, `size` × `size`, row by row.
  * @param {{ w: number, h: number, size?: number }} m The outline's width and height (fitted), and the raster's side.
  * @returns {import('./tags.js').ShapeTag[]} The tags, in a fixed order.
  */
-export function shapeTags(a, { w: mw, h: mh, size: N = 128 }) {
-  const tags = new Set();
-  const tf = (/** @type {(x: number, y: number) => number[]} */ f) => remap(a, N, f);
-  // bbox in raster px
-  const s = N / 512, x0 = Math.round((256 - mw / 2) * s), y0 = Math.round((256 - mh / 2) * s), w = Math.round(mw * s), h = Math.round(mh * s);
-  let fill = 0; for (let y = y0; y < y0 + h; y++) for (let x = x0; x < x0 + w; x++) fill += a[y * N + x] || 0;
-  const density = fill / (w * h);
-  const ratio = mw / mh;
-  if (ratio > 1.25) tags.add('wide'); else if (ratio < 0.8) tags.add('tall');
-  // corners of the bbox: empty everywhere → round silhouette; mostly filled → square
-  const c = Math.max(2, Math.round(Math.min(w, h) * 0.1));
-  const corner = (/** @type {number} */ cx, /** @type {number} */ cy) => { let f = 0; for (let y = cy; y < cy + c; y++) for (let x = cx; x < cx + c; x++) f += a[y * N + x] || 0; return f / (c * c); };
-  const cs = [corner(x0, y0), corner(x0 + w - c, y0), corner(x0, y0 + h - c), corner(x0 + w - c, y0 + h - c)];
-  const sq = ratio > 0.92 && ratio < 1.08;
-  if (sq && cs.every((v) => v < 0.04)) {
-    // also require the silhouette to reach the edge midpoints (a disc, not a diamond or a small blob)
-    const mid = (/** @type {number} */ x, /** @type {number} */ y) => a[y * N + x] > 0.5;
-    const r = Math.round(w / 2), cxp = x0 + r, cyp = y0 + r, d = Math.round(w * 0.06);
-    const diag = Math.round(r * 0.70);
-    if ([mid(cxp, y0 + d), mid(cxp, y0 + h - 1 - d), mid(x0 + d, cyp), mid(x0 + w - 1 - d, cyp)].filter(Boolean).length >= 3 &&
-        [mid(cxp - diag + d, cyp - diag + d), mid(cxp + diag - d, cyp - diag + d), mid(cxp - diag + d, cyp + diag - d), mid(cxp + diag - d, cyp + diag - d)].filter(Boolean).length >= 3) tags.add('round');
-  }
-  if (sq && cs.filter((v) => v > 0.6).length >= 3) tags.add('square');
-  if (density > 0.62) tags.add('solid'); else if (density < 0.3) tags.add('light');
-  if (iou(a, tf((x, y) => [N - 1 - x, y])) > 0.94 || iou(a, tf((x, y) => [x, N - 1 - y])) > 0.94) tags.add('symmetric');
-  if (iou(a, tf((x, y) => [y, N - 1 - x])) > 0.92 || iou(a, tf((x, y) => [N - 1 - x, N - 1 - y])) > 0.94) tags.add('radial');
-  return /** @type {import('./tags.js').ShapeTag[]} */ ([...tags]);
+export function shapeTags(a, m) {
+	return tagsOf(shapeMeasures(a, m));
 }

package/src/geometry/index.d.ts

@@ -12,7 +12,7 @@ export type { SkelEnd, SkelStroke, Skeleton } from './letters.js';
 export type { GlitchOptions } from './glitch.js';
 export { C, GAP, polar, poly, mapPts, rot, move, scale, flipX, sample, closedCurve, polygonPath, TAU, rad } from './core.js';
 export { U, I, robust, robustOps, OPS, D, X } from './booleans.js';
-export { signedArea, area, perimeter, ringBox, bbox, winding, dedupe } from './polygon.js';
+export { signedArea, area, perimeter, ringBox, bbox, winding, dedupe, openRing, closeRing } from './polygon.js';
 export { seeded } from './random.js';
 export { circle, ellipse, rect, regular, annulus, sector, arcBand, rotN, bar, ring, roundPoly, rr, lens, drop, squircle, pill, egg } from './shapes.js';
 export { stroke, weave, offsetPts, fillet, tracks, filletClosed, trackLoop, walk, balloon, linePts, arcPts, joinPts } from './stroke.js';

package/src/geometry/index.js

@@ -5,7 +5,7 @@
  */
 export { C, GAP, polar, poly, mapPts, rot, move, scale, flipX, sample, closedCurve, polygonPath, TAU, rad } from './core.js';
 export { U, I, robust, robustOps, OPS, D, X } from './booleans.js';
-export { signedArea, area, perimeter, ringBox, bbox, winding, dedupe } from './polygon.js';
+export { signedArea, area, perimeter, ringBox, bbox, winding, dedupe, openRing, closeRing } from './polygon.js';
 export { seeded } from './random.js';
 export { circle, ellipse, rect, regular, annulus, sector, arcBand, rotN, bar, ring, roundPoly, rr, lens, drop, squircle, pill, egg } from './shapes.js';
 export { stroke, weave, offsetPts, fillet, tracks, filletClosed, trackLoop, walk, balloon, linePts, arcPts, joinPts } from './stroke.js';

package/src/geometry/needle.js

@@ -2,6 +2,7 @@
  * Needle trimming for iso solids: where a round-ended gap meets a silhouette corner at a shallow angle, the face runs on
  * past the gap's end as a sliver about 1 wide; deneedle() cuts it off so the face ends square on the gap.
  */
+import { openRing } from './polygon.js';
 
 /** Where line a–b meets line c–d. */
 const meet = (a, b, c, d) => { const r = [b[0] - a[0], b[1] - a[1]], s = [d[0] - c[0], d[1] - c[1]], den = r[0] * s[1] - r[1] * s[0];
@@ -9,9 +10,9 @@ const meet = (a, b, c, d) => { const r = [b[0] - a[0], b[1] - a[1]], s = [d[0] -
 /** Cuts the needles off a shape. A needle is a corner sharper than `deg` with one edge shorter than `len`: where a round-ended
     gap meets a silhouette corner at a shallow angle (the hex solids' 60° corners), the face runs on past the gap's end as a
     sliver about 1 wide. The tip and the short edge's far end become one point, where the long edge into the tip meets the
-    edge out of the short one, so the face ends square on the gap. */
+    edge out of the short one, so the face ends square on the gap. Rings may come open or closed; they go back closed. */
 export const deneedle = (shape, { deg = 12, len = 16 } = {}) => shape.map((pg) => pg.map((ring) => {
-  const q = ring.slice(0, -1), d = (u, v) => Math.hypot(u[0] - v[0], u[1] - v[1]);
+  const q = openRing(ring).slice(), d = (u, v) => Math.hypot(u[0] - v[0], u[1] - v[1]);
   for (let i = 0; i < q.length && q.length > 4; i++) { const n = q.length, w = (k) => q[(k + n) % n], v = q[i], a = w(i - 1), b = w(i + 1);
     const ang = Math.abs(Math.atan2((a[0] - v[0]) * (b[1] - v[1]) - (a[1] - v[1]) * (b[0] - v[0]), (a[0] - v[0]) * (b[0] - v[0]) + (a[1] - v[1]) * (b[1] - v[1])));
     if (ang * 180 / Math.PI >= deg) continue;

package/src/geometry/offset.js

@@ -7,11 +7,11 @@ import { U, D, I } from './booleans.js';
 import { circle, rect, bar } from './shapes.js';
 import { stroke } from './stroke.js';
 import { dp } from './path.js';
-import { dedupe } from './polygon.js';
+import { dedupe, openRing } from './polygon.js';
 
 const polys = (g) => (g.length && typeof g[0][0][0] === 'number' ? [g] : g);
 /** A ring's corner points, simplified (an open copy, split at its farthest point so the simplifier never sees first = last). */
-const ringPts = (r, tol = 0.2) => { const q = r.length > 1 && r[0][0] === r.at(-1)[0] && r[0][1] === r.at(-1)[1] ? r.slice(0, -1) : r; let far = 0, fd = -1;
+const ringPts = (r, tol = 0.2) => { const q = openRing(r, 0); let far = 0, fd = -1;
   q.forEach((p, i) => { const d = Math.hypot(p[0] - q[0][0], p[1] - q[0][1]); if (d > fd) { fd = d; far = i; } });
   return [...dp(q.slice(0, far + 1), tol).slice(0, -1), ...dp([...q.slice(far), q[0]], tol).slice(0, -1)]; };
 /** A true round offset: grows a shape by d (shrinks it when d < 0), every corner rounded. */

package/src/geometry/path.js

@@ -1,6 +1,7 @@
 /**
  * Shapes out: SVG path data (Douglas-Peucker simplified, one decimal), the SVG file, and writing it.
  */
+import { openRing } from './polygon.js';
 
 // Douglas-Peucker on each ring, then path string (evenodd)
 export function dp(pts, tol) {
@@ -13,8 +14,10 @@ export function dp(pts, tol) {
     if (md > tol) { keep[mi] = 1; st.push([a, mi], [mi, b]); } }
   return pts.filter((_, i) => keep[i]);
 }
+/** A shape as SVG path data (even-odd): each ring opened (closed or open, every corner kept), split at its farthest point,
+    simplified within `tol` and written to one decimal. */
 export function toPath(mp, tol = 0.12) {
-  return mp.map(pg => pg.map(ring => { let pts = ring.slice(0, -1); let far = 0, fd = -1;
+  return mp.map(pg => pg.map(ring => { let pts = openRing(ring); let far = 0, fd = -1;
     pts.forEach((q, i) => { const d = Math.hypot(q[0] - pts[0][0], q[1] - pts[0][1]); if (d > fd) { fd = d; far = i; } });
     pts = [...dp(pts.slice(0, far + 1), tol).slice(0, -1), ...dp([...pts.slice(far), pts[0]], tol).slice(0, -1)];
     return pts.length < 3 ? '' : 'M' + pts.map(([x, y]) => `${x.toFixed(1)} ${y.toFixed(1)}`).join('L') + 'Z'; }).join('')).join('');

package/src/geometry/polygon.d.ts

@@ -16,3 +16,7 @@ export function bbox(g: Shape): Box;
 export function winding(r: readonly Point[], p: Point): number;
 /** The points without repeated consecutive ones. */
 export function dedupe<P extends Point>(pts: readonly P[]): P[];
+/** A ring without its closing point: the last goes only when within `eps` (default 1e-6) of the first, so open rings keep every corner. */
+export function openRing<P extends Point>(ring: readonly P[], eps?: number): P[];
+/** A ring with its closing point: the first repeated at the end, unless the last is already within `eps` (default 1e-6) of it. */
+export function closeRing<P extends Point>(ring: readonly P[], eps?: number): P[];

package/src/geometry/polygon.js

@@ -1,6 +1,10 @@
 /**
  * Measures of a ring (a list of [x, y] points, closed implicitly) and of a shape: signed area, area, perimeter,
- * bounding box, winding number round a point, and consecutive duplicates dropped.
+ * bounding box, winding number round a point, consecutive duplicates dropped, and a ring opened or closed.
+ *
+ * Rings come both ways: the shape builders (poly, rect, circle, ellipse, rr, roundPoly, …) return them open (no repeated
+ * first point), the booleans (U, D, I, grow, lens, drop, …) closed (the first point repeated at the end). Code that wants
+ * one or the other asks for it with openRing() or closeRing() rather than slicing the last point off blind.
  */
 
 /**
@@ -91,3 +95,26 @@ export const dedupe = (pts) => pts.filter((p, i) => {
 	const q = pts[(i + 1) % pts.length];
 	return Math.hypot(p[0] - q[0], p[1] - q[1]) > 1e-6;
 });
+
+/**
+ * A ring without its closing point: the last point goes only when it lies within `eps` of the first (a sampled full turn
+ * ends near, not exactly on, its start), so an open ring comes back as it is, every corner kept.
+ *
+ * @template {import('./types.js').Point} P
+ * @param {readonly P[]} ring The ring, open or closed.
+ * @param {number} [eps] How near the last point must be to the first to count as its repeat.
+ * @returns {P[]} The ring, open (the input itself when it already was).
+ */
+export const openRing = (ring, eps = 1e-6) =>
+	/** @type {P[]} */ (ring.length > 1 && Math.hypot(ring[0][0] - ring[ring.length - 1][0], ring[0][1] - ring[ring.length - 1][1]) <= eps ? ring.slice(0, -1) : ring);
+
+/**
+ * A ring with its closing point: the first point repeated at the end, unless the last already lies within `eps` of it.
+ *
+ * @template {import('./types.js').Point} P
+ * @param {readonly P[]} ring The ring, open or closed.
+ * @param {number} [eps] How near the last point must be to the first to count as its repeat.
+ * @returns {P[]} The ring, closed (the input itself when it already was).
+ */
+export const closeRing = (ring, eps = 1e-6) =>
+	/** @type {P[]} */ (ring.length && openRing(ring, eps) === ring ? [...ring, ring[0]] : ring);

package/src/skill/bundle.js

@@ -15,7 +15,7 @@ const SRC = new URL('../', import.meta.url);
 /** The geometry kit's modules, in dependency order. */
 const KIT = ['geometry/core.js', 'geometry/booleans.js', 'geometry/polygon.js', 'geometry/random.js', 'geometry/shapes.js', 'geometry/stroke.js',
 	'geometry/path.js', 'geometry/offset.js', 'geometry/iso.js', 'geometry/modular.js', 'geometry/badges.js', 'geometry/letters.js',
-	'svg/path.js', 'svg/shapes.js', 'svg/rings.js', 'svg/shape.js', 'geometry/glitch.js', 'geometry/needle.js'];
+	'svg/path.js', 'svg/shapes.js', 'svg/rings.js', 'svg/nonzero.js', 'svg/shape.js', 'geometry/glitch.js', 'geometry/needle.js'];
 
 /** The fit's modules, in dependency order. */
 const FIT = ['svg/path.js', 'svg/shapes.js', 'svg/outline.js', 'util/number.js', 'fit/index.js'];

package/src/svg/index.d.ts

@@ -6,3 +6,4 @@ export { attr, shapes, viewBox, body } from './shapes.js';
 export { outlinePoints, bounds } from './outline.js';
 export { rings } from './rings.js';
 export { filledShape, svgShape, pathRings } from './shape.js';
+export { nonzeroFill, windingFill, ringsMeet } from './nonzero.js';

package/src/svg/index.js

@@ -7,3 +7,4 @@ export { attr, shapes, viewBox, body } from './shapes.js';
 export { outlinePoints, bounds } from './outline.js';
 export { rings } from './rings.js';
 export { filledShape, svgShape, pathRings } from './shape.js';
+export { nonzeroFill, windingFill, ringsMeet } from './nonzero.js';

package/src/svg/nonzero.d.ts

@@ -0,0 +1,12 @@
+import type { BooleanOps } from '../geometry/booleans.js';
+import type { Point, Ring, Shape } from '../geometry/types.js';
+
+/** Whether any two rings meet: an edge of one crosses or touches an edge of another. */
+export function ringsMeet(rs: readonly (readonly Point[])[]): boolean;
+/** Exact non-zero fill by winding levels, however the rings overlap (each ring taken as simple). */
+export function windingFill(rs: Ring[], b: BooleanOps): Shape;
+/**
+ * Non-zero fill from rings: classed one by one when no two meet; by winding levels when any do, keeping the classed
+ * polygons when they cover the same ground.
+ */
+export function nonzeroFill(rs: Ring[], b: BooleanOps): Shape;

package/src/svg/nonzero.js

@@ -0,0 +1,166 @@
+/**
+ * @module @logomarks/core/svg/nonzero
+ *
+ * Non-zero fill from rings. polygon-clipping (the booleans' library) has no non-zero fill rule across rings: it takes
+ * a polygon's first ring as its outside and the rest as holes. So the fill is built from booleans: rings that never
+ * meet are classed one by one (union or cut), and rings that cross or touch (overlapping subpaths, as font glyphs
+ * draw) go through winding levels, which are exact however they overlap. (clipper-lib has a non-zero fill type, but it
+ * is only an optional peer here, for the shape edits.)
+ */
+
+import { area, ringBox, signedArea, winding } from '../geometry/polygon.js';
+
+/**
+ * Whether segments ab and cd meet (crossing, touching or overlapping along a line).
+ *
+ * @param {import('../geometry/types.js').Point} a
+ * @param {import('../geometry/types.js').Point} b
+ * @param {import('../geometry/types.js').Point} c
+ * @param {import('../geometry/types.js').Point} d
+ * @returns {boolean} True when they share a point.
+ */
+function segmentsMeet(a, b, c, d) {
+	const side = (/** @type {number[]} */ p, /** @type {number[]} */ q, /** @type {number[]} */ r) => Math.sign((q[0] - p[0]) * (r[1] - p[1]) - (q[1] - p[1]) * (r[0] - p[0]));
+	const within = (/** @type {number[]} */ p, /** @type {number[]} */ q, /** @type {number[]} */ r) =>
+		Math.min(p[0], q[0]) <= r[0] && r[0] <= Math.max(p[0], q[0]) && Math.min(p[1], q[1]) <= r[1] && r[1] <= Math.max(p[1], q[1]);
+	const d1 = side(c, d, a), d2 = side(c, d, b), d3 = side(a, b, c), d4 = side(a, b, d);
+	if (d1 * d2 < 0 && d3 * d4 < 0) return true;
+	return (d1 === 0 && within(c, d, a)) || (d2 === 0 && within(c, d, b)) || (d3 === 0 && within(a, b, c)) || (d4 === 0 && within(a, b, d));
+}
+
+/**
+ * Whether two boxes overlap (edges touching count).
+ *
+ * @param {import('../geometry/types.js').Box} p
+ * @param {import('../geometry/types.js').Box} q
+ * @returns {boolean} True when they share a point.
+ */
+const boxesMeet = (p, q) => p[0] <= q[2] && q[0] <= p[2] && p[1] <= q[3] && q[1] <= p[3];
+
+/**
+ * The edges of a ring that reach into a box, each as its two ends and its own box.
+ *
+ * @param {readonly import('../geometry/types.js').Point[]} r The ring.
+ * @param {import('../geometry/types.js').Box} box The box.
+ * @returns {[import('../geometry/types.js').Point, import('../geometry/types.js').Point, import('../geometry/types.js').Box][]} The edges.
+ */
+function edgesIn(r, box) {
+	/** @type {[import('../geometry/types.js').Point, import('../geometry/types.js').Point, import('../geometry/types.js').Box][]} */
+	const out = [];
+	r.forEach((p, i) => {
+		const q = r[(i + 1) % r.length];
+		/** @type {import('../geometry/types.js').Box} */
+		const eb = [Math.min(p[0], q[0]), Math.min(p[1], q[1]), Math.max(p[0], q[0]), Math.max(p[1], q[1])];
+		if (boxesMeet(eb, box)) out.push([p, q, eb]);
+	});
+	return out;
+}
+
+/**
+ * Whether any two of the rings meet: an edge of one crosses or touches an edge of another.
+ *
+ * @param {readonly (readonly import('../geometry/types.js').Point[])[]} rs The rings.
+ * @returns {boolean} True when two rings meet.
+ */
+export function ringsMeet(rs) {
+	const boxes = rs.map(ringBox);
+	for (let i = 0; i < rs.length; i++) {
+		for (let j = i + 1; j < rs.length; j++) {
+			if (!boxesMeet(boxes[i], boxes[j])) continue;
+			/** @type {import('../geometry/types.js').Box} */
+			const both = [Math.max(boxes[i][0], boxes[j][0]), Math.max(boxes[i][1], boxes[j][1]), Math.min(boxes[i][2], boxes[j][2]), Math.min(boxes[i][3], boxes[j][3])];
+			const ei = edgesIn(rs[i], both), ej = edgesIn(rs[j], both);
+			for (const [a, b, ab] of ei) for (const [c, d, cb] of ej) if (boxesMeet(ab, cb) && segmentsMeet(a, b, c, d)) return true;
+		}
+	}
+	return false;
+}
+
+/**
+ * Non-zero fill for rings that never meet (nested or apart): largest first, each ring is added or cut by the winding
+ * just either side of its longest edge. With no other ring touching it, one test point pair speaks for the whole ring.
+ *
+ * @param {import('../geometry/types.js').Ring[]} rs The rings.
+ * @param {import('../geometry/booleans.js').BooleanOps} b The booleans.
+ * @returns {import('../geometry/types.js').Shape} The filled shape.
+ */
+function classedFill(rs, b) {
+	const sorted = rs.slice().sort((p, q) => Math.abs(signedArea(q)) - Math.abs(signedArea(p)));
+	const total = (/** @type {import('../geometry/types.js').Point} */ pt) => rs.reduce((s, r) => s + winding(r, pt), 0);
+	/** @type {import('../geometry/types.js').Shape} */
+	let g = [];
+	for (const r of sorted) {
+		let k = 0, longest = 0;
+		r.forEach((p, i) => {
+			const q = r[(i + 1) % r.length], L = Math.hypot(q[0] - p[0], q[1] - p[1]);
+			if (L > longest) { k = i; longest = L; }
+		});
+		const p = r[k], q = r[(k + 1) % r.length], e = 0.05;
+		const nx = ((q[1] - p[1]) / longest) * e, ny = ((q[0] - p[0]) / longest) * e;
+		const m = [(p[0] + q[0]) / 2, (p[1] + q[1]) / 2];
+		/** @type {import('../geometry/types.js').Point} */
+		const a = [m[0] - nx, m[1] + ny];
+		/** @type {import('../geometry/types.js').Point} */
+		const c = [m[0] + nx, m[1] - ny];
+		const [inside, outside] = winding(r, a) ? [a, c] : [c, a];
+		const fi = total(inside) !== 0, fo = total(outside) !== 0;
+		if (fi && !fo) g = b.union(g, [r]);
+		else if (!fi && fo) g = b.difference(g, [r]);
+	}
+	return g;
+}
+
+/**
+ * Exact non-zero fill for rings however they overlap. The plane is kept as winding levels (the region where the rings
+ * so far sum to each non-zero winding); each ring moves the part of every level it covers one step, up or down by its
+ * direction. The fill is every non-zero level unioned. Each ring is taken as simple, wound one way.
+ *
+ * @param {import('../geometry/types.js').Ring[]} rs The rings.
+ * @param {import('../geometry/booleans.js').BooleanOps} b The booleans.
+ * @returns {import('../geometry/types.js').Shape} The filled shape.
+ */
+export function windingFill(rs, b) {
+	/** @type {Map<number, import('../geometry/types.js').Shape>} */
+	let levels = new Map();
+	for (const r of rs) {
+		const s = Math.sign(signedArea(r)), R = b.union([r]);
+		/** @type {Map<number, import('../geometry/types.js').Shape>} */
+		const next = new Map();
+		const add = (/** @type {number} */ k, /** @type {import('../geometry/types.js').Shape} */ g) => {
+			if (k === 0 || !g.length) return;
+			const had = next.get(k);
+			next.set(k, had ? b.union(had, g) : g);
+		};
+		add(s, levels.size ? b.difference(R, ...levels.values()) : R);
+		for (const [k, g] of levels) {
+			add(k, b.difference(g, R));
+			add(k + s, b.intersection(g, R));
+		}
+		levels = next;
+	}
+	return b.union(...levels.values());
+}
+
+/**
+ * A shape's filled area (outsides less holes).
+ *
+ * @param {import('../geometry/types.js').Shape} g The shape.
+ * @returns {number} The area.
+ */
+const filledArea = (g) => g.reduce((t, pg) => t + area(pg[0]) - pg.slice(1).reduce((h, r) => h + area(r), 0), 0);
+
+/**
+ * Non-zero fill from rings. When no two rings meet, each is classed on its own (as filledShape always read them).
+ * When any two cross or touch, the winding levels decide; the classed polygons are still returned when they cover the
+ * same ground (their exclusive-or has no area to speak of), so an outline that always read right keeps its exact
+ * polygons, and only a misread one (an outer whose longest edge lies inside another ring) changes.
+ *
+ * @param {import('../geometry/types.js').Ring[]} rs The rings.
+ * @param {import('../geometry/booleans.js').BooleanOps} b The booleans.
+ * @returns {import('../geometry/types.js').Shape} The filled shape.
+ */
+export function nonzeroFill(rs, b) {
+	if (!ringsMeet(rs)) return classedFill(rs, b);
+	const exact = windingFill(rs, b), classed = classedFill(rs, b);
+	return filledArea(b.xor(classed, exact)) <= 1e-9 * Math.max(1, filledArea(exact)) ? classed : exact;
+}