@reekon-tools/boldr-cad 0.1.0 → 1.0.0

package/src/view3d/camera.ts

@@ -0,0 +1,113 @@
+import type { V3 } from './mesh';
+
+/*
+  The 3D view's camera: it circles a point (the target), `dist` away from it, turned `az` round from due south (−y,
+  looking north: the plan the right way up) and raised `el` above level. Plan inches, z up. Plain numbers, so the
+  gestures' maths is tested without a screen:
+    - a drag turns it (the model follows the finger), up and down tips it;
+    - a pan slides it across the screen;
+    - a pinch or the wheel zooms toward the point under the fingers or the pointer;
+    - fit frames everything at the angle it's at; home is the corner view; top looks straight down.
+*/
+
+export interface Orbit { x: number; y: number; z: number; dist: number; az: number; el: number }
+
+/** The camera's vertical field of view (radians). */
+export const FOV = (45 * Math.PI) / 180;
+/** How low and high it can be tipped: just above level, and all but straight down. */
+export const EL_MIN = 0.03, EL_MAX = Math.PI / 2 - 1e-4;
+/** The corner view: from the south-west, looking down at about 35°. */
+export const HOME_AZ = -0.62, HOME_EL = 0.62;
+
+const clamp = (v: number, lo: number, hi: number) => Math.min(hi, Math.max(lo, v));
+
+/** Where the camera is. */
+export function eye(o: Orbit): V3 {
+  const ce = Math.cos(o.el);
+  return [o.x + o.dist * ce * Math.sin(o.az), o.y - o.dist * ce * Math.cos(o.az), o.z + o.dist * Math.sin(o.el)];
+}
+
+/** The camera's right, up and forward (toward the target), unit length. */
+export function axes(o: Orbit): { right: V3; up: V3; fwd: V3 } {
+  const ce = Math.cos(o.el), se = Math.sin(o.el), sa = Math.sin(o.az), ca = Math.cos(o.az);
+  return { right: [ca, sa, 0], up: [-se * sa, se * ca, ce], fwd: [-ce * sa, ce * ca, -se] };
+}
+
+/** A drag of dx, dy screen pixels on a view `viewH` tall: a full turn for a drag the view's height. */
+export function orbitBy(o: Orbit, dx: number, dy: number, viewH: number): Orbit {
+  const k = (2 * Math.PI) / Math.max(1, viewH);
+  return { ...o, az: o.az - dx * k, el: clamp(o.el + dy * k, EL_MIN, EL_MAX) };
+}
+
+/** World inches per screen pixel at the target, on a view `viewH` tall. */
+export const perPixel = (o: Orbit, viewH: number): number => (2 * o.dist * Math.tan(FOV / 2)) / Math.max(1, viewH);
+
+/** The model slid by dx, dy screen pixels (it follows the fingers). */
+export function panBy(o: Orbit, dx: number, dy: number, viewH: number): Orbit {
+  const { right, up } = axes(o), k = perPixel(o, viewH);
+  return { ...o, x: o.x - (right[0] * dx - up[0] * dy) * k, y: o.y - (right[1] * dx - up[1] * dy) * k, z: o.z - (right[2] * dx - up[2] * dy) * k };
+}
+
+/**
+ * Closer by `f` (under 1 zooms in) toward the screen point at nx, ny (−1 to 1 across and up the view, `aspect` wide):
+ * that point stays where it is on the screen. The distance stays within [lo, hi].
+ */
+export function zoomAt(o: Orbit, f: number, nx: number, ny: number, aspect: number, lo: number, hi: number): Orbit {
+  const dist = clamp(o.dist * f, lo, hi), k = 1 - dist / o.dist, t = Math.tan(FOV / 2);
+  const { right, up } = axes(o), ox = nx * t * aspect * o.dist * k, oy = ny * t * o.dist * k;
+  return { ...o, dist, x: o.x + right[0] * ox + up[0] * oy, y: o.y + right[1] * ox + up[1] * oy, z: o.z + right[2] * ox + up[2] * oy };
+}
+
+/**
+ * The part of the view to frame in, −1 to 1 across (x) and up (y): all of it, or what the chrome around it leaves.
+ */
+export interface Window3 { x0: number; x1: number; y0: number; y1: number }
+const WHOLE: Window3 = { x0: -1, x1: 1, y0: -1, y1: 1 };
+
+/**
+ * Framing box min–max at the angle `o` looks from, on a view `aspect` wide: everything in, with a margin, in the
+ * middle of `win`.
+ */
+export function fit(o: Orbit, min: V3, max: V3, aspect: number, win: Window3 = WHOLE): Orbit {
+  const c: V3 = [(min[0] + max[0]) / 2, (min[1] + max[1]) / 2, (min[2] + max[2]) / 2];
+  const { right, up, fwd } = axes(o), margin = 1.1, t = Math.tan(FOV / 2), a = Math.max(0.1, aspect);
+  const tv = (t * (win.y1 - win.y0)) / 2 / margin, th = (t * a * (win.x1 - win.x0)) / 2 / margin;
+  let dist = 1;
+  for (const x of [min[0], max[0]]) {
+    for (const y of [min[1], max[1]]) {
+      for (const z of [min[2], max[2]]) {
+        const p = [x - c[0], y - c[1], z - c[2]], dot = (v: V3) => p[0] * v[0] + p[1] * v[1] + p[2] * v[2];
+        // the camera is `dist` back along fwd from the middle: each corner must be within the view at its depth
+        const depth = dot(fwd);
+        dist = Math.max(dist, Math.abs(dot(right)) / th - depth, Math.abs(dot(up)) / tv - depth);
+      }
+    }
+  }
+  // the box's middle to the window's: the camera slides the other way
+  const sr = (-(win.x0 + win.x1) / 2) * t * a * dist, su = (-(win.y0 + win.y1) / 2) * t * dist;
+  return { ...o, x: c[0] + right[0] * sr + up[0] * su, y: c[1] + right[1] * sr + up[1] * su, z: c[2] + right[2] * sr + up[2] * su, dist };
+}
+
+/** The corner view of box min–max. */
+export const home = (min: V3, max: V3, aspect: number, win?: Window3): Orbit => fit({ x: 0, y: 0, z: 0, dist: 1, az: HOME_AZ, el: HOME_EL }, min, max, aspect, win);
+
+/** Straight down on box min–max, the plan the right way up. */
+export const topDown = (min: V3, max: V3, aspect: number, win?: Window3): Orbit => fit({ x: 0, y: 0, z: 0, dist: 1, az: 0, el: EL_MAX }, min, max, aspect, win);
+
+/**
+ * Part of the way (t from 0 to 1) from camera `a` to camera `b`, eased at both ends: turning the short way round,
+ * zooming evenly (by ratio, not inches), its target sliding between theirs. For the rail's views and a double tap, which
+ * glide there rather than jump, so it's still clear what's being looked at.
+ */
+export function between(a: Orbit, b: Orbit, t: number): Orbit {
+  if (t >= 1) return { ...b };
+  const k = t <= 0 ? 0 : t < 0.5 ? 4 * t * t * t : 1 - (-2 * t + 2) ** 3 / 2, mix = (p: number, q: number) => p + (q - p) * k;
+  const turn = Math.atan2(Math.sin(b.az - a.az), Math.cos(b.az - a.az));
+  return { x: mix(a.x, b.x), y: mix(a.y, b.y), z: mix(a.z, b.z), dist: a.dist * (b.dist / a.dist) ** k, az: a.az + turn * k, el: mix(a.el, b.el) };
+}
+
+/** How near and far the camera may zoom for a model of box min–max. */
+export function zoomLimits(min: V3, max: V3): [number, number] {
+  const size = Math.max(1, Math.hypot(max[0] - min[0], max[1] - min[1], max[2] - min[2]));
+  return [12, Math.max(240, size * 8)];
+}

