@a2f0/skyline 0.0.0-stage → 0.1.2

package/lib/models/skyline-geography.d.ts

@@ -0,0 +1,23 @@
+import * as THREE from "../vendor/three-r186.js";
+import type { BuildingModel, Vec2 } from "./building-kit.js";
+import type { GeoBuilding, GeoStreet } from "./skyline-geography-data.js";
+export declare const geographicOrigin: [number, number];
+export declare function projectGround([longitude, lat]: [number, number]): [number, number];
+export declare function footprintMetrics(coordinates: [number, number][]): {
+    min: Vec2;
+    max: Vec2;
+    center: Vec2;
+    size: Vec2;
+    area: number;
+};
+export declare function createGeographicBuilding(record: GeoBuilding, offset?: [number, number]): BuildingModel;
+export declare function streetWidth(street: GeoStreet): number;
+export declare function createGeographicRoads(bounds: {
+    x: Vec2;
+    z: Vec2;
+}, color: number, offset?: [number, number]): THREE.Mesh;
+export declare function createGeographicGround(offset?: [number, number]): {
+    group: THREE.Group;
+    streets: THREE.Group;
+    footprints: THREE.LineSegments;
+};

package/lib/models/skyline-geography.js

@@ -0,0 +1,322 @@
+import * as THREE from "../vendor/three-r186.js";
+import { line } from "./building-kit.js";
+import { geographicBuildings, geographicStreets } from "./skyline-geography-data.js";
+import { createAonGeographicBuilding } from "./aon-geographic.js";
+import { createBlueCrossGeographicBuilding } from "./blue-cross-geographic.js";
+import { createBorgWarnerGeographicBuilding } from "./borg-warner-geographic.js";
+import { createBuckinghamGeographicBuilding } from "./buckingham-geographic.js";
+import { createChicagoAthleticAssociationGeographicBuilding } from "./chicago-athletic-association-geographic.js";
+import { createCrainGeographicBuilding } from "./crain-geographic.js";
+import { createGageGeographicBuilding } from "./gage-geographic.js";
+import { createHeritageGeographicBuilding } from "./heritage-geographic.js";
+import { createHyattWestTowerGeographicBuilding } from "./hyatt-west-tower-geographic.js";
+import { createAscherGeographicBuilding, createKeithGeographicBuilding } from "./keith-ascher-geographic.js";
+import { createKemperGeographicBuilding } from "./kemper-geographic.js";
+import { createLakeViewGeographicBuilding } from "./lake-view-geographic.js";
+import { createMacleanCenterGeographicBuilding } from "./maclean-center-geographic.js";
+import { createMichiganBoulevardGeographicBuilding } from "./michigan-boulevard-geographic.js";
+import { createMichiganPlazaSouthGeographicBuilding } from "./michigan-plaza-south-geographic.js";
+import { createMillenniumParkPlazaGeographicBuilding } from "./millennium-park-plaza-geographic.js";
+import { createMonroeGeographicBuilding } from "./monroe-geographic.js";
+import { createNorthMichigan180GeographicBuilding } from "./north-michigan-180-geographic.js";
+import { createNorthWabashGeographicBuilding } from "./north-wabash-geographic.js";
+import { createOnTheParkGeographicBuilding } from "./on-the-park-geographic.js";
+import { createOnePrudentialGeographicBuilding } from "./one-prudential-geographic.js";
+import { createPeoplesGasGeographicBuilding } from "./peoples-gas-geographic.js";
+import { createRailwayExchangeGeographicBuilding } from "./railway-exchange-geographic.js";
+import { createRiverPlazaGeographicBuilding } from "./river-plaza-geographic.js";
+import { createSheratonGrandGeographicBuilding } from "./sheraton-grand-geographic.js";
+import { createSixNorthMichiganGeographicBuilding } from "./six-north-michigan-geographic.js";
+import { createSwissotelGeographicBuilding } from "./swissotel-geographic.js";
+import { createThreeIllinoisCenterGeographicBuilding } from "./three-illinois-center-geographic.js";
+import { createTrumpGeographicBuilding } from "./trump-geographic.js";
+import { createTwoIllinoisCenterGeographicBuilding } from "./two-illinois-center-geographic.js";
+import { createTwoPrudentialGeographicBuilding } from "./two-prudential-geographic.js";
+import { createUniversityClubGeographicBuilding } from "./university-club-geographic.js";
+import { createWilloughbyTowerGeographicBuilding } from "./willoughby-tower-geographic.js";
+// Local WGS84 tangent plane, centered on the bounding-box center of Crain's
+// mapped footprint. Ground coordinates are east/north meters; Three uses x/-z.
+export const geographicOrigin = [-87.62497155, 41.88482645];
+const radians = Math.PI / 180;
+const latitude = geographicOrigin[1] * radians;
+const eccentricitySquared = 6.69437999014e-3;
+const w = Math.sqrt(1 - eccentricitySquared * Math.sin(latitude) ** 2);
+const eastPerDegree = 6378137 / w * Math.cos(latitude) * radians;
+const northPerDegree = 6378137 * (1 - eccentricitySquared) / w ** 3 * radians;
+export function projectGround([longitude, lat]) {
+    return [(longitude - geographicOrigin[0]) * eastPerDegree, (lat - geographicOrigin[1]) * northPerDegree];
+}
+export function footprintMetrics(coordinates) {
+    const points = coordinates.map(projectGround);
+    const min = [0, 1].map((axis) => Math.min(...points.map((p) => p[axis])));
+    const max = [0, 1].map((axis) => Math.max(...points.map((p) => p[axis])));
+    const area = Math.abs(points.reduce((sum, a, i) => {
+        const b = points[(i + 1) % points.length];
+        return sum + a[0] * b[1] - b[0] * a[1];
+    }, 0)) / 2;
+    return { min, max, center: min.map((n, i) => (n + max[i]) / 2), size: min.map((n, i) => max[i] - n), area };
+}
+function plan(coordinates) {
+    const points = coordinates.map((p) => { const [east, north] = projectGround(p); return [east, -north]; });
+    const area = points.reduce((sum, a, i) => {
+        const b = points[(i + 1) % points.length];
+        return sum + a[0] * b[1] - b[0] * a[1];
+    }, 0);
+    if (area > 0)
+        points.reverse();
+    return points.map((p, i) => line(p, points[(i + 1) % points.length]));
+}
+export function createGeographicBuilding(record, offset = [0, 0]) {
+    if (record.id === "layer3") {
+        return createAonGeographicBuilding(record, plan, offset);
+    }
+    if (record.id === "building-crain-communications") {
+        return createCrainGeographicBuilding(record, plan, offset);
+    }
+    if (record.id === "building-blue-cross-blue-shield") {
+        return createBlueCrossGeographicBuilding(record, plan, offset);
+    }
+    if (record.id === "building-340-on-the-park") {
+        return createOnTheParkGeographicBuilding(record, plan, offset);
+    }
+    if (record.id === "building-the-buckingham") {
+        return createBuckinghamGeographicBuilding(record, plan, offset);
+    }
+    if (record.id === "building-michigan-plaza-front-tall") {
+        return createMillenniumParkPlazaGeographicBuilding(record, plan, offset);
+    }
+    if (record.id === "building-willoughby-tower") {
+        return createWilloughbyTowerGeographicBuilding(record, plan, offset);
+    }
+    if (record.id === "building-six-north-michigan") {
+        return createSixNorthMichiganGeographicBuilding(record, plan, offset);
+    }
+    if (record.id === "building-six-north-far-east") {
+        return createMichiganBoulevardGeographicBuilding(record, plan, offset);
+    }
+    if (record.id === "building-michigan-plaza-front-middle") {
+        return createNorthMichigan180GeographicBuilding(record, plan, offset);
+    }
+    if (record.id === "building-university-club") {
+        return createUniversityClubGeographicBuilding(record, plan, offset);
+    }
+    if (record.id === "building-monroe") {
+        return createMonroeGeographicBuilding(record, plan, offset);
+    }
+    if (record.id === "building-maclean-center") {
+        return createMacleanCenterGeographicBuilding(record, plan, offset);
+    }
+    if (record.id === "building-lakeview") {
+        return createLakeViewGeographicBuilding(record, plan, offset);
+    }
+    if (record.id === "building-peoples-gas") {
+        return createPeoplesGasGeographicBuilding(record, plan, offset);
+    }
+    if (record.id === "building-200-south-michigan") {
+        return createBorgWarnerGeographicBuilding(record, plan, offset);
+    }
+    if (record.id === "building-railway-exchange") {
+        return createRailwayExchangeGeographicBuilding(record, plan, offset);
+    }
+    if (record.id === "building-michigan-west-right") {
+        return createGageGeographicBuilding(record, plan, offset);
+    }
+    if (record.id === "building-michigan-west-front") {
+        return createKeithGeographicBuilding(record, plan, offset);
+    }
+    if (record.id === "building-30-south-michigan") {
+        return createAscherGeographicBuilding(record, plan, offset);
+    }
+    if (record.id === "building-chicago-athletic-association") {
+        return createChicagoAthleticAssociationGeographicBuilding(record, plan, offset);
+    }
+    if (record.id === "building-office-west-of-aon") {
+        return createTwoIllinoisCenterGeographicBuilding(record, plan, offset);
+    }
+    if (record.id === "building-river-plaza") {
+        return createRiverPlazaGeographicBuilding(record, plan, offset);
+    }
+    if (record.id === "building-hyatt-regency-west-tower") {
+        return createHyattWestTowerGeographicBuilding(record, plan, offset);
+    }
+    if (record.id === "building-buckingham-east") {
+        return createSheratonGrandGeographicBuilding(record, plan, offset);
+    }
+    if (record.id === "building-three-illinois-center") {
+        return createThreeIllinoisCenterGeographicBuilding(record, plan, offset);
+    }
+    if (record.id === "building-swissotel") {
+        return createSwissotelGeographicBuilding(record, plan, offset);
+    }
+    if (record.id === "building-heritage-at-millennium-park") {
+        return createHeritageGeographicBuilding(record, plan, offset);
+    }
+    if (record.id === "building-kemper") {
+        return createKemperGeographicBuilding(record, plan, offset);
+    }
+    if (record.id === "building-michigan-plaza-south-tower") {
+        return createMichiganPlazaSouthGeographicBuilding(record, plan, offset);
+    }
+    if (record.id === "building-330-north-wabash") {
+        return createNorthWabashGeographicBuilding(record, plan, offset);
+    }
+    if (record.id === "building-one-prudential-plaza") {
+        return createOnePrudentialGeographicBuilding(record, plan, offset);
+    }
+    if (record.id === "building-trump-tower-only") {
+        return createTrumpGeographicBuilding(record, plan, offset);
+    }
+    if (record.id === "building-two-prudential-plaza") {
+        return createTwoPrudentialGeographicBuilding(record, plan, offset);
+    }
+    // Every geographic building has a dedicated factory; a record without one
+    // fails loudly here rather than silently rendering generic massing.
+    throw new Error(`No geographic factory for ${record.id}.`);
+}
+function lines(points, color) {
+    const geometry = new THREE.BufferGeometry();
+    geometry.setAttribute("position", new THREE.Float32BufferAttribute(points.flat(), 3));
+    return new THREE.LineSegments(geometry, new THREE.LineBasicMaterial({ color }));
+}
+// A street's roadway, 3.3 m to a lane: its mapped lanes, or its class's usual count, which
+// depends on whether it is one-way. A named service way is a single 5 m lane.
+const usualLanes = {
+    trunk: [3, 6], primary: [3, 4], secondary: [3, 4], tertiary: [2, 2], residential: [1, 2], unclassified: [1, 2], living_street: [1, 2],
+};
+export function streetWidth(street) {
+    if (street.highway === "service")
+        return 5;
+    const lanes = street.lanes ?? (street.highway.endsWith("_link") ? 1 : usualLanes[street.highway]?.[street.oneway ? 0 : 1] ?? 2);
+    return lanes * 3.3;
+}
+// Clips a polygon in the ground's x/z plane to a rectangle (Sutherland–Hodgman).
+function clipToRectangle(polygon, [xMin, xMax], [zMin, zMax]) {
+    const edges = [[0, xMin, false], [0, xMax, true], [1, zMin, false], [1, zMax, true]];
+    return edges.reduce((points, [axis, limit, keepBelow]) => {
+        const inside = (p) => keepBelow ? p[axis] <= limit : p[axis] >= limit;
+        const clipped = [];
+        points.forEach((current, i) => {
+            const previous = points[(i + points.length - 1) % points.length];
+            if (inside(current) !== inside(previous)) {
+                const t = (limit - previous[axis]) / (current[axis] - previous[axis]);
+                clipped.push([previous[0] + (current[0] - previous[0]) * t, previous[1] + (current[1] - previous[1]) * t]);
+            }
+            if (inside(current))
+                clipped.push(current);
+        });
+        return clipped;
+    }, polygon);
+}
+// The mapped streets as roadway surfaces, each its width about its centreline with round
+// joins, cut to a rectangle of the ground (x east, z south, in metres from the ground's
+// origin) so no road runs past the platform it lies on. They sit just above the platform,
+// under the footprint outlines; overlapping roadways share one flat colour. Marked as
+// ground, so they take building shadows wherever the platform does.
+export function createGeographicRoads(bounds, color, offset = [0, 0]) {
+    const positions = [];
+    const addPolygon = (polygon) => {
+        const points = clipToRectangle(polygon, bounds.x, bounds.z);
+        for (let i = 1; i < points.length - 1; i += 1) {
+            const a = points[0], b = points[i], c = points[i + 1];
+            // Wind each triangle to face up, and drop the slivers a clip or a straight run leaves.
+            const area = (b[1] - a[1]) * (c[0] - a[0]) - (b[0] - a[0]) * (c[1] - a[1]);
+            if (Math.abs(area) < 1e-6)
+                continue;
+            for (const [x, z] of area > 0 ? [a, b, c] : [a, c, b])
+                positions.push(x, 0.03, z);
+        }
+    };
+    for (const street of geographicStreets) {
+        const radius = streetWidth(street) / 2;
+        const points = street.coordinates.map((coordinate) => { const [east, north] = projectGround(coordinate); return [east, -north]; })
+            .filter((p, i, all) => i === 0 || Math.hypot(p[0] - all[i - 1][0], p[1] - all[i - 1][1]) > 1e-6);
+        // Each segment's unit normal, scaled to the roadway's half width.
+        const sides = points.slice(1).map((b, i) => {
+            const a = points[i], length = Math.hypot(b[0] - a[0], b[1] - a[1]);
+            return [-(b[1] - a[1]) / length * radius, (b[0] - a[0]) / length * radius];
+        });
+        points.forEach((a, i) => {
+            // A round join where the street ends or turns. A shallow bend needs only the bevel
+            // between its segments' edge corners, on either side, to close the outer wedge.
+            const before = sides[i - 1], after = sides[i];
+            const turn = before && after ? Math.abs(Math.atan2(before[0] * after[1] - before[1] * after[0], before[0] * after[0] + before[1] * after[1])) : Math.PI;
+            if (turn > 0.05) {
+                // Twelve sides about the half width's circle, so every edge corner within it is covered.
+                const joint = [], reach = radius / Math.cos(Math.PI / 12);
+                for (let k = 0; k < 12; k += 1)
+                    joint.push([a[0] + reach * Math.cos(k * Math.PI / 6), a[1] + reach * Math.sin(k * Math.PI / 6)]);
+                addPolygon(joint);
+            }
+            else if (before && after) {
+                for (const sign of [1, -1])
+                    addPolygon([a, [a[0] + sign * before[0], a[1] + sign * before[1]], [a[0] + sign * after[0], a[1] + sign * after[1]]]);
+            }
+            const b = points[i + 1];
+            if (!b || !after)
+                return;
+            addPolygon([[a[0] + after[0], a[1] + after[1]], [b[0] + after[0], b[1] + after[1]], [b[0] - after[0], b[1] - after[1]], [a[0] - after[0], a[1] - after[1]]]);
+        });
+    }
+    const geometry = new THREE.BufferGeometry();
+    geometry.setAttribute("position", new THREE.Float32BufferAttribute(positions, 3));
+    geometry.setAttribute("normal", new THREE.Float32BufferAttribute(positions.map((_, i) => i % 3 === 1 ? 1 : 0), 3));
+    const roads = new THREE.Mesh(geometry, new THREE.MeshToonMaterial({ color }));
+    roads.name = "Mapped streets";
+    roads.position.set(offset[0], 0, offset[1]);
+    roads.receiveShadow = true;
+    roads.userData["ground"] = true;
+    return roads;
+}
+export function createGeographicGround(offset = [0, 0]) {
+    const group = new THREE.Group();
+    group.name = "Geographic reference";
+    group.position.set(offset[0], 0, offset[1]);
+    // The study rectangle, 100 m squares from 400 m west of Crain to 500 m east and from
+    // 850 m south, past the Railway Exchange at Jackson, to 650 m north.
+    const grid = [];
+    for (let x = -400; x <= 500; x += 100)
+        grid.push([x, 0.02, -650], [x, 0.02, 850]);
+    for (let north = -850; north <= 650; north += 100)
+        grid.push([-400, 0.02, -north], [500, 0.02, -north]);
+    group.add(lines(grid, 0x393939));
+    const streets = new THREE.Group();
+    streets.name = "Mapped street centerlines";
+    for (const street of geographicStreets) {
+        const points = street.coordinates.map((coordinate) => {
+            const [east, north] = projectGround(coordinate);
+            return [east, 0.06, -north];
+        });
+        const segments = [];
+        for (let i = 1; i < points.length; i += 1) {
+            // Clip every segment to the study rectangle, retaining crossing segments.
+            const a = points[i - 1], b = points[i];
+            let lo = 0, hi = 1;
+            for (const [axis, min, max] of [[0, -400, 500], [2, -650, 850]]) {
+                const delta = b[axis] - a[axis];
+                if (Math.abs(delta) < 1e-10) {
+                    if (a[axis] < min || a[axis] > max)
+                        hi = -1;
+                }
+                else {
+                    const t1 = (min - a[axis]) / delta, t2 = (max - a[axis]) / delta;
+                    lo = Math.max(lo, Math.min(t1, t2));
+                    hi = Math.min(hi, Math.max(t1, t2));
+                }
+            }
+            if (lo <= hi)
+                segments.push(...[lo, hi].map((t) => a.map((n, axis) => n + (b[axis] - n) * t)));
+        }
+        const object = lines(segments, 0xa7a7a7);
+        object.name = street.name;
+        streets.add(object);
+    }
+    group.add(streets);
+    const outlines = [];
+    for (const record of geographicBuildings) {
+        const points = record.footprint.coordinates.map((p) => { const [x, y] = projectGround(p); return [x, 0.1, -y]; });
+        points.forEach((p, i) => outlines.push(p, points[(i + 1) % points.length]));
+    }
+    const footprints = lines(outlines, 0xc9c9c9);
+    group.add(footprints);
+    return { group, streets, footprints };
+}

