@a2f0/skyline 0.0.0-stage → 0.1.2

package/site/models/millennium-park-plaza-geographic.js

@@ -0,0 +1,103 @@
+import * as THREE from "../vendor/three-r186.js";
+import { createBuilder, polygonOf } from "./building-kit.js";
+import { chainSkin, chainsOf, orient, paintedSlab, planOf, turnsAt } from "./facade-grid.js";
+// Millennium Park Plaza, 151–155 North Michigan Avenue (Reinheimer & Associates, 1982, as
+// Doral Plaza): the geographic layout's model, on the mapped outline 127107026. The drawing
+// shows it in front of Michigan Plaza, where the geographic camera names it; the original
+// layout has no model of it.
+//
+// A 90 m concrete slab along Michigan Avenue, its south end chamfered at both corners:
+// offices on the first seven floors and apartments above. The narrow ends are solid wall
+// but for four slender window strips, each topped by a small window on the top floor; the
+// long faces carry punched windows between piers. Floor levels are estimated from the
+// published 40 storeys and 121.9 m; see docs/millennium-park-plaza-reference.md. Units are
+// meters; +x is east, +z is south.
+export const millenniumParkPlazaLevels = Object.freeze({
+    lobby: 4.4, // the second floor, over the lobby
+    office: 3.7, // floors 2 to 8
+    apartment: 2.8, // floors 8 to 41, the roof's
+    top: 121.9, // the parapet's top, the published architectural height
+});
+const h = millenniumParkPlazaLevels;
+// Each floor's level, from the second to a 41st at the top floor's ceiling.
+const floor = (n) => (n <= 8 ? h.lobby + (n - 2) * h.office : h.lobby + 6 * h.office + (n - 8) * h.apartment);
+const color = (hex) => new THREE.Color(hex);
+const glassTones = [0x2e2e2e, 0x323232, 0x363636, 0x3a3a3a].map(color);
+const litGlass = color(0x727272), dimGlass = color(0x484848);
+const concrete = color(0x666666), strip = color(0x3e3e3e), lobby = color(0x3a3a3a), core = color(0x262626), roofing = color(0x3e3e3e);
+function paneColor(row, bay, wall) {
+    const hash = (Math.imul(row + 23, 0x9e3779b1) ^ Math.imul(bay + 47, 0x85ebca77) ^ Math.imul(wall + 37, 0xc2b2ae3d)) >>> 0;
+    const value = hash % 101;
+    if (value < 4)
+        return litGlass;
+    if (value < 8)
+        return dimGlass;
+    return glassTones[value % glassTones.length];
+}
+const rows = [{ lo: 0.25, hi: floor(2) - 0.3, kind: "lobby", floor: 1 }];
+for (let n = 2; n <= 40; n += 1) {
+    rows.push({ lo: floor(n) - 0.3, hi: floor(n) + 0.6, kind: "spandrel", floor: n });
+    rows.push({ lo: floor(n) + 0.6, hi: floor(n + 1) - 0.3, kind: "glass", floor: n });
+}
+rows.push({ lo: floor(41) - 0.3, hi: h.top, kind: "spandrel", floor: 41 });
+const heights = [rows[0].lo, ...rows.map((row) => row.hi)];
+export function createMillenniumParkPlazaGeographicBuilding(record, projectPlan, offset) {
+    const kit = createBuilder(record.name, record.id);
+    const shell = kit.batch("Millennium Park Plaza · shell", kit.material(0xffffff, { vertexColors: true }));
+    const wall = kit.batch("Millennium Park Plaza · walls and windows", kit.material(0xffffff, { vertexColors: true }));
+    const corners = orient(polygonOf(projectPlan(record.footprint.coordinates)));
+    // The slab, its walls the shell's dark core.
+    planOf(corners).forEach((run) => {
+        const a = run.at(0), b = run.at(run.length), n = run.normal(0);
+        kit.quad(shell, [[a[0], 0, a[1]], [b[0], 0, b[1]], [b[0], h.top, b[1]], [a[0], h.top, a[1]]], [[n[0], 0, n[1]]], core);
+    });
+    paintedSlab(kit, shell, corners, 0, false, roofing);
+    paintedSlab(kit, shell, corners, h.top, true, roofing);
+    // Every wall's skin, one box a chain, held 2 cm clear of its ends. A narrow end carries
+    // four window strips, 1.25 m wide and symmetrical about its middle, from the eighth floor,
+    // the first of apartments, with the top floor's window standing apart over each; below,
+    // the offices' windows run across it. A long face has a punched window every 3 m between
+    // 0.8 m piers. The chamfers are solid.
+    const plan = planOf(corners);
+    chainsOf(plan).forEach((chain, index) => {
+        const first = chain.runs[0], last = chain.runs.at(-1);
+        const s0 = turnsAt(plan, first)[0] > 0 ? 0.09 : 0.02, s1 = chain.length - (turnsAt(plan, last)[1] > 0 ? 0.09 : 0.02);
+        const end = chain.length > 12 && chain.length < 30, long = chain.length >= 30;
+        let columns, isWindow;
+        if (end) {
+            const middle = chain.length / 2, centres = [-4.1, -1.6, 1.6, 4.1].map((d) => middle + d);
+            columns = [0, ...centres.flatMap((c) => [c - 0.625, c + 0.625]), chain.length];
+            isWindow = (bay) => bay % 2 === 0 && bay >= 2 && bay <= 8;
+        }
+        else if (long) {
+            const bays = Math.round(chain.length / 3);
+            columns = [0, ...Array.from({ length: bays }, (_, i) => [chain.length * i / bays + 0.4, chain.length * (i + 1) / bays - 0.4]).flat(), chain.length];
+            isWindow = (bay) => bay % 2 === 0 && bay >= 2 && bay <= 2 * bays;
+        }
+        else {
+            columns = [0, chain.length];
+            isWindow = () => false;
+        }
+        chainSkin(kit, wall, plan, chain, 0, chain.runs.length - 1, s0, s1, columns, heights, 0.02, 0.07, (bay, r) => {
+            const row = rows[r];
+            if (row.kind === "lobby")
+                return lobby;
+            const office = row.floor < 8;
+            if (end && !office && isWindow(bay)) {
+                if (row.kind === "glass")
+                    return paneColor(row.floor, bay, index);
+                return row.floor >= 40 ? concrete : strip;
+            }
+            if (row.kind === "spandrel")
+                return concrete;
+            if (end)
+                return office ? paneColor(row.floor, bay, index) : concrete;
+            return isWindow(bay) ? paneColor(row.floor, bay, index) : concrete;
+        }, concrete);
+    });
+    const model = kit.finish({ height: h.top, outlines: [shell], opacity: 0.16 });
+    model.building.position.set(offset[0], 0, offset[1]);
+    model.building.userData["geography"] = record;
+    model.building.userData["geographicDetail"] = { levels: h, source: "docs/millennium-park-plaza-reference.md" };
+    return model;
+}