package/src/view3d/fatLines.ts

@@ -0,0 +1,83 @@
+import { BufferAttribute, BufferGeometry, Color, DoubleSide, Mesh, ShaderMaterial, Vector2 } from 'three';
+
+/*
+  The 3D view's outlines, drawn the same width on the screen however near or far — each segment a thin quad turned to
+  face the screen, in a small shader. Only three.js's core: its add-on lines brought in a second copy of three.js
+  where a host resolves `three/examples/...` from this package's own install (BOLDR Web's dev server did), and two
+  copies in one scene draw nothing.
+*/
+
+const VERTEX = /* glsl */ `
+uniform vec2 resolution;
+uniform float linewidth;
+attribute vec3 other;
+attribute float side;
+void main() {
+  vec4 a = modelViewMatrix * vec4(position, 1.0);
+  vec4 b = modelViewMatrix * vec4(other, 1.0);
+  // an end behind the camera comes forward along the line to just inside the near plane (as three.js's LineMaterial)
+  float nearZ = -0.5 * projectionMatrix[3][2] / projectionMatrix[2][2];
+  if (a.z > nearZ && b.z < nearZ) a.xyz = mix(b.xyz, a.xyz, (nearZ - b.z) / (a.z - b.z));
+  if (b.z > nearZ && a.z < nearZ) b.xyz = mix(a.xyz, b.xyz, (nearZ - a.z) / (b.z - a.z));
+  vec4 ca = projectionMatrix * a;
+  vec4 cb = projectionMatrix * b;
+  vec2 d = (cb.xy / cb.w - ca.xy / ca.w) * resolution;
+  float len = length(d);
+  vec2 n = len > 1e-6 ? vec2(-d.y, d.x) / len : vec2(0.0, 1.0);
+  // half the width to each side (a pixel is 2 / resolution across clip space)
+  ca.xy += n * side * linewidth / resolution * ca.w;
+  gl_Position = ca;
+}`;
+
+const FRAGMENT = /* glsl */ `
+uniform vec3 color;
+void main() {
+  gl_FragColor = vec4(color, 1.0);
+}`;
+
+/** Outlines `width` points wide: set the view's size (points) with setLineView, and their colour with setLineColor. */
+export function lineMaterial(width: number): ShaderMaterial {
+  return new ShaderMaterial({
+    uniforms: { color: { value: new Color() }, resolution: { value: new Vector2(1, 1) }, linewidth: { value: width } },
+    vertexShader: VERTEX, fragmentShader: FRAGMENT, side: DoubleSide,
+  });
+}
+
+export const setLineView = (m: ShaderMaterial, w: number, h: number): void => { (m.uniforms.resolution.value as Vector2).set(w, h); };
+
+/**
+ * The outlines' colour, as written (#rrggbb): the shader draws it as it is, with none of three.js's colour management
+ * (which its own materials go through, both ways).
+ */
+export function setLineColor(m: ShaderMaterial, hex: string): void {
+  const v = parseInt(hex.slice(1), 16);
+  (m.uniforms.color.value as Color).setRGB(((v >> 16) & 255) / 255, ((v >> 8) & 255) / 255, (v & 255) / 255);
+}
+
+/** Line segments (x, y, z of each end, three.js's axes) as screen-facing quads for lineMaterial. */
+export function linesMesh(pts: ArrayLike<number>, m: ShaderMaterial): Mesh {
+  const n = Math.floor(pts.length / 6), pos = new Float32Array(n * 12), other = new Float32Array(n * 12), side = new Float32Array(n * 4);
+  const idx = n * 4 > 65535 ? new Uint32Array(n * 6) : new Uint16Array(n * 6);
+  for (let i = 0; i < n; i++) {
+    const s = i * 6, v = i * 12;
+    // two corners at each end, either side of the line: A, A, B, B — each looking along it to the other end
+    for (let k = 0; k < 3; k++) {
+      const a = pts[s + k], b = pts[s + 3 + k];
+      pos[v + k] = a; pos[v + 3 + k] = a; pos[v + 6 + k] = b; pos[v + 9 + k] = b;
+      other[v + k] = b; other[v + 3 + k] = b; other[v + 6 + k] = a; other[v + 9 + k] = a;
+    }
+    // (looking back along it from B, its sides swap: −1 there is the side +1 is at A)
+    side.set([1, -1, -1, 1], i * 4);
+    idx.set([i * 4, i * 4 + 1, i * 4 + 2, i * 4 + 1, i * 4 + 3, i * 4 + 2], i * 6);
+  }
+  const g = new BufferGeometry();
+  g.setAttribute('position', new BufferAttribute(pos, 3));
+  g.setAttribute('other', new BufferAttribute(other, 3));
+  g.setAttribute('side', new BufferAttribute(side, 1));
+  g.setIndex(new BufferAttribute(idx, 1));
+  const mesh = new Mesh(g, m);
+  // (drawn whatever the camera sees: the quads reach a little past the points)
+  mesh.frustumCulled = false;
+  mesh.matrixAutoUpdate = false;
+  return mesh;
+}