package/lib/models/swissotel-geographic.d.ts

@@ -0,0 +1,24 @@
+import type { BuildingModel, Plan } from "./building-kit.js";
+import type { GeoBuilding } from "./skyline-geography-data.js";
+export declare const swissotelLevels: Readonly<{
+    levels: 45;
+    roof: 139.3;
+    module: 1.5;
+    frame: 0.06;
+    coping: 0.1;
+}>;
+export declare const swissotelPalette: Readonly<{
+    glass: number[];
+    lit: 8882055;
+    dim: 5329233;
+    frame: 4276545;
+}>;
+type Row = {
+    lo: number;
+    hi: number;
+    kind: "glass" | "frame";
+    floor: number;
+};
+export declare const swissotelRows: Row[];
+export declare function createSwissotelGeographicBuilding(record: GeoBuilding, projectPlan: (coordinates: [number, number][]) => Plan, offset: [number, number]): BuildingModel;
+export {};

package/lib/models/swissotel-geographic.js

@@ -0,0 +1,79 @@
+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";
+// Swissôtel Chicago, 323 East Wacker Drive (Harry Weese, 1989): the geographic layout's model,
+// on the hotel's mapped tower part 641288601. The original layout has no model of it. From
+// the photograph's camera it stands behind Three Illinois Center and The Buckingham, and fills
+// the seam where their corners meet.
+//
+// A triangular tower of reflective glass: a flush grid of thin mullions about 1.5 m apart and
+// a transom at each floor, a panel to a floor, under a flat roof at the published 139.3 m. The
+// floors divide that height by OpenStreetMap's 45 levels. See docs/swissotel-reference.md.
+// Units are meters; +x is east, +z is south.
+export const swissotelLevels = Object.freeze({
+    levels: 45, // OpenStreetMap's count, a panel to each
+    roof: 139.3, // the published height, the Skyscraper Center's 457 ft
+    module: 1.5, // the mullions' spacing, read on the photographs
+    frame: 0.06, // each mullion's and transom's width
+    coping: 0.1, // the roof's coping over the top panel
+});
+const h = swissotelLevels;
+const pitch = h.roof / h.levels;
+// The skins' colours: the window tones, and the frame, which no window shares.
+export const swissotelPalette = Object.freeze({ glass: [0x2d2d2d, 0x313131, 0x353535, 0x292929], lit: 0x878787, dim: 0x515151, frame: 0x414141 });
+const palette = swissotelPalette;
+const color = (hex) => new THREE.Color(hex);
+const glassTones = palette.glass.map(color);
+const litGlass = color(palette.lit), dimGlass = color(palette.dim), frame = color(palette.frame);
+const core = color(0x1e1e1e), roofing = color(0x323232);
+function paneColor(row, bay, wall) {
+    const hash = (Math.imul(row + 71, 0x9e3779b1) ^ Math.imul(bay + 13, 0x85ebca77) ^ Math.imul(wall + 47, 0xc2b2ae3d)) >>> 0;
+    const value = hash % 101;
+    if (value < 12)
+        return litGlass;
+    if (value < 18)
+        return dimGlass;
+    return glassTones[value % glassTones.length];
+}
+export const swissotelRows = [];
+for (let n = 1; n <= h.levels; n += 1) {
+    const lo = n === 1 ? 0.25 : (n - 1) * pitch + h.frame / 2, hi = n === h.levels ? h.roof - h.coping : n * pitch - h.frame / 2;
+    swissotelRows.push({ lo, hi, kind: "glass", floor: n });
+    swissotelRows.push({ lo: hi, hi: n === h.levels ? h.roof : n * pitch + h.frame / 2, kind: "frame", floor: n });
+}
+const rows = swissotelRows;
+export function createSwissotelGeographicBuilding(record, projectPlan, offset) {
+    const kit = createBuilder(record.name, record.id);
+    const shell = kit.batch("Swissôtel · shell", kit.material(0xffffff, { vertexColors: true }));
+    const wall = kit.batch("Swissôtel · curtain wall", kit.material(0xffffff, { vertexColors: true }));
+    const lot = orient(polygonOf(projectPlan(record.footprint.coordinates)));
+    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.roof, b[1]], [a[0], h.roof, a[1]]], [[n[0], 0, n[1]]], core);
+    });
+    paintedSlab(kit, shell, lot, 0, false, roofing);
+    paintedSlab(kit, shell, lot, h.roof, true, roofing);
+    // Every face's curtain wall, one box to a chain, held 2 cm clear of its ends or 9 cm where
+    // the outline turns in: a mullion on each module, from the chain's middle out, and the
+    // panels between.
+    const plan = planOf(lot), heights = [rows[0].lo, ...rows.map((row) => row.hi)];
+    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 count = Math.floor(chain.length / 2 / h.module);
+        const lines = Array.from({ length: 2 * count + 1 }, (_, k) => chain.length / 2 + (k - count) * h.module);
+        const cuts = lines.flatMap((c) => [c - h.frame / 2, c + h.frame / 2]).filter((s) => s > s0 + 0.01 && s < s1 - 0.01);
+        const columns = [s0, ...cuts, s1];
+        chainSkin(kit, wall, plan, chain, 0, chain.runs.length - 1, s0, s1, columns, heights, 0.02, 0.06, (bay, r) => {
+            const row = rows[r], middle = (columns[bay - 1] + columns[bay]) / 2;
+            if (row.kind === "frame" || lines.some((c) => Math.abs(middle - c) < h.frame / 2))
+                return frame;
+            return paneColor(row.floor, bay, index);
+        }, frame);
+    });
+    const model = kit.finish({ height: h.roof, 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/swissotel-reference.md" };
+    return model;
+}

package/lib/models/three-illinois-center-geographic.d.ts

@@ -0,0 +1,26 @@
+import type { BuildingModel, Plan } from "./building-kit.js";
+import type { GeoBuilding } from "./skyline-geography-data.js";
+export declare const threeIllinoisLevels: Readonly<{
+    pitch: 3.505;
+    lobby: number;
+    fascia: 1.26;
+    penthouse: 29;
+    roof: 106.7;
+    module: 1.524;
+}>;
+export declare const threeIllinoisPalette: Readonly<{
+    glass: number[];
+    lit: 7368816;
+    dim: 4605510;
+    mullion: 3289650;
+    spandrel: 2631720;
+}>;
+type Row = {
+    lo: number;
+    hi: number;
+    kind: "spandrel" | "glass" | "penthouse";
+    floor: number;
+};
+export declare const threeIllinoisRows: Row[];
+export declare function createThreeIllinoisCenterGeographicBuilding(record: GeoBuilding, projectPlan: (coordinates: [number, number][]) => Plan, offset: [number, number]): BuildingModel;
+export {};

package/lib/models/three-illinois-center-geographic.js

@@ -0,0 +1,86 @@
+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";
+// Three Illinois Center, 303 East Wacker Drive (Fujikawa Conterato Lohan and Associates,
+// 1979): the geographic layout's model, on the mapped outline 95486958. The original layout
+// has no model of it. From the photograph's camera its east end stands in the gap between
+// 340 on the Park and The Buckingham, where the drawing's `buckingham-west` group paints an
+// office tower of ribbon windows under a plain top.
+//
+// A dark bronze box after One and Two Illinois Center, of 30 storeys: a curtain wall of
+// mullions on a 5 ft module, glass over a spandrel on each floor at the published 11.5 ft
+// slab to slab, over the lobby's glass, and the top two floors' windowless mechanical
+// penthouse, the spandrels' bronze with the mullions carried through, under a flat roof at
+// the published 106.7 m. The penthouse was glazed around 2019; the model keeps it as the
+// 2013 photograph shows it. See docs/three-illinois-center-reference.md. Units are meters;
+// +x is east, +z is south.
+export const threeIllinoisLevels = Object.freeze({
+    pitch: 3.505, // the published 11.5 ft slab to slab
+    lobby: 106.7 - 29 * 3.505, // the lobby's height, what the 29 floors over it leave under the roof
+    fascia: 1.26, // the lobby's fascia, the second floor's spandrel carried down
+    penthouse: 29, // the first of the two mechanical floors
+    roof: 106.7, // the published height, the Skyscraper Center's and Emporis's 350 ft
+    module: 1.524, // the curtain wall's 5 ft module
+});
+const h = threeIllinoisLevels;
+const floor = (n) => (n < 2 ? 0 : h.lobby + (n - 2) * h.pitch);
+// The skins' colours: the window tones, and the mullions and spandrels, which no window
+// shares.
+export const threeIllinoisPalette = Object.freeze({ glass: [0x1b1b1b, 0x1f1f1f, 0x232323, 0x181818], lit: 0x707070, dim: 0x464646, mullion: 0x323232, spandrel: 0x282828 });
+const palette = threeIllinoisPalette;
+const color = (hex) => new THREE.Color(hex);
+const glassTones = palette.glass.map(color);
+const litGlass = color(palette.lit), dimGlass = color(palette.dim);
+const mullion = color(palette.mullion), spandrel = color(palette.spandrel);
+const core = color(0x171717), roofing = color(0x2b2b2b);
+function paneColor(row, bay, wall) {
+    const hash = (Math.imul(row + 61, 0x9e3779b1) ^ Math.imul(bay + 29, 0x85ebca77) ^ Math.imul(wall + 83, 0xc2b2ae3d)) >>> 0;
+    const value = hash % 101;
+    if (value < 9)
+        return litGlass;
+    if (value < 14)
+        return dimGlass;
+    return glassTones[value % glassTones.length];
+}
+export const threeIllinoisRows = [{ lo: 0.25, hi: h.lobby + 0.9 - h.fascia, kind: "glass", floor: 1 }];
+for (let n = 2; n < h.penthouse; n += 1) {
+    threeIllinoisRows.push({ lo: n === 2 ? h.lobby + 0.9 - h.fascia : floor(n), hi: floor(n) + 0.9, kind: "spandrel", floor: n });
+    threeIllinoisRows.push({ lo: floor(n) + 0.9, hi: floor(n + 1), kind: "glass", floor: n });
+}
+threeIllinoisRows.push({ lo: floor(h.penthouse), hi: h.roof, kind: "penthouse", floor: h.penthouse });
+const rows = threeIllinoisRows;
+export function createThreeIllinoisCenterGeographicBuilding(record, projectPlan, offset) {
+    const kit = createBuilder(record.name, record.id);
+    const shell = kit.batch("Three Illinois Center · shell", kit.material(0xffffff, { vertexColors: true }));
+    const wall = kit.batch("Three Illinois Center · curtain wall", kit.material(0xffffff, { vertexColors: true }));
+    const lot = orient(polygonOf(projectPlan(record.footprint.coordinates)));
+    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.roof, b[1]], [a[0], h.roof, a[1]]], [[n[0], 0, n[1]]], core);
+    });
+    paintedSlab(kit, shell, lot, 0, false, roofing);
+    paintedSlab(kit, shell, lot, h.roof, true, roofing);
+    // Every face's curtain wall, one box to a chain, held 2 cm clear of its ends or 9 cm where
+    // the outline turns in: a 10 cm mullion on each 5 ft module, from the chain's middle out,
+    // carried up through the penthouse, with glass or spandrel between.
+    const plan = planOf(lot), heights = [rows[0].lo, ...rows.map((row) => row.hi)];
+    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 count = Math.floor(chain.length / 2 / h.module);
+        const lines = Array.from({ length: 2 * count + 1 }, (_, k) => chain.length / 2 + (k - count) * h.module);
+        const cuts = lines.flatMap((c) => [c - 0.05, c + 0.05]).filter((s) => s > s0 + 0.01 && s < s1 - 0.01);
+        const columns = [s0, ...cuts, s1];
+        chainSkin(kit, wall, plan, chain, 0, chain.runs.length - 1, s0, s1, columns, heights, 0.02, 0.08, (bay, r) => {
+            const row = rows[r], middle = (columns[bay - 1] + columns[bay]) / 2;
+            if (lines.some((c) => Math.abs(middle - c) < 0.05))
+                return mullion;
+            return row.kind === "glass" ? paneColor(row.floor, bay, index) : spandrel;
+        }, mullion);
+    });
+    const model = kit.finish({ height: h.roof, 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/three-illinois-center-reference.md" };
+    return model;
+}

package/lib/models/trump-geographic.d.ts

@@ -0,0 +1,14 @@
+import type { BuildingModel, Plan, Vec2 } from "./building-kit.js";
+import type { GeoBuilding } from "./skyline-geography-data.js";
+export declare const trumpGeographicLevels: Readonly<{
+    podium: 60;
+    setbacks: readonly [120, 200];
+    roof: 354.4;
+    shoulder: 347.3;
+    crownTop: 364.9;
+    joints: readonly [377.4, 402.2];
+    tip: 423.2;
+}>;
+export declare const trumpNotch: Vec2;
+export declare const trumpSpire: Vec2;
+export declare function createTrumpGeographicBuilding(record: GeoBuilding, projectPlan: (coordinates: [number, number][]) => Plan, offset: [number, number]): BuildingModel;

package/lib/models/trump-geographic.js

@@ -0,0 +1,51 @@
+import { polygonOf } from "./building-kit.js";
+import { buildTrumpTower, trumpLevels } from "./trump-tower.js";
+// Trump International Hotel and Tower: the geographic layout's model, on the mapped podium
+// 64594680, tiers 188338549 and 188338550, shaft 188338548 and crown 188338859, and the
+// spire above the crown. The tower is the shared generator in
+// trump-tower.ts, the same one the original layout's copy uses. The setbacks keep the mapped
+// parts' 60, 120 and 200 m; the roof, the shoulder, the crown and the spire's joints are
+// measured on the photograph, down from the published tip, where the map's 345 and 357 m
+// run about ten metres low. The spire stands where the photograph shows it. See
+// docs/trump-reference.md. Units are meters; +x is east, +z is south.
+export const trumpGeographicLevels = Object.freeze({
+    podium: trumpLevels.podium,
+    setbacks: trumpLevels.setbacks,
+    roof: trumpLevels.roof,
+    shoulder: trumpLevels.shoulder,
+    crownTop: trumpLevels.crownTop,
+    joints: trumpLevels.joints,
+    tip: trumpLevels.tip, // published architectural height
+});
+const h = trumpGeographicLevels;
+// The roof steps down north of the mapped shaft's east-face notch.
+export const trumpNotch = [-113.6, -448.4];
+// The spire stands where the photograph shows it on the crown: 4.05 m west of the mapped
+// spire part's centre across the photograph's line of sight, whose depth it cannot show.
+// The drawn crown matches the mapped crown part to three layer units; the mapped spire
+// stands 24 units right of the drawn one. See docs/trump-reference.md.
+export const trumpSpire = [-124.72, -458.66];
+export function createTrumpGeographicBuilding(record, projectPlan, offset) {
+    const outline = (way) => polygonOf(projectPlan(record.parts.find((p) => p.way === way).coordinates));
+    const shaft = outline(188338548);
+    // The mapped vertex at the notch fixes the step's line.
+    const notch = shaft.reduce((best, p) => (Math.hypot(p[0] - trumpNotch[0], p[1] - trumpNotch[1]) < Math.hypot(best[0] - trumpNotch[0], best[1] - trumpNotch[1]) ? p : best));
+    const model = buildTrumpTower({
+        name: record.name,
+        id: record.id,
+        tiers: [
+            { outline: polygonOf(projectPlan(record.footprint.coordinates)), top: h.podium },
+            { outline: outline(188338549), top: h.setbacks[0] },
+            { outline: outline(188338550), top: h.setbacks[1] },
+            { outline: shaft, top: h.roof },
+        ],
+        step: notch[1],
+        crown: outline(188338859),
+        spire: trumpSpire,
+        base: 0,
+    });
+    model.building.position.set(offset[0], 0, offset[1]);
+    model.building.userData["geography"] = record;
+    model.building.userData["geographicDetail"] = { levels: h, source: "docs/trump-reference.md" };
+    return model;
+}

package/lib/models/trump-international-tower.d.ts

@@ -0,0 +1,4 @@
+import type { BuildingModel, Vec3 } from "./building-kit.js";
+export declare const trumpSkylineBase = 40.7;
+export declare function createTrumpInternationalTowerBuilding(): BuildingModel;
+export declare const trumpFeatures: Record<string, Vec3 | Vec3[]>;