package/site/models/monroe-geographic.js

@@ -0,0 +1,177 @@
+import * as THREE from "../vendor/three-r186.js";
+import { createBuilder, polygonOf } from "./building-kit.js";
+import { chainSkin, chainsOf, orient, paintedSlab, planOf, turnsAt } from "./facade-grid.js";
+// The Monroe Building, 104 South Michigan Avenue (Holabird & Roche, 1912): the geographic
+// layout's model, on the mapped outline 145498713. The original layout has no model of it;
+// the drawing shows it left of the University Club, across Monroe Street.
+//
+// Twelve storeys of terracotta over two of granite, in bays of paired windows, with a belt
+// course over the twelfth floor and a cornice under a steep gable roof that holds two more
+// floors, sixteen in all, its gable facing Michigan with small arched windows. The ridge is
+// the Skyscraper Center's 69 m. The drawn ridge reads 67.7 m, so heights read on the drawing
+// are scaled to meet it; see docs/monroe-reference.md. Units are meters; +x is east, +z is
+// south.
+const drawn = (height) => height * 69 / 67.7;
+export const monroeLevels = Object.freeze({
+    granite: drawn(14.5), // the two granite storeys, under the third floor
+    belt: drawn(49.9), // the belt course over the twelfth floor
+    beltTop: drawn(51.1),
+    cornice: drawn(56.9), // the cornice under the roof
+    eaves: drawn(58.2), // the roof's foot and the gable's
+    ridge: 69, // the ridge, the published height
+});
+const h = monroeLevels;
+// The skins' colours: the window tones, and the terracotta, granite and bands, which no
+// window shares.
+export const monroePalette = Object.freeze({ glass: [0x4e4e4e, 0x525252, 0x565656, 0x5a5a5a], lit: 0x929292, dim: 0x484848, terracotta: 0xb2b2b2, granite: 0x9a9a9a, band: 0xc2c2c2 });
+const palette = monroePalette;
+const color = (hex) => new THREE.Color(hex);
+const glassTones = palette.glass.map(color);
+const litGlass = color(palette.lit), dimGlass = color(palette.dim);
+const terracotta = color(palette.terracotta), granite = color(palette.granite), band = color(palette.band);
+const core = color(0x2e2e2e), roofing = color(0x303030), flat = color(0x484848);
+function paneColor(row, bay, wall) {
+    const hash = (Math.imul(row + 47, 0x9e3779b1) ^ Math.imul(bay + 73, 0x85ebca77) ^ Math.imul(wall + 61, 0xc2b2ae3d)) >>> 0;
+    const value = hash % 101;
+    if (value < 4)
+        return litGlass;
+    if (value < 8)
+        return dimGlass;
+    return glassTones[value % glassTones.length];
+}
+const rows = [
+    { lo: 0.25, hi: drawn(1), kind: "granite", floor: 1 },
+    { lo: drawn(1), hi: drawn(7), kind: "glass", floor: 1 },
+    { lo: drawn(7), hi: drawn(8.5), kind: "granite", floor: 2 },
+    { lo: drawn(8.5), hi: drawn(13.5), kind: "glass", floor: 2 },
+    { lo: drawn(13.5), hi: h.granite, kind: "granite", floor: 2 },
+];
+const bases = [...Array.from({ length: 10 }, (_, k) => 14.5 + k * 3.55), 50.3, 53.7];
+bases.forEach((base, k) => {
+    const floor = k + 3, below = rows.at(-1).hi;
+    if (floor === 13) {
+        rows.push({ lo: below, hi: h.belt, kind: "wall", floor });
+        rows.push({ lo: h.belt, hi: h.beltTop, kind: "band", floor });
+        rows.push({ lo: h.beltTop, hi: drawn(base + 0.9), kind: "wall", floor });
+    }
+    else
+        rows.push({ lo: below, hi: drawn(base + 0.9), kind: "wall", floor });
+    rows.push({ lo: drawn(base + 0.9), hi: drawn(base + 3), kind: "glass", floor });
+});
+rows.push({ lo: rows.at(-1).hi, hi: h.cornice, kind: "wall", floor: 14 });
+rows.push({ lo: h.cornice, hi: h.eaves, kind: "band", floor: 14 });
+export function createMonroeGeographicBuilding(record, projectPlan, offset) {
+    const kit = createBuilder(record.name, record.id);
+    const shell = kit.batch("Monroe Building · shell", kit.material(0xffffff, { vertexColors: true }));
+    const wall = kit.batch("Monroe Building · terracotta and windows", kit.material(0xffffff, { vertexColors: true }));
+    const attic = kit.batch("Monroe Building · attic windows", kit.material(0x505050));
+    const lot = orient(polygonOf(projectPlan(record.footprint.coordinates)));
+    // The lot's south-east corner, with its south wall running west and its Michigan front
+    // north to Monroe.
+    const corner = lot.reduce((best, p) => (p[0] + p[1] > best[0] + best[1] ? p : best));
+    const northEast = lot.reduce((best, p) => (p[0] - p[1] > best[0] - best[1] ? p : best));
+    const neighbours = [lot[(lot.indexOf(corner) + 1) % lot.length], lot[(lot.indexOf(corner) + lot.length - 1) % lot.length]];
+    const unit = (p) => { const d = Math.hypot(p[0] - corner[0], p[1] - corner[1]); return [(p[0] - corner[0]) / d, (p[1] - corner[1]) / d]; };
+    const west = unit(neighbours[0][0] < neighbours[1][0] ? neighbours[0] : neighbours[1]), north = unit(northEast);
+    const at = (a, b) => [corner[0] + west[0] * a + north[0] * b, corner[1] + west[1] * a + north[1] * b];
+    // The inverse of `at`: a point's distances along the south wall and the Michigan front,
+    // which meet a little off square.
+    const skew = west[0] * north[1] - west[1] * north[0];
+    const inLot = (p) => {
+        const [x, z] = [p[0] - corner[0], p[1] - corner[1]];
+        return [(x * north[1] - z * north[0]) / skew, (west[0] * z - west[1] * x) / skew];
+    };
+    const rect = (a0, a1, b0, b1) => orient([at(a0, b0), at(a1, b0), at(a1, b1), at(a0, b1)]);
+    const lift = ([x, z], y) => [x, y, z];
+    // The lot's four corners, in lot coordinates: its north and south walls are a little out
+    // of parallel.
+    const inPlan = lot.map(inLot), extreme = (score) => inPlan.reduce((best, p) => (score(p) > score(best) ? p : best));
+    const [southWest, northWest, northEastIn] = [extreme(([a, b]) => a - b), extreme(([a, b]) => a + b), inLot(northEast)];
+    // The walls to the roof's foot.
+    planOf(lot).forEach((run) => {
+        const a = run.at(0), b = run.at(run.length), n = run.normal(0);
+        kit.quad(shell, [[a[0], 0, a[1]], [b[0], 0, b[1]], [b[0], h.eaves, b[1]], [a[0], h.eaves, a[1]]], [[n[0], 0, n[1]]], core);
+    });
+    paintedSlab(kit, shell, lot, 0, false, flat);
+    paintedSlab(kit, shell, lot, h.eaves, true, flat);
+    // The roof: a closed solid 5 cm inside the walls, so that no face lies in theirs, from a
+    // foot 10 cm inside the block to a ridge between its gables' middles; its gables are
+    // terracotta, and its slopes roofing, each in two triangles since the lot is out of square.
+    const inset = (a, b, da, db) => at(a + da * 0.05, b + db * 0.05);
+    const roofCorners = [inset(0, 0, 1, 1), inset(southWest[0], southWest[1], -1, 1), inset(northWest[0], northWest[1], -1, -1), inset(0, northEastIn[1], 1, -1)];
+    const [se, sw, nw, ne] = roofCorners, foot = h.eaves - 0.1;
+    const footprint = orient([...roofCorners]);
+    planOf(footprint).forEach((run) => {
+        const p = run.at(0), q = run.at(run.length), n = run.normal(0);
+        kit.quad(shell, [lift(p, foot), lift(q, foot), lift(q, h.eaves), lift(p, h.eaves)], [[n[0], 0, n[1]]], core);
+    });
+    paintedSlab(kit, shell, footprint, foot, false, flat);
+    const halfway = (p, q) => [(p[0] + q[0]) / 2, (p[1] + q[1]) / 2];
+    const [eastRidge, westRidge] = [lift(halfway(se, ne), h.ridge), lift(halfway(sw, nw), h.ridge)];
+    const centre = lift(halfway(halfway(se, nw), halfway(sw, ne)), (h.eaves + h.ridge) / 2);
+    // Each face's outward normal, from its points and the roof's middle.
+    const face = (points, paint) => {
+        const [a, b, c] = points;
+        const n = new THREE.Vector3(b[0] - a[0], b[1] - a[1], b[2] - a[2]).cross(new THREE.Vector3(c[0] - a[0], c[1] - a[1], c[2] - a[2])).normalize();
+        const mid = [0, 1, 2].map((k) => (a[k] + b[k] + c[k]) / 3);
+        if (n.x * (mid[0] - centre[0]) + n.y * (mid[1] - centre[1]) + n.z * (mid[2] - centre[2]) < 0)
+            n.negate();
+        const normal = [n.x, n.y, n.z];
+        kit.triangle(shell, points, [normal, normal, normal], paint);
+    };
+    const eave = (p) => lift(p, h.eaves);
+    face([eave(se), eave(sw), westRidge], roofing);
+    face([eave(se), westRidge, eastRidge], roofing);
+    face([eave(ne), eave(nw), westRidge], roofing);
+    face([eave(ne), westRidge, eastRidge], roofing);
+    face([eave(se), eave(ne), eastRidge], terracotta);
+    face([eave(sw), eave(nw), westRidge], terracotta);
+    const middle = (inLot(halfway(se, ne))[1]);
+    // A wall's skin, one box to a chain the `keep` test accepts, held 2 cm clear of its ends
+    // or 9 cm where the outline turns in, with paired windows `pairs` along it from its start;
+    // a `plain` wall carries neither windows nor bands.
+    const skin = (seed, keep, pairs, plain = false) => {
+        const plan = planOf(lot), heights = [rows[0].lo, ...rows.map((row) => row.hi)];
+        chainsOf(plan).forEach((chain, index) => {
+            if (!chain.runs.every((run) => keep(plan[run])))
+                return;
+            const first = chain.runs[0], last = chain.runs.at(-1);
+            const s0 = turnsAt(plan, first)[0] > 0 ? 0.09 : 0.02, s1 = chain.length - (turnsAt(plan, last)[1] > 0 ? 0.09 : 0.02);
+            // Each pair: two windows 1.3 m wide either side of a 35 cm mullion.
+            const centres = pairs(chain.length, plan[first].at(0), plan[last].at(plan[last].length)).filter((c) => c - 1.475 > 0.1 && c + 1.475 < chain.length - 0.1).sort((p, q) => p - q);
+            const columns = [0, ...centres.flatMap((c) => [c - 1.475, c - 0.175, c + 0.175, c + 1.475]), chain.length];
+            chainSkin(kit, wall, plan, chain, 0, chain.runs.length - 1, s0, s1, columns, heights, 0.02, 0.07, (bay, r) => {
+                const row = rows[r], window = bay <= 4 * centres.length && (bay % 4 === 2 || bay % 4 === 0);
+                if (row.kind === "band")
+                    return plain ? terracotta : band;
+                if (row.kind === "glass" && window)
+                    return paneColor(row.floor, bay, seed * 8 + index);
+                return row.kind === "granite" || row.lo < h.granite ? granite : terracotta;
+            }, terracotta);
+        });
+    };
+    // Bays 5.3 m apart centred on each wall, as the drawing's five on Michigan.
+    const bays = (length) => { const count = Math.max(1, Math.round(length / 5.3)); return Array.from({ length: count }, (_, k) => length * (k + 0.5) / count); };
+    const facing = (x, z) => (run) => run.normal(0)[0] * x + run.normal(0)[1] * z > 0.9;
+    // The south wall, shared with the taller MacLean Center, stays blank.
+    skin(0, (run) => !facing(0, 1)(run), bays);
+    skin(1, facing(0, 1), () => [], true);
+    // The gable's small arched windows, dark panels 1 m wide standing 3 cm proud of it, 5 mm
+    // clear, their heads stepped to the middle half for the arch's last 30 cm as drawn and set
+    // 5 mm back so that no face lies in the panel's: three pairs 2.3 m apart in the lower row,
+    // one pair in the middle above.
+    const window = (b, lo, hi) => {
+        kit.prism(attic, planOf(rect(0.02, 0.045, b - 0.5, b + 0.5)), [lo, hi - drawn(0.3)]);
+        kit.prism(attic, planOf(rect(0.025, 0.045, b - 0.25, b + 0.25)), [hi - drawn(0.3), hi]);
+    };
+    for (const c of [middle - 5.6, middle, middle + 5.6])
+        for (const d of [-1.15, 1.15])
+            window(c + d, drawn(58.3), drawn(60.1));
+    for (const d of [-1.15, 1.15])
+        window(middle + d, drawn(61.75), drawn(63.4));
+    const model = kit.finish({ height: h.ridge, outlines: [shell, attic], opacity: 0.16 });
+    model.building.position.set(offset[0], 0, offset[1]);
+    model.building.userData["geography"] = record;
+    model.building.userData["geographicDetail"] = { levels: h, source: "docs/monroe-reference.md" };
+    return model;
+}