package/src/view3d/lines.ts

@@ -0,0 +1,258 @@
+import type { XY } from '../model/types';
+import { area, clipBand, clipHalf, tidy } from './poly';
+
+/*
+  The 3D view's outlines: a line wherever the walls' surface turns a corner — their tops' edges, the corners up their
+  sides, where they meet the floor, round each opening — and none where it runs on flat (across a mitre, where a
+  taller wall's corner carries on over a shorter one, between two walls of one height).
+
+  The walls seen from above are a set of cells that don't overlap (each wall's outline, cut across at its openings and
+  where a joint rises with a taller wall), each solid between some heights. A line runs:
+    - along a cell's edge, at a height where the solid on the two sides of that edge, just above and below it, doesn't
+      make a flat surface (a top, a side or the floor's level);
+    - up a corner of a cell, between heights where the solid around that corner point, seen from above, isn't a
+      straight edge (or nothing, or all round).
+*/
+
+/** A cell of the walls seen from above (counter-clockwise), and the heights it's solid between ([bottom, top], in order). */
+export interface Cell3 { poly: XY[]; iv: [number, number][] }
+
+const EPS = 1e-6, TAU = 2 * Math.PI;
+/** Corners straighter than this (radians) aren't drawn: a curved wall is drawn as gently angled stretches. */
+const STRAIGHT = (10 * Math.PI) / 180;
+
+/** Intervals in order, touching and overlapping ones joined, empty ones gone. */
+export function mergeIv(iv: [number, number][]): [number, number][] {
+  const s = iv.filter(([a, b]) => b - a > EPS).sort((p, q) => p[0] - q[0]), out: [number, number][] = [];
+  for (const [a, b] of s) {
+    const last = out[out.length - 1];
+    if (last && a <= last[1] + EPS) last[1] = Math.max(last[1], b);
+    else out.push([a, b]);
+  }
+  return out;
+}
+
+const solid = (iv: [number, number][], z: number) => iv.some(([a, b]) => z > a && z < b);
+
+/**
+ * Cell `c` split across a band (within `half` of the line through `o` along unit `u`): what's inside it solid on up to
+ * `top`, the parts either side as they were.
+ */
+export function raiseIn(c: Cell3, o: XY, u: XY, half: number, top: number): Cell3[] {
+  const inside = tidy(clipBand(c.poly, o, u, half));
+  if (inside.length < 3 || area(inside) < 1e-6) return [c];
+  const nx = -u.y, ny = u.x, k = nx * o.x + ny * o.y, hi = c.iv.length ? c.iv[c.iv.length - 1][1] : 0;
+  const out: Cell3[] = [{ poly: inside, iv: mergeIv([...c.iv, [hi, Math.max(hi, top)]]) }];
+  for (const side of [tidy(clipHalf(c.poly, -nx, -ny, -(k + half))), tidy(clipHalf(c.poly, nx, ny, k - half))]) {
+    if (side.length >= 3 && area(side) > 1e-6) out.push({ poly: side, iv: c.iv });
+  }
+  return out;
+}
+
+/**
+ * Whether there's an edge at a height along a cell's side, from what's solid just above and below it in the cell (ca,
+ * cb) and across the side (na, nb): not when nothing or everything is, nor when the solid's face there is flat.
+ */
+function crease(ca: boolean, cb: boolean, na: boolean, nb: boolean): boolean {
+  const n = +ca + +cb + +na + +nb;
+  if (n === 0 || n === 4) return false;
+  if (n === 2 && ((ca && cb) || (na && nb) || (cb && nb) || (ca && na))) return false;
+  return true;
+}
+
+/** Whether wedges of solid round a point (start angle and span each) make a corner there, seen from above. */
+function corner(ws: { start: number; span: number }[]): boolean {
+  const total = ws.reduce((s, w) => s + w.span, 0);
+  if (total < 1e-3 || total > TAU - 1e-2) return false;
+  // the wedges that run on into each other, joined
+  const s = ws.map(w => ({ start: ((w.start % TAU) + TAU) % TAU, span: w.span })).sort((p, q) => p.start - q.start), runs: { start: number; span: number }[] = [];
+  for (const w of s) {
+    const last = runs[runs.length - 1];
+    if (last && Math.abs(last.start + last.span - w.start) < 1e-3) last.span += w.span;
+    else runs.push({ ...w });
+  }
+  if (runs.length > 1 && Math.abs(runs[runs.length - 1].start + runs[runs.length - 1].span - TAU - runs[0].start) < 1e-3) {
+    const last = runs.pop()!;
+    runs[0] = { start: last.start, span: last.span + runs[0].span };
+  }
+  return !(runs.length === 1 && Math.abs(runs[0].span - Math.PI) < STRAIGHT);
+}
+
+const near = (p: XY, q: XY) => Math.abs(p.x - q.x) < 1e-5 && Math.abs(p.y - q.y) < 1e-5;
+
+/** How far round something to look for what's near it: a touch more than `near` allows. */
+const REACH = 2e-5;
+
+/**
+ * Items found by where they are: each is kept in the squares (`size` inches across) its box covers, so what might meet a
+ * box is found in the squares that box covers, not by asking everything. Asking every cell edge about every other made
+ * the outlines cost the square of the plan: most of the build on a big one, and a phone builds again as the cutaway
+ * turns.
+ */
+class Grid {
+  private readonly at = new Map<number, number[]>();
+  private readonly seen: Uint32Array;
+  private stamp = 0;
+  constructor(private readonly size: number, count: number) { this.seen = new Uint32Array(count); }
+
+  /** Item `id` (0 up to the count) covers x0 to x1, y0 to y1. */
+  add(id: number, x0: number, y0: number, x1: number, y1: number): void {
+    const s = this.size;
+    for (let i = Math.floor(x0 / s), i1 = Math.floor(x1 / s); i <= i1; i++) {
+      for (let j = Math.floor(y0 / s), j1 = Math.floor(y1 / s); j <= j1; j++) {
+        const k = square(i, j), list = this.at.get(k);
+        if (list) list.push(id);
+        else this.at.set(k, [id]);
+      }
+    }
+  }
+
+  /** The items whose boxes might meet x0 to x1, y0 to y1: each once, in the order of their ids (as a scan would meet them). */
+  near(x0: number, y0: number, x1: number, y1: number): number[] {
+    const s = this.size, out: number[] = [];
+    this.stamp++;
+    for (let i = Math.floor(x0 / s), i1 = Math.floor(x1 / s); i <= i1; i++) {
+      for (let j = Math.floor(y0 / s), j1 = Math.floor(y1 / s); j <= j1; j++) {
+        const list = this.at.get(square(i, j));
+        if (list) for (const id of list) if (this.seen[id] !== this.stamp) { this.seen[id] = this.stamp; out.push(id); }
+      }
+    }
+    return out.sort((p, q) => p - q);
+  }
+}
+
+/** A grid square's key (plans reach nowhere near 2^20 squares from the origin). */
+const square = (i: number, j: number) => (i + 1048576) * 2097152 + (j + 1048576);
+
+/** The box round points `ps`: x0, y0, x1, y1. */
+function boxOf(ps: XY[]): [number, number, number, number] {
+  let x0 = Infinity, y0 = Infinity, x1 = -Infinity, y1 = -Infinity;
+  for (const p of ps) { x0 = Math.min(x0, p.x); y0 = Math.min(y0, p.y); x1 = Math.max(x1, p.x); y1 = Math.max(y1, p.y); }
+  return [x0, y0, x1, y1];
+}
+
+/** Squares of the grids the outlines are worked out on: about a wall's length, and an inch for points. */
+const EDGE_SQ = 24, POINT_SQ = 1;
+
+/** The outlines of `cells`, as line segments: x, y, z of one end, then the other, for each. */
+export function cellLines(cells: Cell3[]): number[] {
+  const out: number[] = [];
+  const seg = (a: XY, za: number, b: XY, zb: number) => out.push(a.x, a.y, za, b.x, b.y, zb);
+  const edges = cells.flatMap((c, ci) => c.poly.map((a, i) => ({ ci, a, b: c.poly[(i + 1) % c.poly.length] })));
+  const byEdge = new Grid(EDGE_SQ, edges.length);
+  edges.forEach((e, i) => byEdge.add(i, Math.min(e.a.x, e.b.x), Math.min(e.a.y, e.b.y), Math.max(e.a.x, e.b.x), Math.max(e.a.y, e.b.y)));
+
+  // along the cells' sides
+  for (const e of edges) {
+    const dx = e.b.x - e.a.x, dy = e.b.y - e.a.y, L2 = dx * dx + dy * dy, L = Math.sqrt(L2);
+    if (L < EPS) continue;
+    // the stretches of it another cell's side runs along, the other way (the cell across it)
+    const shared: { t0: number; t1: number; ci: number }[] = [];
+    const x0 = Math.min(e.a.x, e.b.x) - REACH, y0 = Math.min(e.a.y, e.b.y) - REACH, x1 = Math.max(e.a.x, e.b.x) + REACH, y1 = Math.max(e.a.y, e.b.y) + REACH;
+    for (const k of byEdge.near(x0, y0, x1, y1)) {
+      const f = edges[k];
+      if (f.ci === e.ci) continue;
+      const off = (p: XY) => Math.abs((p.x - e.a.x) * dy - (p.y - e.a.y) * dx) / L;
+      if (off(f.a) > 1e-5 || off(f.b) > 1e-5 || (f.b.x - f.a.x) * dx + (f.b.y - f.a.y) * dy >= 0) continue;
+      const ta = ((f.a.x - e.a.x) * dx + (f.a.y - e.a.y) * dy) / L2, tb = ((f.b.x - e.a.x) * dx + (f.b.y - e.a.y) * dy) / L2;
+      const t0 = Math.max(0, Math.min(ta, tb)), t1 = Math.min(1, Math.max(ta, tb));
+      if (t1 - t0 > 1e-9) shared.push({ t0, t1, ci: f.ci });
+    }
+    const cuts = [...new Set([0, 1, ...shared.flatMap(s => [s.t0, s.t1])])].sort((p, q) => p - q);
+    const c = cells[e.ci];
+    for (let k = 0; k + 1 < cuts.length; k++) {
+      const t0 = cuts[k], t1 = cuts[k + 1];
+      if (t1 - t0 < 1e-9) continue;
+      const m = (t0 + t1) / 2, across = shared.find(s => s.t0 <= m && s.t1 >= m), n = across ? cells[across.ci] : null;
+      // (each stretch once: from the cell with nothing across it, or the first of the two)
+      if (across && across.ci < e.ci) continue;
+      const P = { x: e.a.x + dx * t0, y: e.a.y + dy * t0 }, Q = { x: e.a.x + dx * t1, y: e.a.y + dy * t1 };
+      const zs = [...new Set([...c.iv.flat(), ...(n ? n.iv.flat() : [])])];
+      for (const z of zs) {
+        const up = z + 1e-4, down = z - 1e-4;
+        if (crease(solid(c.iv, up), solid(c.iv, down), !!n && solid(n.iv, up), !!n && solid(n.iv, down))) seg(P, z, Q, z);
+      }
+    }
+  }
+
+  // up the corners
+  const points: XY[] = [], byPoint = new Grid(POINT_SQ, edges.length);
+  for (const c of cells) {
+    for (const p of c.poly) {
+      if (byPoint.near(p.x - REACH, p.y - REACH, p.x + REACH, p.y + REACH).some(k => near(p, points[k]))) continue;
+      byPoint.add(points.length, p.x, p.y, p.x, p.y);
+      points.push(p);
+    }
+  }
+  const byCell = new Grid(EDGE_SQ, cells.length);
+  cells.forEach((c, i) => { const [x0, y0, x1, y1] = boxOf(c.poly); byCell.add(i, x0, y0, x1, y1); });
+  for (const v of points) {
+    const ws: { start: number; span: number; iv: [number, number][] }[] = [];
+    for (const ci of byCell.near(v.x - REACH, v.y - REACH, v.x + REACH, v.y + REACH)) {
+      const c = cells[ci], n = c.poly.length, j = c.poly.findIndex(p => near(p, v));
+      if (j >= 0) {
+        const prev = c.poly[(j + n - 1) % n], next = c.poly[(j + 1) % n];
+        const start = Math.atan2(next.y - v.y, next.x - v.x), end = Math.atan2(prev.y - v.y, prev.x - v.x);
+        const span = (((end - start) % TAU) + TAU) % TAU;
+        if (span > 1e-6) ws.push({ start, span, iv: c.iv });
+        continue;
+      }
+      // (on one of its sides, not at a corner: a half turn of it)
+      for (let i = 0; i < n; i++) {
+        const a = c.poly[i], b = c.poly[(i + 1) % n], dx = b.x - a.x, dy = b.y - a.y, L2 = dx * dx + dy * dy;
+        if (L2 < EPS) continue;
+        const t = ((v.x - a.x) * dx + (v.y - a.y) * dy) / L2, off = Math.abs((v.x - a.x) * dy - (v.y - a.y) * dx) / Math.sqrt(L2);
+        if (off < 1e-5 && t > 1e-6 && t < 1 - 1e-6) { ws.push({ start: Math.atan2(dy, dx), span: Math.PI, iv: c.iv }); break; }
+      }
+    }
+    const zs = [...new Set(ws.flatMap(w => w.iv.flat()))].sort((p, q) => p - q);
+    let from: number | null = null;
+    for (let k = 0; k + 1 < zs.length; k++) {
+      const mid = (zs[k] + zs[k + 1]) / 2, on = corner(ws.filter(w => solid(w.iv, mid)));
+      if (on && from == null) from = zs[k];
+      if (!on && from != null) { seg(v, from, v, zs[k]); from = null; }
+    }
+    if (from != null) seg(v, from, v, zs[zs.length - 1]);
+  }
+  return simplify(out);
+}
+
+/** Lines closer together than this (inches) read as one: where many walls meet, only one is drawn. */
+const CLOSE = 1;
+
+/**
+ * Fewer lines where many walls meet: of corners up the walls standing closer than CLOSE, one; and none of the scraps
+ * of edge shorter than that between them.
+ */
+function simplify(segs: number[]): number[] {
+  const out: number[] = [], up: number[][] = [];
+  for (let i = 0; i < segs.length; i += 6) {
+    const [ax, ay, az, bx, by, bz] = segs.slice(i, i + 6);
+    if (Math.abs(ax - bx) < 1e-6 && Math.abs(ay - by) < 1e-6) { up.push([ax, ay, Math.min(az, bz), Math.max(az, bz)]); continue; }
+    if (Math.abs(az - bz) < 1e-6 && Math.hypot(bx - ax, by - ay) < CLOSE / 2) continue;
+    out.push(ax, ay, az, bx, by, bz);
+  }
+  // the longest first: a short corner beside a longer one is the one let go
+  up.sort((p, q) => q[3] - q[2] - (p[3] - p[2]));
+  const kept: number[][] = [], byKept = new Grid(CLOSE, up.length);
+  for (const v of up) {
+    const twin = byKept.near(v[0] - CLOSE, v[1] - CLOSE, v[0] + CLOSE, v[1] + CLOSE)
+      .some(i => { const k = kept[i]; return Math.hypot(k[0] - v[0], k[1] - v[1]) < CLOSE && Math.min(k[3], v[3]) - Math.max(k[2], v[2]) > 0.5 * (v[3] - v[2]); });
+    if (twin) continue;
+    byKept.add(kept.length, v[0], v[1], v[0], v[1]);
+    kept.push(v);
+    out.push(v[0], v[1], v[2], v[0], v[1], v[3]);
+  }
+  return out;
+}
+
+/** A box's twelve edges (a cabinet: `poly` its four corners), from z0 to z1, and round it at each of `rings`. */
+export function boxLines(poly: XY[], z0: number, z1: number, rings: number[] = []): number[] {
+  const out: number[] = [];
+  for (let i = 0; i < poly.length; i++) {
+    const a = poly[i], b = poly[(i + 1) % poly.length];
+    for (const z of [z0, z1, ...rings]) out.push(a.x, a.y, z, b.x, b.y, z);
+    out.push(a.x, a.y, z0, a.x, a.y, z1);
+  }
+  return out;
+}

