zero2geospatial3d-sdk 0.1.0__py3-none-any.whl

zero2geospatial3d/web/src/style.css

@@ -0,0 +1,225 @@
+[hidden] { display: none !important; }
+:root {
+  --bg: #f4f5f7;
+  --panel: #ffffff;
+  --ink: #1d2430;
+  --muted: #687384;
+  --line: #e2e5ea;
+  --accent: #1f6feb;
+  --accent-ink: #ffffff;
+  --accent-soft: #e8f0fe;
+  --warn: #b26a00;
+  --error: #c62828;
+  --radius: 8px;
+  --sidebar: 340px;
+  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
+  font-size: 13px;
+  color: var(--ink);
+}
+* { box-sizing: border-box; }
+html, body { margin: 0; height: 100%; background: var(--bg); overflow: hidden; }
+#app {
+  display: grid; height: 100vh;
+  grid-template-columns: var(--sidebar) 1fr;
+  grid-template-rows: 46px 1fr 28px;
+  grid-template-areas: "top top" "side view" "status status";
+}
+#topbar {
+  grid-area: top; display: flex; align-items: center; gap: 16px; padding: 0 14px;
+  background: var(--panel); border-bottom: 1px solid var(--line);
+}
+.brand { display: flex; align-items: center; gap: 8px; font-weight: 600; white-space: nowrap; }
+.logo { background: var(--accent); color: var(--accent-ink); border-radius: 6px; padding: 2px 6px; font-size: 12px; }
+.scene-title { color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 22vw; }
+.sun-clock { display: flex; align-items: center; gap: 8px; margin-left: auto; }
+.clock-icon { color: #e0a100; font-size: 16px; }
+.clock-range { width: 220px; }
+.clock-time { font-variant-numeric: tabular-nums; font-weight: 600; width: 3.2em; }
+.clock-sun { color: var(--muted); min-width: 170px; }
+.fps { color: var(--muted); font-size: 11px; min-width: 110px; text-align: right; }
+.topbar-manual {
+  color: var(--muted); text-decoration: none; font-size: 12px; font-weight: 500;
+  padding: 3px 8px; border: 1px solid var(--line); border-radius: 4px;
+  white-space: nowrap; transition: color 0.15s, border-color 0.15s;
+}
+.topbar-manual:hover { color: var(--accent); border-color: var(--accent); }
+#sidebar { grid-area: side; display: flex; flex-direction: column; background: var(--panel); border-right: 1px solid var(--line); min-height: 0; }
+#tabs { display: flex; border-bottom: 1px solid var(--line); }
+#tabs button {
+  flex: 1; border: 0; background: none; padding: 10px 4px; font: inherit; color: var(--muted);
+  border-bottom: 2px solid transparent; cursor: pointer;
+}
+#tabs button.active { color: var(--accent); border-bottom-color: var(--accent); font-weight: 600; }
+#panels { overflow-y: auto; flex: 1; padding: 10px; }
+.panel { display: flex; flex-direction: column; gap: 8px; }
+#view { grid-area: view; position: relative; min-width: 0; min-height: 0; }
+#view canvas { display: block; width: 100%; height: 100%; }
+#statusbar {
+  grid-area: status; display: flex; align-items: center; gap: 12px; padding: 0 12px;
+  background: var(--panel); border-top: 1px solid var(--line); color: var(--muted); font-size: 12px;
+}
+#statusbar .hint { margin-left: auto; }
+.progress { width: 160px; height: 6px; background: var(--line); border-radius: 3px; overflow: hidden; }
+.progress > span { display: block; height: 100%; width: 0; background: var(--accent); transition: width 0.15s; }
+
+/* cards and rows */
+.card { border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); }
+.card > summary {
+  list-style: none; cursor: pointer; padding: 9px 10px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
+}
+.card > summary::-webkit-details-marker { display: none; }
+.card > summary::before { content: "▸"; color: var(--muted); font-size: 11px; transition: transform 0.15s; }
+.card[open] > summary::before { transform: rotate(90deg); }
+.card-title { font-weight: 600; }
+.card-sub { color: var(--muted); font-size: 11px; width: 100%; padding-left: 18px; }
+.badge { margin-left: auto; color: var(--muted); font-size: 11px; background: var(--bg); border-radius: 10px; padding: 1px 8px; }
+.card-body { padding: 0 10px 10px; display: flex; flex-direction: column; gap: 6px; }
+.row { display: grid; grid-template-columns: 42% 1fr; align-items: center; gap: 8px; }
+.row-label { color: var(--muted); }
+.inline { display: flex; gap: 6px; align-items: center; }
+select, input[type=number], input[type=text] {
+  height: 28px;
+  font: inherit; padding: 4px 6px; border: 1px solid var(--line); border-radius: 6px; background: #fff; color: var(--ink); min-width: 0; width: 100%;
+}
+.inline select, .inline input { width: auto; }
+input[type=color] { width: 44px; height: 26px; border: 1px solid var(--line); border-radius: 6px; padding: 0; background: none; }
+.slider { display: flex; align-items: center; gap: 8px; }
+.slider input { flex: 1; }
+.slider-value { min-width: 4.5em; text-align: right; font-variant-numeric: tabular-nums; color: var(--muted); }
+.toggle { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; }
+.btn-row { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
+.btn {
+  font: inherit; border: 1px solid var(--line); background: #fff; border-radius: 6px; padding: 5px 10px; cursor: pointer; color: var(--ink);
+}
+.btn:hover { border-color: #c7ccd4; background: #fafbfc; }
+.btn.primary { background: var(--accent); border-color: var(--accent); color: var(--accent-ink); }
+.btn.primary:hover { filter: brightness(1.06); }
+.btn.on { background: var(--accent-soft); border-color: var(--accent); color: var(--accent); }
+.btn:disabled { opacity: 0.5; cursor: progress; }
+.icon-btn { padding: 3px 8px; }
+.muted { color: var(--muted); }
+.small { font-size: 11px; }
+p { margin: 0; line-height: 1.45; }
+h3.section { margin: 8px 2px 0; font-size: 12px; text-transform: uppercase; letter-spacing: 0.06em; color: var(--muted); }
+table.stats { width: 100%; border-collapse: collapse; font-size: 12px; }
+table.stats td { padding: 3px 0; border-bottom: 1px dashed var(--line); vertical-align: top; }
+table.stats td:last-child { text-align: right; font-variant-numeric: tabular-nums; }
+.filter { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; align-items: center; padding: 6px; background: var(--bg); border-radius: 6px; }
+.filter .range { display: flex; gap: 4px; align-items: center; }
+.chart { width: 100%; display: block; }
+.chart-title { color: var(--muted); font-size: 11px; margin-top: 6px; }
+.results { display: flex; flex-direction: column; gap: 8px; }
+.result { border: 1px solid var(--line); border-radius: var(--radius); padding: 8px 10px; display: flex; flex-direction: column; gap: 6px; }
+.result.active { border-color: var(--accent); box-shadow: 0 0 0 2px var(--accent-soft); }
+.result-title { font-weight: 600; }
+.note { font-size: 11px; color: var(--muted); background: var(--bg); padding: 6px 8px; border-radius: 6px; line-height: 1.4; }
+
+/* floating */
+.legend, .inspector, .tool-hint, .empty {
+  position: absolute; background: rgba(255, 255, 255, 0.95); border: 1px solid var(--line); border-radius: var(--radius);
+  box-shadow: 0 4px 18px rgba(20, 30, 50, 0.12);
+}
+.legend { left: 12px; bottom: 12px; padding: 10px 12px; min-width: 200px; max-width: 300px; max-height: 50%; overflow-y: auto; }
+.legend-title { font-weight: 600; margin-bottom: 6px; }
+.legend-ramp { height: 12px; border-radius: 3px; }
+.legend-scale { display: flex; justify-content: space-between; color: var(--muted); font-size: 11px; margin-top: 3px; }
+.legend-item { display: flex; align-items: center; gap: 8px; font-size: 12px; margin: 2px 0; }
+.legend-note { color: var(--muted); font-size: 11px; margin-top: 4px; }
+.swatch { width: 14px; height: 14px; border-radius: 3px; flex: none; border: 1px solid rgba(0, 0, 0, 0.1); }
+.inspector { right: 12px; top: 12px; width: 300px; max-height: calc(100% - 24px); overflow-y: auto; padding: 10px 12px; }
+.insp-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; }
+.insp-sub { margin: 8px 0 2px; font-size: 11px; text-transform: uppercase; letter-spacing: 0.05em; color: var(--muted); }
+.close { border: 0; background: none; font-size: 18px; cursor: pointer; color: var(--muted); }
+.tool-hint { left: 50%; top: 12px; transform: translateX(-50%); padding: 7px 14px; font-weight: 500; }
+.empty { left: 50%; top: 40%; transform: translate(-50%, -50%); padding: 24px 28px; text-align: center; max-width: 460px; }
+.empty .detail { color: var(--muted); margin-top: 8px; font-size: 12px; }
+.toast {
+  position: absolute; left: 50%; bottom: 18px; transform: translate(-50%, 20px); opacity: 0; pointer-events: none;
+  background: #1d2430; color: #fff; padding: 8px 14px; border-radius: 6px; transition: all 0.2s; max-width: 70%; text-align: center;
+}
+.toast.show { opacity: 0.95; transform: translate(-50%, 0); }
+.toast.warn { background: var(--warn); }
+.toast.error { background: var(--error); }
+@media (max-width: 900px) {
+  :root { --sidebar: 290px; }
+  .clock-range { width: 120px; }
+  .clock-sun, .fps, #statusbar .hint { display: none; }
+}
+.sun-clock select { width: auto; flex: none; }
+.sun-clock input[type=number] { width: 4.2em !important; flex: none; text-align: center; }
+#panels { overflow-x: hidden; }
+.slider-value { flex: none; }
+.slider input { min-width: 0; }
+.row > * { min-width: 0; }
+.slider-value { min-width: 3.4em; }
+
+/* view tools: minimal icon bar */
+.viewtools {
+  position: absolute; right: 12px; top: 12px; display: flex; flex-direction: column; gap: 4px; z-index: 5;
+  background: rgba(255, 255, 255, 0.92); border: 1px solid var(--line); border-radius: 10px; padding: 4px;
+  box-shadow: 0 4px 18px rgba(20, 30, 50, 0.12);
+}
+.vt-btn {
+  width: 34px; height: 34px; border: 0; background: none; border-radius: 7px; cursor: pointer; color: #3a4350;
+  display: grid; place-items: center; padding: 0;
+}
+.vt-btn:hover { background: var(--bg); color: var(--ink); }
+.vt-btn.on { background: var(--accent-soft); color: var(--accent); }
+.vt-icon svg { width: 20px; height: 20px; display: block; }
+.vt-sep { height: 1px; background: var(--line); margin: 2px 4px; }
+.viewtools.recording .vt-btn[title="Record a video"] { color: #d6352e; animation: rec 1s infinite; }
+@keyframes rec { 50% { opacity: 0.35; } }
+.vt-pop {
+  position: absolute; right: 62px; width: 270px; z-index: 6; background: rgba(255, 255, 255, 0.97);
+  border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; box-shadow: 0 8px 28px rgba(20, 30, 50, 0.16);
+  display: flex; flex-direction: column; gap: 7px;
+}
+.vt-title { font-weight: 600; }
+.vt-row { display: grid; grid-template-columns: 34% 1fr; align-items: center; gap: 8px; }
+.vt-row > span { color: var(--muted); }
+.vt-checks { display: flex; flex-wrap: wrap; gap: 4px 12px; }
+.vt-actions { display: flex; gap: 6px; flex-wrap: wrap; }
+.vt-note { color: var(--muted); font-size: 11px; line-height: 1.4; }
+.inspector { right: 64px; }
+
+/* compare views */
+.compare-layer { position: absolute; inset: 0; pointer-events: none; z-index: 3; }
+.cmp-panel { position: absolute; box-sizing: border-box; }
+.compare-layer.grid .cmp-panel { outline: 1px solid rgba(255, 255, 255, 0.85); }
+.cmp-head { position: absolute; left: 8px; top: 8px; display: flex; gap: 4px; pointer-events: auto; max-width: calc(100% - 60px); }
+.cmp-head select { height: 26px; font-size: 12px; max-width: 220px; background: rgba(255, 255, 255, 0.95); }
+.cmp-head .cmp-scn { width: auto; }
+.cmp-legend { position: absolute; left: 8px; bottom: 8px; width: 150px; background: rgba(255, 255, 255, 0.92); border-radius: 6px; padding: 5px 7px; }
+.cmp-ramp { height: 8px; border-radius: 2px; }
+.cmp-legend.cmp-classes { width: auto; max-width: 170px; font-size: 11px; display: grid; gap: 2px; }
+.cmp-class { display: flex; align-items: center; gap: 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
+.cmp-class .swatch { width: 10px; height: 10px; border-radius: 2px; flex: none; }
+.cmp-scale { display: flex; justify-content: space-between; font-size: 10px; color: var(--muted); margin-top: 2px; }
+.compare-layer.swipe .cmp-panel.right .cmp-legend { left: auto; right: 8px; }
+.cmp-divider { position: absolute; top: 0; bottom: 0; width: 18px; margin-left: -9px; pointer-events: auto; cursor: ew-resize; touch-action: none; }
+.cmp-divider::before { content: ''; position: absolute; top: 0; bottom: 0; left: 7.5px; width: 3px; background: #fff; box-shadow: 0 0 6px rgba(0, 0, 0, 0.35); }
+.cmp-divider.dragging .cmp-grip { transform: translate(-50%, -50%) scale(1.12); }
+.cmp-grip { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 30px; height: 30px; border-radius: 50%; background: #fff; display: grid; place-items: center; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3); font-size: 14px; color: var(--accent); }
+.btn-row.study .slider { flex: 1; }
+.report { display: flex; flex-direction: column; gap: 6px; }
+.rep-row { padding: 4px 0; border-bottom: 1px dashed var(--line); }
+.rep-head { display: flex; justify-content: space-between; gap: 8px; }
+.rep-bar { height: 4px; background: var(--bg); border-radius: 2px; margin: 4px 0 2px; overflow: hidden; }
+.rep-bar i { display: block; height: 100%; background: var(--accent); }
+.stats td.neg { color: #c0392b; }
+.stats td.pos { color: #1f7a3f; }
+.rose-wrap { display: flex; flex-direction: column; align-items: center; gap: 4px; }
+.rose { width: 180px; height: 180px; }
+.btn-row.chips .btn { padding: 2px 8px; font-size: 11px; }
+.stats.seasons td { text-align: right; }
+.stats.seasons td:first-child { text-align: left; }
+.checks { display: flex; flex-direction: column; gap: 4px; }
+.check-row { display: grid; grid-template-columns: 1fr auto auto auto; gap: 6px; align-items: center; }
+.check-table-wrap { overflow-x: auto; max-height: 260px; overflow-y: auto; border: 1px solid var(--line); border-radius: 6px; }
+.check-table { border-collapse: collapse; font-size: 11px; width: 100%; }
+.check-table th { position: sticky; top: 0; background: var(--bg); text-align: left; padding: 4px; font-weight: 600; }
+.check-table td { padding: 3px 4px; border-top: 1px solid var(--line); }
+.check-table tr:hover td { background: var(--accent-soft); cursor: pointer; }
+.check-table td.pass { color: #1f7a3f; font-weight: 700; text-align: center; }
+.check-table td.fail { color: #c0392b; font-weight: 700; text-align: center; }
+.check-table td.na { color: var(--muted); text-align: center; }

zero2geospatial3d/web/src/ui/building_report.js

@@ -0,0 +1,404 @@
+// @ts-check
+// Building report: everything known about one building (facts, analysis
+// results with their rank among all buildings, attributes), a one-click
+// analysis of its surroundings, and a one-page PDF sheet.
+import * as THREE from 'three';
+import { h, button, toast, download } from './dom.js';
+import { fmt } from '../core/classify.js';
+import { renderImage } from '../export/exporters.js';
+import { PdfPage, wrap } from '../export/pdf.js';
+import { featureKey } from '../scene/objects.js';
+import { seasonNames } from '../analysis/climate.js';
+import { rampStops, rampColor } from '../core/classify.js';
+import { OPEN_PEDESTRIAN_FACTOR } from '../core/wind.js';
+
+/** Label, unit and one-line explanation of each result field. */
+export const FIELD_INFO = {
+  sun_h_roof: ['Sun on the roof', 'h', 'Direct sun hours on the roof on the analysed day'],
+  sun_h_facade: ['Sun on the facades', 'h', 'Direct sun hours on the walls (mean over all facades)'],
+  shade_h_roof: ['Roof in shade', 'h', 'Hours the roof is shaded while the sun is up'],
+  shade_pct_roof: ['Roof shade share', '%', 'Share of the sunny period the roof is shaded'],
+  svf_roof: ['Sky view, roof', '', 'Visible sky from the roof (1 = open)'],
+  svf_facade: ['Sky view, facades', '', 'Visible sky from the walls (0.5 = unobstructed wall)'],
+  vsc_facade: ['Daylight on the walls (VSC)', '%', 'Mean vertical sky component of the walls; 39.6 % is an open wall, BRE 209 looks for 27 % at a window'],
+  vsc_ground: ['Daylight, lowest storey (VSC)', '%', 'Mean VSC of the walls in the lowest 3 m, where daylight is scarcest'],
+  vsc27_share: ['Walls at 27 % VSC', '%', 'Share of the wall area with a VSC of 27 % or more (BRE 209)'],
+  vsc_ratio_BA: ['Daylight kept under B', '×', 'Wall VSC with scenario B divided by that with A; under 0.8 is a noticeable loss (BRE 209)'],
+  roof_kwh_m2: ['Roof irradiation', 'kWh/m²', 'Solar energy reaching the roof per square metre in the period'],
+  pv_kwh_yr: ['Rooftop PV yield', 'kWh', 'Electricity from panels on the suitable part of the roof'],
+  pv_area_m2: ['Panel area', 'm²', 'Roof area that keeps enough sun for panels'],
+  facade_kwh_m2: ['Facade irradiation', 'kWh/m²', 'Solar energy reaching the walls per square metre'],
+  facade_pv_kwh_yr: ['Facade PV yield', 'kWh', 'Electricity from panels on the walls'],
+  visible_roof_pct: ['Roof visible', '%', 'Share of the roof seen from the observer'],
+  lambda_p: ['Built fraction (block)', '', 'Plan area fraction of the surrounding block'],
+  h_w: ['Canyon ratio H/W (block)', '', 'Street canyon height-to-width ratio around the building'],
+  lcz: ['Local Climate Zone', '', 'Approximate LCZ of the surrounding block'],
+  flood_depth_m: ['Flood depth at the door', 'm', 'Water depth at the lowest ground point for the chosen level'],
+  opt_floors: ['Optimised floors', '', 'Floor count of the applied optimisation design'],
+  comfort_pct: ['Comfortable hours around it', '%', 'Share of the year (chosen hours) with UTCI 9–26 °C on the surrounding open ground'],
+  heat_stress_h: ['Heat-stress hours', 'h', 'Hours a year with UTCI of 32 °C or more around the building'],
+  cold_stress_h: ['Cold-stress hours', 'h', 'Hours a year with UTCI below 0 °C around the building'],
+  ped_wind_ms: ['Pedestrian wind (year)', 'm/s', 'Mean sheltered wind at 1.5 m around the building'],
+  windy_pct: ['Windy hours', '%', 'Share of hours with pedestrian wind above 5 m/s'],
+  svf_ground: ['Sky view around it', '', 'Mean sky view factor of the surrounding open ground'],
+  opt_height_m: ['Optimised height', 'm', 'Height of the applied optimisation design'],
+  utci_c: ['Outdoor heat stress (UTCI)', '°C', 'Mean UTCI on the open ground around the building'],
+  pet_c: ['Physiological Eq. Temp. (PET)', '°C', 'Mean PET thermal comfort index around the building'],
+  tsurf_c: ['Ground surface temperature', '°C', 'Mean ground surface temperature around the building'],
+  dt_cool_c: ['Microclimate air cooling (ΔTa)', '°C', 'Local air temperature anomaly from trees and street geometry'],
+  vent_index: ['Canyon ventilation (VEI)', '', 'Ventilation efficiency index around the building'],
+  air_no2_ugm3: ['Street pollutant conc.', 'µg/m³', 'Modelled traffic pollutant concentration around the building'],
+  noise_dba_max: ['Max facade noise (Lden)', 'dB(A)', 'Highest environmental noise level at the building perimeter'],
+  noise_dba_mean: ['Mean facade noise (Lden)', 'dB(A)', 'Mean environmental noise level around the building perimeter'],
+  quiet_facade: ['Has quiet facade', '', '1 if the building has a quiet side (< 55 dB(A) or ≥ 6 dB quieter than the loudest side)'],
+  gvi_pct: ['Green View Index (GVI)', '%', 'Visible green canopy and ground vegetation share from pedestrian level around the building'],
+  env_max_h: ['Solar envelope height limit', 'm', 'Maximum height over the footprint that preserves neighbours’ solar access'],
+  walk_score: ['Pedestrian walkability (PCWI)', '/100', 'Composite 0–100 cool walkability score (UTCI, shade, GVI, noise and slope) around the building']
+};
+
+function infoFor(name) {
+  if (FIELD_INFO[name]) return FIELD_INFO[name];
+  const sm = name.match(/^(.+)_(djf|mam|jja|son)$/);
+  if (sm && FIELD_INFO[sm[1]]) {
+    // By months: the season of Dec–Feb depends on the hemisphere.
+    const season = { djf: 'Dec–Feb', mam: 'Mar–May', jja: 'Jun–Aug', son: 'Sep–Nov' }[sm[2]];
+    const [label, unit, help] = FIELD_INFO[sm[1]];
+    return [`${label}, ${season}`, unit, `${help} (${season} only)`];
+  }
+  const m = name.match(/^(d_)?(.+?)(_A|_B)?$/);
+  if (m && (m[1] || m[3]) && FIELD_INFO[m[2]]) {
+    const [label, unit, help] = FIELD_INFO[m[2]];
+    if (m[1]) return [`${label}: change B − A`, unit, `How scenario B changes it: ${help.toLowerCase()}`];
+    return [`${label} (scenario ${m[3].slice(1)})`, unit, help];
+  }
+  if (name.startsWith('clim_')) return [`${name.slice(5)} (climate raster)`, '', 'Mean of the climate raster over the footprint'];
+  return [name, '', ''];
+}
+
+/** Share of buildings (with a value) whose value is below this one, 0..100. */
+export function percentileRank(values, v) {
+  let below = 0, n = 0;
+  for (const x of values) {
+    if (!Number.isFinite(x)) continue;
+    n++;
+    if (x < v) below++;
+  }
+  return n ? (100 * below) / n : NaN;
+}
+
+const FLOOR_FIELDS = ['floors', 'levels', 'building_levels', 'kat', 'kat_sayisi', 'num_floors', 'storeys'];
+
+export function buildingFacts(app, layer, f) {
+  const props = layer.features[f].properties;
+  const lower = Object.fromEntries(Object.keys(props).map((k) => [k.toLowerCase(), k]));
+  const floorKey = FLOOR_FIELDS.find((k) => lower[k] && Number.isFinite(Number(props[lower[k]])));
+  const floors = floorKey ? Number(props[lower[floorKey]]) : Math.max(1, Math.round(layer.heights[f] / 3));
+  const facts = [
+    ['Height', `${layer.heights[f].toFixed(1)} m`],
+    ['Floors', `${floors}${floorKey ? '' : ' (from the height)'}`],
+    ['Footprint', `${Math.round(layer.footprint[f]).toLocaleString('en-US')} m²`],
+    ['Floor area (est.)', `${Math.round(layer.footprint[f] * floors).toLocaleString('en-US')} m²`],
+    ['Ground level', `${layer.baseZ[f].toFixed(1)} m`]
+  ];
+  const analyses = [];
+  const scenario = [];
+  for (const [name, arr] of layer.extraFields) {
+    const v = arr[f];
+    if (!Number.isFinite(v)) continue;
+    const sm = name.match(/^d_(.+)$/);
+    if (sm) {
+      const a = layer.extraFields.get(`${sm[1]}_A`)?.[f];
+      const b = layer.extraFields.get(`${sm[1]}_B`)?.[f];
+      const [label, unit] = infoFor(sm[1]);
+      scenario.push({ name: sm[1], label, unit, a, b, delta: v });
+      continue;
+    }
+    if (/_(A|B)$/.test(name) && layer.extraFields.has(`d_${name.slice(0, -2)}`)) continue;
+    const [label, unit, help] = infoFor(name);
+    const rank = percentileRank(arr, v);
+    let mean = 0, n = 0;
+    for (const x of arr) if (Number.isFinite(x)) { mean += x; n++; }
+    analyses.push({ name, label, unit, help, value: v, rank, mean: n ? mean / n : NaN, count: n });
+  }
+  const attributes = Object.entries(props).filter(([k, v]) => !k.startsWith('_') && v !== null && v !== '').slice(0, 24)
+    .map(([k, v]) => [k, typeof v === 'number' ? fmt(v) : String(v)]);
+  const name = props.name || props.NAME || props.ad || `#${f + 1}`;
+  // Optimisation: this building's floors now and in the applied design.
+  let optimisation = null;
+  const o = app.lastOptimisation;
+  const k = o ? o.targets.findIndex((t) => t.layer === layer && t.f === f) : -1;
+  if (o && k >= 0) {
+    optimisation = {
+      floorsNow: o.now.x[k], floorsDesign: o.design.x[k], floorHeight: o.floorHeight,
+      gfaChange: (o.design.x[k] - o.now.x[k]) * layer.footprint[f],
+      groundSunNow: o.now.extra.sun, groundSunDesign: o.design.extra.sun,
+      areaNow: o.now.extra.gfa, areaDesign: o.design.extra.gfa, targets: o.targets.length, date: o.date
+    };
+  }
+  return { name: String(name), facts, analyses, attributes, scenario, optimisation };
+}
+
+/** Report block for the inspector panel. */
+export function reportBlock(app, layer, f) {
+  const info = buildingFacts(app, layer, f);
+  const wrapEl = h('div', { class: 'report' });
+  wrapEl.appendChild(h('table', { class: 'stats' }, ...info.facts.map(([k, v]) => h('tr', {}, h('td', { text: k }), h('td', { text: v })))));
+  if (info.analyses.length) {
+    wrapEl.appendChild(h('div', { class: 'insp-sub', text: 'Analysis results' }));
+    for (const a of info.analyses) {
+      wrapEl.appendChild(h('div', { class: 'rep-row', title: a.help },
+        h('div', { class: 'rep-head' }, h('span', { text: a.label }), h('b', { text: fmt(a.value, a.unit) })),
+        h('div', { class: 'rep-bar' }, h('i', { style: { width: `${Math.max(2, a.rank).toFixed(0)}%` } })),
+        h('div', { class: 'muted small', text: `Higher than ${a.rank.toFixed(0)} % of ${a.count} buildings · mean ${fmt(a.mean, a.unit)}` })));
+    }
+  } else if (!info.scenario.length) {
+    wrapEl.appendChild(h('p', { class: 'muted small', text: 'No analysis results for this building yet: press "Analyse this building".' }));
+  }
+  if (info.scenario.length) {
+    wrapEl.appendChild(h('div', { class: 'insp-sub', text: `Scenario impact (B − A)` }));
+    wrapEl.appendChild(h('table', { class: 'stats' }, ...info.scenario.map((s) => h('tr', {},
+      h('td', { text: s.label }),
+      h('td', { class: s.delta < 0 ? 'neg' : s.delta > 0 ? 'pos' : '', text: `${fmtOr(s.a, s.unit)} → ${fmtOr(s.b, s.unit)} (${sign(s.delta)}${fmt(s.delta, s.unit)})` })))));
+  }
+  const seasons = buildingSeasons(app, layer, f);
+  if (seasons) {
+    wrapEl.appendChild(h('div', { class: 'insp-sub', text: 'Seasons around it' }));
+    wrapEl.appendChild(h('table', { class: 'stats seasons' },
+      h('tr', {}, h('td', { text: '' }), ...seasonNames(app.site.lat).map((s) => h('td', { text: s }))),
+      h('tr', {}, h('td', { text: 'Comfortable' }), ...seasons.map((x) => h('td', { text: x ? `${x.comfort.toFixed(0)} %` : '–' }))),
+      h('tr', {}, h('td', { text: 'Heat stress' }), ...seasons.map((x) => h('td', { text: x ? `${x.heat} h` : '–' }))),
+      h('tr', {}, h('td', { text: 'Cold stress' }), ...seasons.map((x) => h('td', { text: x ? `${x.cold} h` : '–' }))),
+      h('tr', {}, h('td', { text: 'Wind' }), ...seasons.map((x) => h('td', { text: x ? `${x.wind.toFixed(1)} m/s` : '–' })))));
+  }
+  const rose = buildingRose(app, layer, f);
+  if (rose) {
+    wrapEl.appendChild(h('div', { class: 'insp-sub', text: 'Wind around it' }));
+    const cv = h('canvas', { class: 'rose', width: 220, height: 220 });
+    const note = h('div', { class: 'muted small' });
+    const show = (season) => {
+      const r2 = buildingRose(app, layer, f, season) || rose;
+      const ctx = cv.getContext('2d');
+      ctx.clearRect(0, 0, 220, 220);
+      drawRose(ctx, r2, 110, 110, 92);
+      note.textContent = `Petal length: how often the wind blows from there; colour: the sheltered pedestrian speed beside this building (blue calm, red strong). Calm ${(r2.calm * 100).toFixed(0)} %.`;
+      chips.querySelectorAll('button').forEach((b, i) => b.classList.toggle('on', (i === 0 && season === null) || i - 1 === season));
+    };
+    const chips = h('div', { class: 'btn-row chips' }, button('Year', () => show(null)), ...seasonNames(app.site.lat).map((s, i) => button(s, () => show(i))));
+    wrapEl.appendChild(h('div', { class: 'rose-wrap' }, app.climateRoses?.bySeason ? chips : null, cv, note));
+    show(null);
+  }
+  if (info.optimisation) {
+    const o = info.optimisation;
+    wrapEl.appendChild(h('div', { class: 'insp-sub', text: 'Optimisation (applied design)' }));
+    wrapEl.appendChild(h('table', { class: 'stats' },
+      h('tr', {}, h('td', { text: 'Floors' }), h('td', { text: `${o.floorsNow} → ${o.floorsDesign}` })),
+      h('tr', {}, h('td', { text: 'Floor area change' }), h('td', { text: `${sign(o.gfaChange)}${Math.round(o.gfaChange).toLocaleString('en-US')} m²` })),
+      h('tr', {}, h('td', { text: `Sun on open ground (${o.targets} buildings)` }), h('td', { text: `${o.groundSunNow.toFixed(2)} → ${o.groundSunDesign.toFixed(2)} h` }))));
+  }
+  wrapEl.appendChild(h('div', { class: 'btn-row' },
+    button('Analyse this building', () => analyseBuilding(app, layer, f), { kind: 'primary', title: 'Winter sun, sky view and annual solar, with facades, around this building' }),
+    button('Report PDF', async () => {
+      try {
+        const { blob, name } = await buildingPdf(app, layer, f);
+        download(`building_${name.replace(/[^A-Za-z0-9_-]+/g, '_')}.pdf`, blob);
+        toast('Building report saved.');
+      } catch (e) { toast(e.message, 'error'); }
+    })));
+  return wrapEl;
+}
+
+/** Sun (21 Dec), sky view and annual solar around one building, facades included. */
+export async function analyseBuilding(app, layer, f) {
+  const x = layer.centroid[f * 2], y = layer.centroid[f * 2 + 1];
+  const r = Math.max(120, 2.5 * layer.heights[f], Math.sqrt(layer.footprint[f]) * 2);
+  const sc = app.sceneArea();
+  const area = { minX: Math.max(sc.minX, x - r), maxX: Math.min(sc.maxX, x + r), minY: Math.max(sc.minY, y - r), maxY: Math.min(sc.maxY, y + r) };
+  const prev = { ...app.analysisArea };
+  app.analysisArea = { mode: 'rect', rect: area, radius: prev.radius };
+  const done = await app.run('Building analysis', async (prog) => {
+    const a = app.analyst;
+    const sun = await a.sunHours({ area, cell: 1, date: { month: 12, day: 21 }, facades: true, onProgress: (q) => prog(q * 0.3) });
+    const svf = await a.skyView({ area, cell: 1, directions: 144, facades: true, onProgress: (q) => prog(0.3 + q * 0.3) });
+    const solar = await a.solarRadiation({ area, cell: 1, facades: true, onProgress: (q) => prog(0.6 + q * 0.4) });
+    return [...solar, ...svf, ...sun];
+  });
+  app.analysisArea = prev;
+  if (done) app.inspect(layer, f);
+}
+
+/** One-page building sheet: { blob, name }. */
+export async function buildingPdf(app, layer, f) {
+  const info = buildingFacts(app, layer, f);
+  const v = app.viewer;
+  const cam = v.camera;
+  const saved = { pos: cam.position.clone(), target: v.controls.target.clone() };
+  const c = layer.featureCentre(f);
+  const size = Math.max(60, 3 * Math.max(layer.heights[f], Math.sqrt(layer.footprint[f])));
+  const dir = cam.position.clone().sub(v.controls.target).normalize();
+  if (dir.y < 0.35) dir.y = 0.6;
+  dir.normalize();
+  v.controls.target.copy(c);
+  cam.position.copy(c).addScaledVector(dir, size * 1.6);
+  cam.lookAt(c);
+  const [PW, PH] = [842, 595];
+  const margin = 28, side = 260;
+  const imgW = PW - margin * 3 - side, imgH = PH - margin * 2 - 64;
+  let canvas;
+  try {
+    canvas = renderImage(app, { width: Math.round(imgW * 2.2), height: Math.round(imgH * 2.2),
+      furniture: { title: false, legend: true, north: true, scale: true, credits: false } });
+  } finally {
+    cam.position.copy(saved.pos);
+    v.controls.target.copy(saved.target);
+    cam.lookAt(saved.target);
+    v.requestRender();
+  }
+  const jpeg = canvas.toDataURL('image/jpeg', 0.9);
+  const bytes = Uint8Array.from(atob(jpeg.split(',')[1]), (ch) => ch.charCodeAt(0));
+  const page = new PdfPage(PW, PH);
+  const ink = [0.11, 0.14, 0.19], muted = [0.42, 0.45, 0.5];
+  page.text(margin, margin + 18, `Building report: ${info.name}`, { size: 18, bold: true, color: ink });
+  page.text(margin, margin + 36, `${app.manifest.title} · ${layer.entry.name}`, { size: 10, color: muted });
+  page.jpeg(bytes, canvas.width, canvas.height, margin, margin + 50, imgW, imgH);
+  page.rect(margin, margin + 50, imgW, imgH, { stroke: [0.8, 0.82, 0.85] });
+  const x = margin * 2 + imgW;
+  let y = margin + 64;
+  const table = (title, rows) => {
+    page.text(x, y, title, { size: 10, bold: true, color: ink });
+    y += 4;
+    for (const [k, val] of rows) {
+      if (y > PH - margin - 40) return;
+      y += 13;
+      page.text(x, y, k, { size: 8.5, color: muted });
+      page.text(x + side - Math.min(side * 0.5, 6 + String(val).length * 4.6), y, val, { size: 8.5, color: ink });
+      page.line(x, y + 3, x + side, y + 3, { color: [0.88, 0.89, 0.91], width: 0.4 });
+    }
+    y += 20;
+  };
+  table('Building', info.facts);
+  if (info.analyses.length) {
+    page.text(x, y, 'Analysis results', { size: 10, bold: true, color: ink });
+    y += 6;
+    for (const a of info.analyses) {
+      if (y > PH - margin - 60) break;
+      y += 12;
+      page.text(x, y, a.label, { size: 8.5, color: ink });
+      page.text(x + side - Math.min(side * 0.5, 6 + fmt(a.value, a.unit).length * 4.6), y, fmt(a.value, a.unit), { size: 8.5, bold: true, color: ink });
+      y += 5;
+      page.rect(x, y, side, 4, { fill: [0.9, 0.91, 0.93] });
+      page.rect(x, y, (side * Math.max(2, a.rank)) / 100, 4, { fill: [0.12, 0.44, 0.92] });
+      y += 12;
+      page.text(x, y, `Higher than ${a.rank.toFixed(0)} % of ${a.count} buildings, mean ${fmt(a.mean, a.unit)}`, { size: 7.5, color: muted });
+    }
+    y += 18;
+  } else {
+    for (const line of wrap('No analysis results yet. Use "Analyse this building" in the viewer first.', 8.5, side)) { page.text(x, y, line, { size: 8.5, color: muted }); y += 11; }
+    y += 10;
+  }
+  if (info.scenario.length && y < PH - margin - 80) {
+    table('Scenario impact (B − A)', info.scenario.map((s) => [s.label, `${fmtOr(s.a, s.unit)} → ${fmtOr(s.b, s.unit)} (${sign(s.delta)}${fmt(s.delta, s.unit)})`]));
+  }
+  const rose = buildingRose(app, layer, f);
+  if (rose && y < PH - margin - 120) {
+    page.text(x, y, 'Wind around it (year)', { size: 10, bold: true, color: ink });
+    const R = 42, cx = x + 50, cy = y + 56;
+    const maxF = Math.max(...rose.petals.map((p) => p.freq), 0.01);
+    const width = (2 * Math.PI) / rose.sectors;
+    rose.petals.forEach((p, k) => {
+      if (!p.freq) return;
+      const a = (k * 2 * Math.PI) / rose.sectors - Math.PI / 2;
+      const r = (R * p.freq) / maxF;
+      const pts = [[cx, cy]];
+      for (let t = 0; t <= 6; t++) {
+        const ang = a - width / 2 + 0.03 + ((width - 0.06) * t) / 6;
+        pts.push([cx + Math.cos(ang) * r, cy + Math.sin(ang) * r]);
+      }
+      page.polygon(pts, { fill: roseColor(p.speed) });
+    });
+    page.text(cx - 3, cy - R - 4, 'N', { size: 8, color: muted });
+    let ly = y + 22;
+    for (const line of wrap(`Petals: how often the wind comes from there. Colour: sheltered pedestrian speed here, blue calm to red ${ROSE_MAX_SPEED} m/s. Calm ${(rose.calm * 100).toFixed(0)} %.`, 7.5, side - 110)) {
+      page.text(x + 110, ly, line, { size: 7.5, color: muted });
+      ly += 10;
+    }
+    y += 2 * R + 30;
+  }
+  const seasonsPdf = buildingSeasons(app, layer, f);
+  if (seasonsPdf && y < PH - margin - 90) {
+    page.text(x, y, 'Seasons around it', { size: 10, bold: true, color: ink });
+    y += 14;
+    const colW = (side - 70) / 4;
+    seasonNames(app.site.lat).forEach((s, i) => page.text(x + 70 + colW * i, y, s, { size: 7.5, color: muted }));
+    const rows2 = [['Comfortable', (v) => `${v.comfort.toFixed(0)} %`], ['Heat stress', (v) => `${v.heat} h`],
+      ['Cold stress', (v) => `${v.cold} h`], ['Wind', (v) => `${v.wind.toFixed(1)} m/s`]];
+    for (const [label2, fmt2] of rows2) {
+      y += 12;
+      page.text(x, y, label2, { size: 8, color: muted });
+      seasonsPdf.forEach((v, i) => page.text(x + 70 + colW * i, y, v ? fmt2(v) : '–', { size: 8, color: ink }));
+    }
+    y += 18;
+  }
+  if (info.optimisation && y < PH - margin - 80) {
+    const o = info.optimisation;
+    table('Optimisation (applied design)', [['Floors', `${o.floorsNow} → ${o.floorsDesign}`],
+      ['Floor area change', `${sign(o.gfaChange)}${Math.round(o.gfaChange)} m²`],
+      ['Sun on open ground', `${o.groundSunNow.toFixed(2)} → ${o.groundSunDesign.toFixed(2)} h`]]);
+  }
+  if (y < PH - margin - 80) table('Attributes', info.attributes.slice(0, Math.floor((PH - margin - 40 - y) / 13) - 1));
+  page.line(margin, PH - margin - 8, PW - margin, PH - margin - 8, { color: [0.85, 0.86, 0.88] });
+  page.text(margin, PH - margin + 4, `${app.manifest.crs.authid} · 02 Geo3D Analyzer`, { size: 7.5, color: muted });
+  page.text(PW - margin - 110, PH - margin + 4, new Date().toISOString().slice(0, 16).replace('T', ' '), { size: 7.5, color: muted });
+  const blob = new Blob([page.build({ title: `Building report: ${info.name}` })], { type: 'application/pdf' });
+  return { blob, name: info.name };
+}
+
+function sign(v) { return v > 0 ? '+' : ''; }
+
+/** Wind rose of one building (season: null for the year, or 0-3): EPW sector frequencies, speeds scaled by its shelter. */
+export function buildingRose(app, layer, f, season = null) {
+  const c = app.climateRoses;
+  const ratios = c?.ratios.get(featureKey(layer.index, f + 1));
+  if (!ratios) return null;
+  const src = season === null || !c.bySeason ? c : c.bySeason[season];
+  return { sectors: c.sectors, calm: src.calm, petals: src.freq.map((fr, k) => ({ freq: fr, speed: src.speed[k] * ratios[k] * OPEN_PEDESTRIAN_FACTOR })) };
+}
+
+/** Per-season comfort, heat, cold and wind around one building, or null. */
+export function buildingSeasons(app, layer, f) {
+  return app.climateSeasonal?.get(featureKey(layer.index, f + 1)) || null;
+}
+
+
+const ROSE_MAX_SPEED = 8;
+function roseColor(speed) {
+  const c = rampColor(rampStops('spectral-r'), Math.min(1, speed / ROSE_MAX_SPEED), [0, 0, 0]);
+  return c;
+}
+
+/** Draw a rose on a 2D canvas, petals pointing to where the wind comes from. */
+export function drawRose(ctx, rose, cx, cy, R) {
+  const maxF = Math.max(...rose.petals.map((p) => p.freq), 0.01);
+  ctx.strokeStyle = 'rgba(120,130,140,0.35)';
+  for (const q of [0.5, 1]) { ctx.beginPath(); ctx.arc(cx, cy, R * q, 0, 2 * Math.PI); ctx.stroke(); }
+  const width = (2 * Math.PI) / rose.sectors;
+  rose.petals.forEach((p, k) => {
+    if (!p.freq) return;
+    const a = (k * 360) / rose.sectors * (Math.PI / 180) - Math.PI / 2;
+    const r = (R * p.freq) / maxF;
+    const c = roseColor(p.speed);
+    ctx.beginPath();
+    ctx.moveTo(cx, cy);
+    ctx.arc(cx, cy, r, a - width / 2 + 0.03, a + width / 2 - 0.03);
+    ctx.closePath();
+    ctx.fillStyle = `rgb(${c.map((v) => Math.round(v * 255)).join(',')})`;
+    ctx.fill();
+  });
+  ctx.fillStyle = '#4a5260';
+  ctx.font = '11px system-ui, sans-serif';
+  ctx.textAlign = 'center';
+  ctx.fillText('N', cx, cy - R - 4);
+  ctx.textAlign = 'left';
+}
+function fmtOr(v, unit) { return Number.isFinite(v) ? fmt(v, unit) : '–'; }
+
+export { THREE };