package/site/models/north-michigan-180-geographic.js

@@ -0,0 +1,117 @@
+import * as THREE from "../vendor/three-r186.js";
+import { createBuilder, polygonOf } from "./building-kit.js";
+import { chainSkin, chainsOf, orient, paintedSlab, planOf, turnsAt } from "./facade-grid.js";
+// 180 North Michigan Avenue, the Harvester Building (1927): the geographic layout's model,
+// on the mapped outline 210671714. The original layout has no model of it; the drawing
+// shows its south wall behind Millennium Park Plaza, which hides its Michigan front.
+//
+// A brown masonry block of twenty-four storeys over the whole mapped lot, on a ground floor
+// as tall as three of its floors, with string courses over the seventeenth and twentieth floors and a top floor of
+// arched windows under a band and a parapet at 86.3 m. No height is published; the parapet
+// is read on the drawing, whose nearby tops fall within about a metre of their published
+// heights, and the storeys are Marc Realty's. See docs/north-michigan-180-reference.md.
+// Units are meters; +x is east, +z is south.
+export const northMichigan180Levels = Object.freeze({
+    base: 9.85, // the tall ground floor, under the second
+    top: 86.3, // the parapet, read on the drawing
+});
+const h = northMichigan180Levels;
+// Each floor's level: the tall ground floor, then 3.25 m floors, the twenty-fourth
+// the last.
+const floor = (n) => (n < 2 ? 0 : h.base + (n - 2) * 3.25);
+// The skins' colours: the window tones, and the masonry and its courses, which no window
+// shares.
+export const northMichigan180Palette = Object.freeze({ glass: [0x585858, 0x5c5c5c, 0x606060, 0x646464], lit: 0x9a9a9a, dim: 0x525252, masonry: 0x7a7a7a, course: 0x888888 });
+const palette = northMichigan180Palette;
+const color = (hex) => new THREE.Color(hex);
+const glassTones = palette.glass.map(color);
+const litGlass = color(palette.lit), dimGlass = color(palette.dim);
+const masonry = color(palette.masonry), course = color(palette.course), core = color(0x303030), roofing = color(0x505050);
+function paneColor(row, bay, wall) {
+    const hash = (Math.imul(row + 41, 0x9e3779b1) ^ Math.imul(bay + 67, 0x85ebca77) ^ Math.imul(wall + 53, 0xc2b2ae3d)) >>> 0;
+    const value = hash % 101;
+    if (value < 4)
+        return litGlass;
+    if (value < 8)
+        return dimGlass;
+    return glassTones[value % glassTones.length];
+}
+const rows = [
+    { lo: 0.25, hi: 1, kind: "wall", floor: 1 },
+    { lo: 1, hi: 8.6, kind: "glass", floor: 1 },
+];
+for (let n = 2; n <= 23; n += 1) {
+    rows.push({ lo: rows.at(-1).hi, hi: floor(n) + 0.6, kind: n === 18 || n === 21 ? "course" : "wall", floor: n });
+    rows.push({ lo: floor(n) + 0.6, hi: floor(n) + 2.65, kind: "glass", floor: n });
+}
+rows.push({ lo: rows.at(-1).hi, hi: 81.75, kind: "wall", floor: 24 });
+rows.push({ lo: 81.75, hi: 82.3, kind: "course", floor: 24 });
+rows.push({ lo: 82.3, hi: 85.4, kind: "glass", floor: 24 });
+rows.push({ lo: 85.4, hi: 86, kind: "head", floor: 24 });
+rows.push({ lo: 86, hi: h.top, kind: "wall", floor: 24 });
+export function createNorthMichigan180GeographicBuilding(record, projectPlan, offset) {
+    const kit = createBuilder(record.name, record.id);
+    const shell = kit.batch("180 North Michigan · shell", kit.material(0xffffff, { vertexColors: true }));
+    const wall = kit.batch("180 North Michigan · masonry and windows", kit.material(0xffffff, { vertexColors: true }));
+    const lot = orient(polygonOf(projectPlan(record.footprint.coordinates)));
+    // The lot's south-east corner, with its south wall running west and its Michigan front
+    // north to Lake Street.
+    const corner = lot.reduce((best, p) => (p[0] + p[1] > best[0] + best[1] ? p : best));
+    const northEast = lot.reduce((best, p) => (p[0] - p[1] > best[0] - best[1] ? p : best));
+    const neighbours = [lot[(lot.indexOf(corner) + 1) % lot.length], lot[(lot.indexOf(corner) + lot.length - 1) % lot.length]];
+    const unit = (p) => { const d = Math.hypot(p[0] - corner[0], p[1] - corner[1]); return [(p[0] - corner[0]) / d, (p[1] - corner[1]) / d]; };
+    const west = unit(neighbours[0][0] < neighbours[1][0] ? neighbours[0] : neighbours[1]), north = unit(northEast);
+    // A point's distances along the south wall and the Michigan front, which meet a little off
+    // square.
+    const skew = west[0] * north[1] - west[1] * north[0];
+    const inLot = (p) => {
+        const [x, z] = [p[0] - corner[0], p[1] - corner[1]];
+        return [(x * north[1] - z * north[0]) / skew, (west[0] * z - west[1] * x) / skew];
+    };
+    planOf(lot).forEach((run) => {
+        const a = run.at(0), b = run.at(run.length), n = run.normal(0);
+        kit.quad(shell, [[a[0], 0, a[1]], [b[0], 0, b[1]], [b[0], h.top, b[1]], [a[0], h.top, a[1]]], [[n[0], 0, n[1]]], core);
+    });
+    paintedSlab(kit, shell, lot, 0, false, roofing);
+    paintedSlab(kit, shell, lot, h.top, true, roofing);
+    const skin = (seed, keep, openings) => {
+        const plan = planOf(lot), heights = [rows[0].lo, ...rows.map((row) => row.hi)];
+        chainsOf(plan).forEach((chain, index) => {
+            if (!chain.runs.every((run) => keep(plan[run])))
+                return;
+            const first = chain.runs[0], last = chain.runs.at(-1);
+            const s0 = turnsAt(plan, first)[0] > 0 ? 0.09 : 0.02, s1 = chain.length - (turnsAt(plan, last)[1] > 0 ? 0.09 : 0.02);
+            const [columns, opening] = openings(chain.length, plan[first].at(0), plan[last].at(plan[last].length));
+            chainSkin(kit, wall, plan, chain, 0, chain.runs.length - 1, s0, s1, columns, heights, 0.02, 0.07, (bay, r) => {
+                const row = rows[r], open = opening(bay);
+                if (row.kind === "course")
+                    return course;
+                const glazed = row.kind === "glass" ? open !== "wall" : row.kind === "head" && open === "middle";
+                return glazed ? paneColor(row.floor, bay, seed * 8 + index) : masonry;
+            }, masonry);
+        });
+    };
+    // Windows 1.4 m wide centred at `centres`, positions along a wall from its start; each
+    // splits into sides and a middle half for the top floor's arched heads.
+    const windows = (length, centres) => {
+        const inside = centres.filter((c) => c - 0.7 > 0.1 && c + 0.7 < length - 0.1).sort((p, q) => p - q);
+        const columns = [0, ...inside.flatMap((c) => [c - 0.7, c - 0.35, c + 0.35, c + 0.7]), length];
+        // Bays count from one: a pier, then side, middle, side for each window, then the last pier.
+        return [columns, (bay) => { const k = (bay - 1) % 4; return bay > 4 * inside.length || k === 0 ? "wall" : k === 2 ? "middle" : "side"; }];
+    };
+    // The south wall's windows stand 2.7 m apart from 2.8 m west of Michigan, as the drawing
+    // puts its visible five; the other walls carry the same spacing, centred on each.
+    const south = (length, start, end) => {
+        const [a0, a1] = [inLot(start)[0], inLot(end)[0]];
+        return windows(length, Array.from({ length: 15 }, (_, k) => 2.8 + 2.7 * k).map((a) => length * (a - a0) / (a1 - a0)));
+    };
+    const spaced = (length) => { const count = Math.max(1, Math.round(length / 2.7)); return windows(length, Array.from({ length: count }, (_, k) => length * (k + 0.5) / count)); };
+    const isSouth = (run) => run.normal(0)[1] > 0.9;
+    skin(0, isSouth, south);
+    skin(1, (run) => !isSouth(run), spaced);
+    const model = kit.finish({ height: h.top, outlines: [shell], opacity: 0.16 });
+    model.building.position.set(offset[0], 0, offset[1]);
+    model.building.userData["geography"] = record;
+    model.building.userData["geographicDetail"] = { levels: h, source: "docs/north-michigan-180-reference.md" };
+    return model;
+}