package/src/view3d/mesh.ts

@@ -0,0 +1,111 @@
+import type { XY } from '../model/types';
+import { triangulate } from './poly';
+
+/** What a surface is drawn with. 'pick': not drawn, only there to be tapped (a doorway). */
+export type Mat3 = 'wall' | 'top' | 'floor' | 'cab' | 'counter' | 'glass' | 'door' | 'frame' | 'pick';
+export const MATS: readonly Mat3[] = ['wall', 'top', 'floor', 'cab', 'counter', 'glass', 'door', 'frame', 'pick'];
+
+/** What a part is, as a tap picks it: a straight wall, a curved one, a space's floor, a cabinet, a door or window. */
+export type PartKind = 'wall' | 'curve' | 'floor' | 'cab' | 'opening';
+
+/**
+ * One thing in the 3D view, as triangles grouped by what they're drawn with. Plan inches: x and y as on the plan, z up
+ * from the floor.
+ */
+export interface Part3 {
+  kind: PartKind;
+  id: string;
+  /** x, y, z of each vertex */
+  pos: number[];
+  /** the surface's normal at each vertex */
+  nrm: number[];
+  /** triangles, as vertex index triples, for each material */
+  tris: Partial<Record<Mat3, number[]>>;
+}
+
+export type V3 = [number, number, number];
+
+/** Makes a part's triangles: flat faces, polygons laid flat, and upright prisms. */
+export class PartBuilder implements Part3 {
+  pos: number[] = [];
+  nrm: number[] = [];
+  tris: Partial<Record<Mat3, number[]>> = {};
+  constructor(readonly kind: PartKind, readonly id: string) {}
+
+  private vert(p: V3, n: V3): number {
+    this.pos.push(p[0], p[1], p[2]);
+    this.nrm.push(n[0], n[1], n[2]);
+    return this.pos.length / 3 - 1;
+  }
+
+  private tri(mat: Mat3, a: number, b: number, c: number): void {
+    (this.tris[mat] ??= []).push(a, b, c);
+  }
+
+  /**
+   * A flat four-cornered face that faces `n`: its corners in order around it, either way round (it's turned to face
+   * n). `ns`: a normal for each corner instead, for a curved surface shaded smooth.
+   */
+  quad(mat: Mat3, a: V3, b: V3, c: V3, d: V3, n: V3, ns?: [V3, V3, V3, V3]): void {
+    const ux = b[0] - a[0], uy = b[1] - a[1], uz = b[2] - a[2], vx = d[0] - a[0], vy = d[1] - a[1], vz = d[2] - a[2];
+    const cx = uy * vz - uz * vy, cy = uz * vx - ux * vz, cz = ux * vy - uy * vx;
+    let pts: V3[] = [a, b, c, d], nn: V3[] = ns ?? [n, n, n, n];
+    // (counter-clockwise, seen from where it faces)
+    if (cx * n[0] + cy * n[1] + cz * n[2] < 0) { pts = [a, d, c, b]; nn = [nn[0], nn[3], nn[2], nn[1]]; }
+    const i = pts.map((p, k) => this.vert(p, nn[k]));
+    this.tri(mat, i[0], i[1], i[2]);
+    this.tri(mat, i[0], i[2], i[3]);
+  }
+
+  /**
+   * A flat convex face with corners `pts` in order round it (some may lie along its sides: the corners of the faces
+   * beside it, so the two meet without a seam), facing n: triangles fanned from its middle.
+   */
+  fan(mat: Mat3, pts: V3[], n: V3): void {
+    if (pts.length < 3) return;
+    const c: V3 = [0, 0, 0];
+    let nx = 0, ny = 0, nz = 0;
+    for (let i = 0; i < pts.length; i++) {
+      const a = pts[i], b = pts[(i + 1) % pts.length];
+      for (let k = 0; k < 3; k++) c[k] += a[k] / pts.length;
+      // (the way round the corners run: Newell's normal)
+      nx += (a[1] - b[1]) * (a[2] + b[2]); ny += (a[2] - b[2]) * (a[0] + b[0]); nz += (a[0] - b[0]) * (a[1] + b[1]);
+    }
+    const ring = nx * n[0] + ny * n[1] + nz * n[2] < 0 ? [...pts].reverse() : pts;
+    const ic = this.vert(c, n), is = ring.map(p => this.vert(p, n));
+    for (let i = 0; i < is.length; i++) this.tri(mat, ic, is[i], is[(i + 1) % is.length]);
+  }
+
+  /** Polygon `poly` (counter-clockwise) laid flat at height z, facing up or down. */
+  cap(mat: Mat3, poly: XY[], z: number, up = true): void {
+    const t = triangulate(poly);
+    if (!t.length) return;
+    const n: V3 = [0, 0, up ? 1 : -1], base = this.pos.length / 3;
+    for (const p of poly) this.vert([p.x, p.y, z], n);
+    for (const [a, b, c] of t) {
+      if (up) this.tri(mat, base + a, base + b, base + c);
+      else this.tri(mat, base + a, base + c, base + b);
+    }
+  }
+
+  /**
+   * An upright prism: polygon `poly` (counter-clockwise) from z0 up to z1 — its sides, its top (`top`: what it's
+   * drawn with; null, no top) and its underside (by default only when it's off the floor).
+   */
+  prism(poly: XY[], z0: number, z1: number, side: Mat3, top: Mat3 | null, bottom: Mat3 | null = z0 > 1e-6 ? side : null): void {
+    if (z1 - z0 < 1e-6 || poly.length < 3) return;
+    for (let i = 0, n = poly.length; i < n; i++) {
+      const a = poly[i], b = poly[(i + 1) % n], dx = b.x - a.x, dy = b.y - a.y, L = Math.hypot(dx, dy);
+      if (L < 1e-9) continue;
+      // outward is to the right of a counter-clockwise outline
+      this.quad(side, [a.x, a.y, z0], [b.x, b.y, z0], [b.x, b.y, z1], [a.x, a.y, z1], [dy / L, -dx / L, 0]);
+    }
+    if (top) this.cap(top, poly, z1, true);
+    if (bottom) this.cap(bottom, poly, z0, false);
+  }
+
+  /** Whether nothing was made. */
+  get empty(): boolean {
+    return !this.pos.length;
+  }
+}

package/src/view3d/poly.ts

@@ -0,0 +1,104 @@
+import type { XY } from '../model/types';
+
+/*
+  Flat polygons for the 3D view: clipping one to a half-plane (a wall cut at a door's edge, a wall's share of a corner)
+  and cutting one into triangles (a floor, a wall's top). Plan inches, y up; counter-clockwise is positive.
+*/
+
+/** Points closer than this (inches) are the same point. */
+const EPS = 1e-6;
+
+/** Signed area: positive when the points run counter-clockwise. */
+export function area(p: XY[]): number {
+  let a = 0;
+  for (let i = 0, n = p.length; i < n; i++) {
+    const q = p[i], r = p[(i + 1) % n];
+    a += q.x * r.y - r.x * q.y;
+  }
+  return a / 2;
+}
+
+/** The points running counter-clockwise, without repeats (a point the same as the one before it). */
+export function tidy(p: XY[]): XY[] {
+  const out: XY[] = [];
+  for (const q of p) {
+    const last = out[out.length - 1];
+    if (!last || Math.abs(last.x - q.x) > EPS || Math.abs(last.y - q.y) > EPS) out.push({ x: q.x, y: q.y });
+  }
+  while (out.length > 1 && Math.abs(out[0].x - out[out.length - 1].x) <= EPS && Math.abs(out[0].y - out[out.length - 1].y) <= EPS) out.pop();
+  return area(out) < 0 ? out.reverse() : out;
+}
+
+/** The part of `p` where n · point ≤ c (one side of a line), as a polygon — empty when none of it is. */
+export function clipHalf(p: XY[], nx: number, ny: number, c: number): XY[] {
+  const out: XY[] = [];
+  for (let i = 0, n = p.length; i < n; i++) {
+    const a = p[i], b = p[(i + 1) % n];
+    const da = nx * a.x + ny * a.y - c, db = nx * b.x + ny * b.y - c;
+    if (da <= 0) out.push(a);
+    if ((da < 0 && db > 0) || (da > 0 && db < 0)) {
+      const t = da / (da - db);
+      out.push({ x: a.x + (b.x - a.x) * t, y: a.y + (b.y - a.y) * t });
+    }
+  }
+  return out;
+}
+
+/** The part of `p` within `half` of the line through `o` along unit `u` (a wall's band, its thickness wide). */
+export function clipBand(p: XY[], o: XY, u: XY, half: number): XY[] {
+  const nx = -u.y, ny = u.x, c = nx * o.x + ny * o.y;
+  return clipHalf(clipHalf(p, nx, ny, c + half), -nx, -ny, -c + half);
+}
+
+/** The part of `p` from `s0` to `s1` along unit `u` measured from `o` (a wall between two cuts across it). */
+export function clipSpan(p: XY[], o: XY, u: XY, s0: number, s1: number): XY[] {
+  const c = u.x * o.x + u.y * o.y;
+  return clipHalf(clipHalf(p, u.x, u.y, c + s1), -u.x, -u.y, -(c + s0));
+}
+
+/** Whether `p` is inside triangle a b c (counter-clockwise), off its edges. */
+function inside(p: XY, a: XY, b: XY, c: XY): boolean {
+  const s = (q: XY, r: XY) => (r.x - q.x) * (p.y - q.y) - (r.y - q.y) * (p.x - q.x);
+  return s(a, b) > EPS && s(b, c) > EPS && s(c, a) > EPS;
+}
+
+/**
+ * Triangles covering polygon `p` (counter-clockwise, no repeats — see tidy), as index triples into it, each
+ * counter-clockwise. Ear clipping: a floor's outline is a simple polygon, convex or not.
+ */
+export function triangulate(p: XY[]): [number, number, number][] {
+  const idx = p.map((_, i) => i), tris: [number, number, number][] = [];
+  const cross = (i0: number, i1: number, i2: number) => {
+    const a = p[i0], b = p[i1], c = p[i2];
+    return (b.x - a.x) * (c.y - a.y) - (b.y - a.y) * (c.x - a.x);
+  };
+  let guard = 0;
+  while (idx.length > 3 && guard++ < 100000) {
+    let cut = false;
+    for (let i = 0; i < idx.length; i++) {
+      const i0 = idx[(i + idx.length - 1) % idx.length], i1 = idx[i], i2 = idx[(i + 1) % idx.length];
+      if (cross(i0, i1, i2) <= EPS) continue;
+      let blocked = false;
+      for (const j of idx) {
+        if (j !== i0 && j !== i1 && j !== i2 && inside(p[j], p[i0], p[i1], p[i2])) { blocked = true; break; }
+      }
+      if (blocked) continue;
+      tris.push([i0, i1, i2]);
+      idx.splice(i, 1);
+      cut = true;
+      break;
+    }
+    if (cut) continue;
+    // no ear left (points in a row, or rounding): drop the flattest corner, keeping it if it covers anything
+    let best = 0, flat = Infinity;
+    for (let i = 0; i < idx.length; i++) {
+      const c = Math.abs(cross(idx[(i + idx.length - 1) % idx.length], idx[i], idx[(i + 1) % idx.length]));
+      if (c < flat) { flat = c; best = i; }
+    }
+    const i0 = idx[(best + idx.length - 1) % idx.length], i1 = idx[best], i2 = idx[(best + 1) % idx.length];
+    if (cross(i0, i1, i2) > EPS) tris.push([i0, i1, i2]);
+    idx.splice(best, 1);
+  }
+  if (idx.length === 3 && cross(idx[0], idx[1], idx[2]) > EPS) tris.push([idx[0], idx[1], idx[2]]);
+  return tris;
+}