package/site/models/north-wabash-geographic.js

@@ -0,0 +1,122 @@
+import * as THREE from "../vendor/three-r186.js";
+import { createBuilder, polygonOf } from "./building-kit.js";
+import { chainSkin, chainsOf, mitredBox, orient, paintedSlab, planOf, turnsAt } from "./facade-grid.js";
+// 330 North Wabash (Ludwig Mies van der Rohe with C. F. Murphy, 1972), the former IBM
+// Building and now AMA Plaza: the geographic layout's model, on the mapped outline 64596068
+// and its mapped 211.84 m (695 ft) height. It is the tower the drawing labels Michigan Plaza
+// South: through the photograph's camera its roof corners land on the drawn ones, and One
+// Prudential covers its east face where the drawing does.
+//
+// A black slab, 120 by 270 ft, of bronze-anodized aluminium: I-beam mullions on the 5 ft
+// module stand in front of bronze-tinted glass, with a bronze spandrel at every floor. It
+// stands on a plaza 25 ft above the street, where bronze-clad columns carry it over a glazed
+// lobby, and louvers in place of glass mark its mechanical floors: two above the sixteenth,
+// and the three at the top, which the photograph shows dark. See docs/north-wabash-reference.md.
+// Units are meters; +x is east, +z is south.
+export const northWabashLevels = Object.freeze({
+    plaza: 7.6, // 25 ft above the street
+    lobbyTop: 15.5, // the lobby's 26 ft
+    pitch: 3.81, // 12 ft 6 in office floors
+    lowerFloors: 15,
+    plant: 4.66, // each of the two mechanical floors above the sixteenth
+    upperFloors: 31,
+    roof: 211.84, // mapped height, the published 695 ft
+    module: 1.524, // 5 ft
+});
+const h = northWabashLevels;
+const lowerPlant = h.lobbyTop + h.lowerFloors * h.pitch, upperStart = lowerPlant + 2 * h.plant;
+const topPlant = upperStart + h.upperFloors * h.pitch;
+// Every floor line from the lobby's top to the top mechanical floors, and what the storey
+// above it is.
+const floors = [
+    ...Array.from({ length: h.lowerFloors }, (_, i) => ({ level: h.lobbyTop + i * h.pitch, plant: false })),
+    { level: lowerPlant, plant: true }, { level: lowerPlant + h.plant, plant: true },
+    ...Array.from({ length: h.upperFloors }, (_, i) => ({ level: upperStart + i * h.pitch, plant: false })),
+    ...Array.from({ length: 3 }, (_, i) => ({ level: topPlant + i * (h.roof - topPlant) / 3, plant: true })),
+];
+export const northWabashFloors = floors.map(({ level }) => level);
+const spandrelBelow = 0.32, spandrelAbove = 0.75, fascia = 0.55;
+const mullionHalf = 0.05, mullionDepth = 0.18, columnHalf = 0.45, columnDepth = 0.6;
+// The columns stand 30 ft apart along the long faces and 40 ft along the short ones.
+const columnBays = [9.144, 12.192];
+const color = (hex) => new THREE.Color(hex);
+const glassTones = [0x1f1f1f, 0x232323, 0x272727, 0x1c1c1c].map(color);
+const litGlass = color(0x7a7a7a), dimGlass = color(0x4a4a4a);
+const spandrel = color(0x262626), louver = color(0x353535), lobby = color(0x3a3a3a), granite = color(0x464646), roofing = color(0x3a3a3a);
+function paneColor(row, bay, wall) {
+    const hash = (Math.imul(row + 7, 0x9e3779b1) ^ Math.imul(bay + 41, 0x85ebca77) ^ Math.imul(wall + 19, 0xc2b2ae3d)) >>> 0;
+    const value = hash % 101;
+    if (value < 4)
+        return litGlass;
+    if (value < 8)
+        return dimGlass;
+    return glassTones[value % glassTones.length];
+}
+export function createNorthWabashGeographicBuilding(record, projectPlan, offset) {
+    const kit = createBuilder(record.name, record.id);
+    const shell = kit.batch("330 North Wabash · shell", kit.material(0xffffff, { vertexColors: true }));
+    const wall = kit.batch("330 North Wabash · glass, spandrels and louvers", kit.material(0xffffff, { vertexColors: true }));
+    const frames = kit.batch("330 North Wabash · bronze mullions and columns", kit.material(0x3c3c3c));
+    const outline = orient(polygonOf(projectPlan(record.footprint.coordinates))), plan = planOf(outline);
+    // The slab: granite below the plaza, bronze above it, and a flat roof.
+    plan.forEach((run) => {
+        const a = run.at(0), b = run.at(run.length), n = run.normal(0);
+        kit.quad(shell, [[a[0], 0, a[1]], [b[0], 0, b[1]], [b[0], h.plaza, b[1]], [a[0], h.plaza, a[1]]], [[n[0], 0, n[1]]], granite);
+        kit.quad(shell, [[a[0], h.plaza, a[1]], [b[0], h.plaza, b[1]], [b[0], h.roof, b[1]], [a[0], h.roof, a[1]]], [[n[0], 0, n[1]]], spandrel);
+    });
+    paintedSlab(kit, shell, outline, 0, false, roofing);
+    paintedSlab(kit, shell, outline, h.roof, true, roofing);
+    const rows = [{ lo: h.plaza + 0.1, hi: floors[0].level - spandrelBelow, kind: "lobby", floor: 0 }];
+    floors.forEach(({ level, plant }, i) => {
+        const next = floors[i + 1]?.level ?? h.roof + spandrelBelow;
+        rows.push({ lo: level - spandrelBelow, hi: level + spandrelAbove, kind: "spandrel", floor: i + 1 });
+        rows.push({ lo: level + spandrelAbove, hi: Math.min(next - spandrelBelow, h.roof - fascia), kind: plant ? "louver" : "glass", floor: i + 1 });
+    });
+    const cuts = [rows[0].lo, ...rows.map((row) => row.hi)];
+    // Each wall: one skin of cells on each floor; I-beam mullions one module
+    // apart, whole on one run and held back from the corners, from the lobby's top to under
+    // the fascia; and bronze-clad columns on the column bays through the lobby.
+    chainsOf(plan).forEach((chain, index) => {
+        const count = Math.max(1, Math.round(chain.length / h.module));
+        const stations = Array.from({ length: count + 1 }, (_, i) => chain.length * i / count);
+        // The long faces run north and south.
+        const run0 = plan[chain.runs[0]], n = run0.normal(0), bay = columnBays[Math.abs(n[0]) > 0.7 ? 0 : 1];
+        const columnCount = Math.max(1, Math.round(chain.length / bay));
+        const columns = Array.from({ length: columnCount + 1 }, (_, i) => chain.length * i / columnCount);
+        // Cells span two modules, so a lit window reads as an office's width.
+        chainSkin(kit, wall, plan, chain, 0, chain.runs.length - 1, 0.02, chain.length - 0.02, stations.filter((_, i) => i % 2 === 0), cuts, 0.02, 0.07, (bay, r) => {
+            const row = rows[r];
+            if (row.kind === "spandrel")
+                return spandrel;
+            if (row.kind === "louver")
+                return louver;
+            if (row.kind === "lobby")
+                return lobby;
+            return paneColor(row.floor, bay, index);
+        }, spandrel);
+        const place = (s, half, depth, lo, hi) => {
+            const k = chain.starts.findIndex((start, i) => s < start + plan[chain.runs[i]].length + 1e-9);
+            if (k < 0)
+                return;
+            const run = plan[chain.runs[k]], start = chain.starts[k];
+            const ends = (other) => (other < 0 || other >= chain.runs.length ? depth + 0.02 : 0.03) + half;
+            const lowS = ends(k - 1), highS = run.length - ends(k + 1);
+            if (highS >= lowS)
+                kit.box(frames, run.at(Math.min(Math.max(s - start, lowS), highS)), run.normal(0), half, 0, depth, lo, hi);
+        };
+        for (const s of stations)
+            place(s, mullionHalf, mullionDepth, h.lobbyTop, h.roof - fascia - 0.1);
+        for (const s of columns)
+            place(s, columnHalf, columnDepth, h.plaza + 0.05, h.lobbyTop);
+    });
+    // The fascia that caps the curtain wall, mitred round the corners.
+    plan.forEach((run, i) => {
+        const [before, after] = turnsAt(plan, i);
+        mitredBox(kit, frames, run, 0, run.length, before, after, 0.25, h.roof - fascia, h.roof);
+    });
+    const model = kit.finish({ height: h.roof, outlines: [shell, frames], opacity: 0.16 });
+    model.building.position.set(offset[0], 0, offset[1]);
+    model.building.userData["geography"] = record;
+    model.building.userData["geographicDetail"] = { levels: h, source: "docs/north-wabash-reference.md" };
+    return model;
+}