zero2geospatial3d-sdk 0.1.0__py3-none-any.whl

zero2geospatial3d/web/src/export/pdf.js

@@ -0,0 +1,149 @@
+// @ts-check
+// A minimal PDF 1.4 writer: one page, a JPEG image, Helvetica text, filled
+// rectangles and lines. No dependencies; enough for a one-page analysis sheet.
+
+const WINANSI_EXTRA = {
+  '€': 0x80, '‚': 0x82, '„': 0x84, '…': 0x85, '•': 0x95, '–': 0x96, '—': 0x97, '‘': 0x91, '’': 0x92,
+  '“': 0x93, '”': 0x94, '™': 0x99, 'Œ': 0x8c, 'œ': 0x9c, 'Š': 0x8a, 'š': 0x9a, 'Ž': 0x8e, 'ž': 0x9e, 'Ÿ': 0x9f
+};
+// Characters Helvetica/WinAnsi cannot show, replaced by the closest ASCII.
+const FALLBACK = { 'ı': 'i', 'İ': 'I', 'ş': 's', 'Ş': 'S', 'ğ': 'g', 'Ğ': 'G', 'λ': 'lambda ', '≥': '>=', '≤': '<=',
+  '→': '->', '←': '<-', 'α': 'a', 'β': 'b', 'Δ': 'd', '−': '-', '·': '·' };
+
+/** Document-info strings use PDFDocEncoding, not WinAnsi: write them as UTF-16BE hex. */
+export function pdfInfoString(text) {
+  let hex = 'FEFF';
+  for (const ch of String(text ?? '')) {
+    const cp = ch.codePointAt(0);
+    if (cp > 0xffff) {
+      const v = cp - 0x10000;
+      hex += (0xd800 + (v >> 10)).toString(16).padStart(4, '0') + (0xdc00 + (v & 0x3ff)).toString(16).padStart(4, '0');
+    } else hex += cp.toString(16).padStart(4, '0');
+  }
+  return `<${hex.toUpperCase()}>`;
+}
+
+/** Encode text for a PDF string in WinAnsiEncoding, escaping ( ) \ . */
+export function pdfString(text) {
+  let out = '';
+  for (const ch of String(text ?? '')) {
+    const sub = FALLBACK[ch];
+    const s = sub !== undefined ? sub : ch;
+    for (const c of s) {
+      let code = c.codePointAt(0);
+      if (WINANSI_EXTRA[c] !== undefined) code = WINANSI_EXTRA[c];
+      else if (code > 255 || (code >= 0x80 && code < 0xa0)) code = 0x3f; // '?'
+      if (code === 0x28 || code === 0x29 || code === 0x5c) out += '\\';
+      out += String.fromCharCode(code);
+    }
+  }
+  return out;
+}
+
+// Helvetica advance widths (1/1000 em) for ASCII 32..126; others ~ 556.
+const HELV = [278, 278, 355, 556, 556, 889, 667, 191, 333, 333, 389, 584, 278, 333, 278, 278, 556, 556, 556, 556, 556, 556, 556, 556, 556, 556,
+  278, 278, 584, 584, 584, 556, 1015, 667, 667, 722, 722, 667, 611, 778, 722, 278, 500, 667, 556, 833, 722, 778, 667, 778, 722, 667, 611, 722,
+  667, 944, 667, 667, 611, 278, 278, 278, 469, 556, 333, 556, 556, 500, 556, 556, 278, 556, 556, 222, 222, 500, 222, 833, 556, 556, 556, 556,
+  333, 500, 278, 556, 500, 722, 500, 500, 500, 334, 260, 334, 584];
+
+export function textWidth(text, size, bold = false) {
+  let w = 0;
+  for (const ch of pdfString(text)) {
+    const c = ch.charCodeAt(0);
+    w += c >= 32 && c <= 126 ? HELV[c - 32] : 556;
+  }
+  return (w / 1000) * size * (bold ? 1.06 : 1);
+}
+
+/** Split text into lines no wider than maxWidth points. */
+export function wrap(text, size, maxWidth) {
+  const words = String(text ?? '').split(/\s+/).filter(Boolean);
+  const lines = [];
+  let line = '';
+  for (const w of words) {
+    const t = line ? `${line} ${w}` : w;
+    if (textWidth(t, size) > maxWidth && line) { lines.push(line); line = w; } else line = t;
+  }
+  if (line) lines.push(line);
+  return lines;
+}
+
+export class PdfPage {
+  /** @param {number} width points  @param {number} height points */
+  constructor(width, height) {
+    this.width = width;
+    this.height = height;
+    this.ops = [];
+    this.image = null;
+  }
+
+  /** Top-left based coordinates are converted to PDF's bottom-left origin. */
+  _y(y) { return this.height - y; }
+
+  text(x, y, text, { size = 10, bold = false, color = [0, 0, 0] } = {}) {
+    this.ops.push(`BT /${bold ? 'F2' : 'F1'} ${size} Tf ${rgb(color)} rg ${n(x)} ${n(this._y(y))} Td (${pdfString(text)}) Tj ET`);
+  }
+
+  rect(x, y, w, h, { fill = null, stroke = null, lineWidth = 0.5 } = {}) {
+    const parts = [];
+    if (fill) parts.push(`${rgb(fill)} rg`);
+    if (stroke) parts.push(`${rgb(stroke)} RG ${n(lineWidth)} w`);
+    parts.push(`${n(x)} ${n(this._y(y + h))} ${n(w)} ${n(h)} re ${fill && stroke ? 'B' : fill ? 'f' : 'S'}`);
+    this.ops.push(parts.join(' '));
+  }
+
+  /** A filled polygon; points are top-left based [x, y]. */
+  polygon(points, { fill = [0, 0, 0] } = {}) {
+    if (points.length < 3) return;
+    const path = points.map(([x, y], i) => `${n(x)} ${n(this._y(y))} ${i ? 'l' : 'm'}`).join(' ');
+    this.ops.push(`${rgb(fill)} rg ${path} h f`);
+  }
+
+  line(x1, y1, x2, y2, { color = [0, 0, 0], width = 0.5 } = {}) {
+    this.ops.push(`${rgb(color)} RG ${n(width)} w ${n(x1)} ${n(this._y(y1))} m ${n(x2)} ${n(this._y(y2))} l S`);
+  }
+
+  /** Place a JPEG (bytes, pixel size) in the box x, y, w, h (top-left). One image per page. */
+  jpeg(bytes, pxWidth, pxHeight, x, y, w, h) {
+    this.image = { bytes, pxWidth, pxHeight };
+    this.ops.push(`q ${n(w)} 0 0 ${n(h)} ${n(x)} ${n(this._y(y + h))} cm /Im1 Do Q`);
+  }
+
+  /** @returns {Uint8Array} the PDF file */
+  build({ title = '', author = '', creator = '02 Geo3D Analyzer' } = {}) {
+    const enc = (s) => Uint8Array.from(s, (c) => c.charCodeAt(0) & 255);
+    const chunks = [];
+    const offsets = [];
+    let size = 0;
+    const push = (u8) => { chunks.push(u8); size += u8.length; };
+    const obj = (id, body) => { offsets[id] = size; push(enc(`${id} 0 obj\n`)); for (const b of body) push(typeof b === 'string' ? enc(b) : b); push(enc('\nendobj\n')); };
+    push(enc('%PDF-1.4\n%\xe2\xe3\xcf\xd3\n'));
+    const content = this.ops.join('\n');
+    const resources = `/Font << /F1 5 0 R /F2 6 0 R >>${this.image ? ' /XObject << /Im1 7 0 R >>' : ''}`;
+    obj(1, ['<< /Type /Catalog /Pages 2 0 R >>']);
+    obj(2, ['<< /Type /Pages /Kids [3 0 R] /Count 1 >>']);
+    obj(3, [`<< /Type /Page /Parent 2 0 R /MediaBox [0 0 ${n(this.width)} ${n(this.height)}] /Resources << ${resources} >> /Contents 4 0 R >>`]);
+    obj(4, [`<< /Length ${content.length} >>\nstream\n`, content, '\nendstream']);
+    obj(5, ['<< /Type /Font /Subtype /Type1 /BaseFont /Helvetica /Encoding /WinAnsiEncoding >>']);
+    obj(6, ['<< /Type /Font /Subtype /Type1 /BaseFont /Helvetica-Bold /Encoding /WinAnsiEncoding >>']);
+    let next = 7;
+    if (this.image) {
+      const im = this.image;
+      obj(7, [`<< /Type /XObject /Subtype /Image /Width ${im.pxWidth} /Height ${im.pxHeight} /ColorSpace /DeviceRGB /BitsPerComponent 8 /Filter /DCTDecode /Length ${im.bytes.length} >>\nstream\n`, im.bytes, '\nendstream']);
+      next = 8;
+    }
+    obj(next, [`<< /Title ${pdfInfoString(title)} /Author ${pdfInfoString(author)} /Creator ${pdfInfoString(creator)} /Producer ${pdfInfoString(creator)} >>`]);
+    const xref = size;
+    let table = `xref\n0 ${next + 1}\n0000000000 65535 f \n`;
+    for (let i = 1; i <= next; i++) table += `${String(offsets[i]).padStart(10, '0')} 00000 n \n`;
+    push(enc(table));
+    push(enc(`trailer\n<< /Size ${next + 1} /Root 1 0 R /Info ${next} 0 R >>\nstartxref\n${xref}\n%%EOF\n`));
+    const out = new Uint8Array(size);
+    let o = 0;
+    for (const c of chunks) { out.set(c, o); o += c.length; }
+    return out;
+  }
+}
+
+function n(v) { return Number(v).toFixed(2).replace(/\.?0+$/, '') || '0'; }
+function rgb(c) { return c.map((v) => n(Math.max(0, Math.min(1, v)))).join(' '); }

zero2geospatial3d/web/src/export/snapshot.js

@@ -0,0 +1,234 @@
+// @ts-check
+// A baked, self-contained copy of what the viewer shows: terrain (thinned,
+// with its painted texture and the active analysis drape), extrusions with
+// their current colours (the drape baked into roof vertices), trees and
+// poles, facade tiles and the flood surface. GLB and interactive HTML
+// exports are both built from it.
+import * as THREE from 'three';
+import { ExtrudedLayer, PointLayer } from '../scene/objects.js';
+import { overlayPixels, gridRect, overlayUniforms } from '../scene/overlay.js';
+import { rampStops, rampColor } from '../core/classify.js';
+
+const MAX_TERRAIN_VERTS_SIDE = 512;
+const MAX_TEXTURE = 2048;
+
+/**
+ * @param {any} app
+ * @param {{ area?: { minX: number, maxX: number, minY: number, maxY: number } | null }} [opts]
+ */
+export function bakeScene(app, { area = null } = {}) {
+  const t = app.terrain;
+  const g = t.grid;
+  const a = area || app.sceneArea();
+  const inArea = (x, y) => x >= a.minX && x <= a.maxX && y >= a.minY && y <= a.maxY;
+  const r = app.activeResult?.grid ? app.activeResult : null;
+  const opacity = overlayUniforms.uOverlayOpacity.value;
+  const overlay = r ? { pixels: overlayPixels(r.grid, r.values, r.display), grid: r.grid } : null;
+
+  // ---------------------------------------------------------- terrain
+  const c0 = Math.max(0, Math.floor((a.minX - g.minX) / g.cell));
+  const c1 = Math.min(g.cols - 1, Math.ceil((a.maxX - g.minX) / g.cell));
+  const r0 = Math.max(0, Math.floor((g.maxY - a.maxY) / g.cell));
+  const r1 = Math.min(g.rows - 1, Math.ceil((g.maxY - a.minY) / g.cell));
+  const step = Math.max(1, Math.ceil(Math.max(c1 - c0, r1 - r0) / MAX_TERRAIN_VERTS_SIDE));
+  const cs = [], rs = [];
+  for (let c = c0; c < c1; c += step) cs.push(c);
+  cs.push(c1);
+  for (let rr = r0; rr < r1; rr += step) rs.push(rr);
+  rs.push(r1);
+  const nc = cs.length, nr = rs.length;
+  const tPos = new Float32Array(nc * nr * 3);
+  const tUv = new Float32Array(nc * nr * 2);
+  for (let j = 0; j < nr; j++) {
+    for (let i = 0; i < nc; i++) {
+      const k = j * nc + i;
+      tPos[k * 3] = g.minX + cs[i] * g.cell;
+      tPos[k * 3 + 1] = t.toY(g.values[rs[j] * g.cols + cs[i]]);
+      tPos[k * 3 + 2] = -(g.maxY - rs[j] * g.cell);
+      // Vertices sit at cell centres; the texture spans whole cells c0..c1.
+      tUv[k * 2] = (cs[i] - c0 + 0.5) / (c1 - c0 + 1);
+      tUv[k * 2 + 1] = 1 - (rs[j] - r0 + 0.5) / (r1 - r0 + 1); // image row 0 = north
+    }
+  }
+  let tIdx = new Uint32Array((nc - 1) * (nr - 1) * 6);
+  // Where the DEM has no data (a DEM clipped to a polygon) there is no ground.
+  const mask = t.mask;
+  const on = mask ? (i, j) => mask[rs[j] * g.cols + cs[i]] === 1 : () => true;
+  let q = 0;
+  for (let j = 0; j < nr - 1; j++) {
+    for (let i = 0; i < nc - 1; i++) {
+      const aa = j * nc + i, b = aa + 1, d = aa + nc, e = d + 1;
+      const oa = on(i, j), ob = on(i + 1, j), od = on(i, j + 1), oe = on(i + 1, j + 1);
+      if (oa && od && ob) { tIdx[q++] = aa; tIdx[q++] = d; tIdx[q++] = b; }
+      if (ob && od && oe) { tIdx[q++] = b; tIdx[q++] = d; tIdx[q++] = e; }
+    }
+  }
+  if (q < tIdx.length) tIdx = tIdx.slice(0, q);
+  const terrainTexture = composeTerrainTexture(app, { c0, c1, r0, r1 }, overlay, opacity);
+
+  // ---------------------------------------------------------- extrusions
+  const meshes = [];
+  const sampleOverlay = makeSampler(overlay);
+  for (const layer of app.layers) {
+    if (!(layer instanceof ExtrudedLayer) || !layer.visible) continue;
+    for (const c of layer.chunks) {
+      const geom = c.mesh.geometry;
+      const pos = geom.attributes.position.array;
+      const nrm = geom.attributes.normal.array;
+      const col = geom.attributes.color.array;
+      const idx = geom.index.array;
+      const keep = new Int32Array(c.feat.length).fill(-1);
+      let n = 0;
+      for (let v = 0; v < c.feat.length; v++) {
+        const f = c.feat[v];
+        if (inArea(layer.centroid[f * 2], layer.centroid[f * 2 + 1])) keep[v] = n++;
+      }
+      if (!n) continue;
+      const P = new Float32Array(n * 3), N = new Float32Array(n * 3), C = new Uint8Array(n * 3);
+      const rgb = [0, 0, 0];
+      for (let v = 0; v < keep.length; v++) {
+        const k = keep[v];
+        if (k < 0) continue;
+        for (let m = 0; m < 3; m++) { P[k * 3 + m] = pos[v * 3 + m]; N[k * 3 + m] = nrm[v * 3 + m]; }
+        rgb[0] = col[v * 3]; rgb[1] = col[v * 3 + 1]; rgb[2] = col[v * 3 + 2];
+        if (overlay && !r.groundOnly && nrm[v * 3 + 1] > 0.55) {
+          const o = sampleOverlay(pos[v * 3], -pos[v * 3 + 2]);
+          if (o) for (let m = 0; m < 3; m++) rgb[m] = rgb[m] * (1 - opacity) + toLinear(o[m] / 255) * opacity;
+        }
+        for (let m = 0; m < 3; m++) C[k * 3 + m] = Math.round(toSrgb(rgb[m]) * 255);
+      }
+      const I = [];
+      for (let i = 0; i < idx.length; i += 3) {
+        const x = keep[idx[i]], y = keep[idx[i + 1]], z = keep[idx[i + 2]];
+        if (x >= 0 && y >= 0 && z >= 0) I.push(x, y, z);
+      }
+      meshes.push({ name: layer.entry.name, positions: P, normals: N, colors: C, index: n > 65535 ? Uint32Array.from(I) : Uint16Array.from(I) });
+    }
+  }
+
+  // ---------------------------------------------------------- trees and poles
+  const instances = [];
+  for (const layer of app.layers) {
+    if (!(layer instanceof PointLayer) || !layer.visible) continue;
+    const rows = [];
+    for (const [f, x, y] of layer.points) {
+      if (!inArea(x, y)) continue;
+      const h = Math.max(0.5, layer.heights[f]);
+      rows.push(x, t.groundY(x, y), -y, h, layer.isTree ? layer.crownRadius(h) : 0.25,
+        layer.colors[f * 3], layer.colors[f * 3 + 1], layer.colors[f * 3 + 2]); // sRGB
+    }
+    if (rows.length) instances.push({ name: layer.entry.name, kind: layer.isTree ? 'tree' : 'pole', data: Float32Array.from(rows) });
+  }
+
+  // ---------------------------------------------------------- facade tiles
+  let facade = null;
+  const fr = app.activeResult?.facade && app.activeResult.showFacade !== false ? app.activeResult.facade : null;
+  if (fr) {
+    const stops = rampStops(fr.ramp);
+    const keepIdx = [];
+    for (let i = 0; i < fr.count; i++) if (inArea(fr.positions[i * 3], -fr.positions[i * 3 + 2])) keepIdx.push(i);
+    const P = new Float32Array(keepIdx.length * 3), N = new Float32Array(keepIdx.length * 3), C = new Uint8Array(keepIdx.length * 3);
+    const cc = [0, 0, 0];
+    keepIdx.forEach((i, k) => {
+      for (let m = 0; m < 3; m++) { P[k * 3 + m] = fr.positions[i * 3 + m]; N[k * 3 + m] = fr.normals[i * 3 + m]; }
+      rampColor(stops, (fr.values[i] - fr.min) / Math.max(1e-9, fr.max - fr.min), cc);
+      for (let m = 0; m < 3; m++) C[k * 3 + m] = Math.round(cc[m] * 255);
+    });
+    facade = { positions: P, normals: N, colors: C, size: fr.spacing * 0.94 };
+  }
+
+  // ---------------------------------------------------------- water
+  let water = null;
+  if (t.waterMesh) {
+    const p = t.waterMesh.geometry.attributes.position.array;
+    water = { positions: Float32Array.from(p) };
+  }
+
+  const cam = app.viewer.camera;
+  return {
+    format: 'geo3d-snapshot', version: 1,
+    title: app.manifest.title,
+    created: new Date().toISOString(),
+    crs: app.manifest.crs.authid, origin: app.manifest.origin,
+    terrain: { positions: tPos, uvs: tUv, index: tIdx, texture: terrainTexture },
+    meshes, instances, facade, water,
+    sun: app.viewer.sunDir.toArray(),
+    camera: { position: cam.position.toArray(), target: app.viewer.controls.target.toArray(), fov: cam.fov },
+    legend: legendOf(app),
+    attribution: attributionOf(app)
+  };
+}
+
+/** Terrain canvas cropped to the area, with the analysis drape drawn over it. */
+function composeTerrainTexture(app, { c0, c1, r0, r1 }, overlay, opacity) {
+  const t = app.terrain;
+  const g = t.grid;
+  const src = t.canvas;
+  const sx = src.width / g.cols, sy = src.height / g.rows;
+  const w = Math.min(MAX_TEXTURE, Math.max(2, Math.round((c1 - c0 + 1) * sx)));
+  const h = Math.min(MAX_TEXTURE, Math.max(2, Math.round((r1 - r0 + 1) * sy)));
+  const canvas = document.createElement('canvas');
+  canvas.width = w;
+  canvas.height = h;
+  const ctx = /** @type {CanvasRenderingContext2D} */ (canvas.getContext('2d'));
+  ctx.drawImage(src, c0 * sx, r0 * sy, (c1 - c0 + 1) * sx, (r1 - r0 + 1) * sy, 0, 0, w, h);
+  if (overlay) {
+    const og = overlay.grid;
+    const img = new ImageData(new Uint8ClampedArray(overlay.pixels.buffer), og.cols, og.rows);
+    const oc = document.createElement('canvas');
+    oc.width = og.cols;
+    oc.height = og.rows;
+    /** @type {CanvasRenderingContext2D} */ (oc.getContext('2d')).putImageData(img, 0, 0);
+    const rect = gridRect(og);
+    // Area pixel coordinates of the overlay rectangle.
+    const ax0 = g.minX + (c0 - 0.5) * g.cell, ay0 = g.maxY - (r0 - 0.5) * g.cell;
+    const pxPerM = w / ((c1 - c0 + 1) * g.cell);
+    const pyPerM = h / ((r1 - r0 + 1) * g.cell);
+    ctx.globalAlpha = opacity;
+    ctx.imageSmoothingEnabled = false;
+    ctx.drawImage(oc, (rect.minX - ax0) * pxPerM, (ay0 - -rect.minZ) * pyPerM, (rect.maxX - rect.minX) * pxPerM, (rect.maxZ - rect.minZ) * pyPerM);
+    ctx.globalAlpha = 1;
+  }
+  return canvas.toDataURL('image/jpeg', 0.9);
+}
+
+function makeSampler(overlay) {
+  if (!overlay) return () => null;
+  const g = overlay.grid;
+  return (x, y) => {
+    const c = Math.round((x - g.minX) / g.cell), r = Math.round((g.maxY - y) / g.cell);
+    if (c < 0 || r < 0 || c >= g.cols || r >= g.rows) return null;
+    const i = (r * g.cols + c) * 4;
+    return overlay.pixels[i + 3] ? [overlay.pixels[i], overlay.pixels[i + 1], overlay.pixels[i + 2]] : null;
+  };
+}
+
+function legendOf(app) {
+  const r = app.activeResult;
+  if (r) {
+    if (r.legend) return { title: r.title, items: r.legend };
+    if (r.display?.categorical) return { title: r.title, items: [] };
+    const stops = rampStops(r.display.ramp).map((s) => `#${s.map((v) => Math.round(v * 255).toString(16).padStart(2, '0')).join('')}`);
+    return { title: r.title, ramp: stops, min: r.display.min, max: r.display.max, unit: r.unit || '' };
+  }
+  return app.layerLegend || null;
+}
+
+function attributionOf(app) {
+  const names = app.layers.map((l) => l.entry.name.toLowerCase()).join(' ');
+  const parts = ['02 Geo3D Analyzer'];
+  if (names.includes('osm')) parts.push('Map data © OpenStreetMap contributors');
+  if (app.manifest.terrain?.source) parts.push(`Terrain: ${app.manifest.terrain.source}`);
+  return parts.join(' · ');
+}
+
+function toSrgb(v) { return v <= 0.0031308 ? 12.92 * v : 1.055 * Math.pow(v, 1 / 2.4) - 0.055; }
+function toLinear(v) { return v <= 0.04045 ? v / 12.92 : Math.pow((v + 0.055) / 1.055, 2.4); }
+
+/** Typed arrays <-> base64 for embedding. */
+export function toBase64(arr) {
+  const bytes = new Uint8Array(arr.buffer, arr.byteOffset, arr.byteLength);
+  let s = '';
+  for (let i = 0; i < bytes.length; i += 0x8000) s += String.fromCharCode.apply(null, Array.from(bytes.subarray(i, i + 0x8000)));
+  return btoa(s);
+}

zero2geospatial3d/web/src/export/snapshot_scene.js

@@ -0,0 +1,150 @@
+// Builds a Three.js group from a baked snapshot (export/snapshot.js).
+// Self-contained on purpose: THREE is passed in, so the same file runs in the
+// viewer (GLB export) and inside a standalone HTML export.
+
+const srgbToLinear = (v) => (v <= 0.04045 ? v / 12.92 : Math.pow((v + 0.055) / 1.055, 2.4));
+
+function linearColors(u8) {
+  const out = new Float32Array(u8.length);
+  for (let i = 0; i < u8.length; i++) out[i] = srgbToLinear(u8[i] / 255);
+  return out;
+}
+
+/** Load the terrain texture first (GLB export needs it before parsing). */
+export function loadTexture(THREE, dataUrl) {
+  return new Promise((resolve) => {
+    if (!dataUrl) { resolve(null); return; }
+    const img = new Image();
+    img.onload = () => {
+      const tex = new THREE.Texture(img);
+      tex.colorSpace = THREE.SRGBColorSpace;
+      tex.needsUpdate = true;
+      resolve(tex);
+    };
+    img.onerror = () => resolve(null);
+    img.src = dataUrl;
+  });
+}
+
+/** @returns {Promise<any>} a THREE.Group */
+export async function buildGroup(THREE, snap) {
+  const group = new THREE.Group();
+  group.name = snap.title || 'scene';
+  group.userData = { crs: snap.crs, origin: snap.origin, created: snap.created, generator: '02 Geo3D Analyzer' };
+
+  // Terrain.
+  const t = snap.terrain;
+  const tg = new THREE.BufferGeometry();
+  tg.setAttribute('position', new THREE.BufferAttribute(t.positions, 3));
+  tg.setAttribute('uv', new THREE.BufferAttribute(t.uvs, 2));
+  tg.setIndex(new THREE.BufferAttribute(t.index, 1));
+  tg.computeVertexNormals();
+  const tex = await loadTexture(THREE, t.texture);
+  const terrain = new THREE.Mesh(tg, new THREE.MeshStandardMaterial({ map: tex, color: tex ? 0xffffff : 0xb9b4a6, roughness: 0.95 }));
+  terrain.name = 'terrain';
+  terrain.receiveShadow = true;
+  group.add(terrain);
+
+  // Extrusions.
+  for (const m of snap.meshes) {
+    const g = new THREE.BufferGeometry();
+    g.setAttribute('position', new THREE.BufferAttribute(m.positions, 3));
+    g.setAttribute('normal', new THREE.BufferAttribute(m.normals, 3));
+    g.setAttribute('color', new THREE.BufferAttribute(linearColors(m.colors), 3));
+    g.setIndex(new THREE.BufferAttribute(m.index, 1));
+    const mesh = new THREE.Mesh(g, new THREE.MeshStandardMaterial({ vertexColors: true, roughness: 0.82 }));
+    mesh.name = m.name;
+    mesh.castShadow = true;
+    mesh.receiveShadow = true;
+    group.add(mesh);
+  }
+
+  // Trees and poles: instanced.
+  const mat4 = new THREE.Matrix4();
+  const q = new THREE.Quaternion();
+  const col = new THREE.Color();
+  for (const inst of snap.instances || []) {
+    const d = inst.data;
+    const count = d.length / 8;
+    if (inst.kind === 'tree') {
+      const crowns = new THREE.InstancedMesh(new THREE.IcosahedronGeometry(1, 1), new THREE.MeshStandardMaterial({ roughness: 0.9, flatShading: true }), count);
+      const trunkGeom = new THREE.CylinderGeometry(0.12, 0.16, 1, 6);
+      trunkGeom.translate(0, 0.5, 0);
+      const trunks = new THREE.InstancedMesh(trunkGeom, new THREE.MeshStandardMaterial({ color: 0x6b5139 }), count);
+      for (let i = 0; i < count; i++) {
+        const [x, y, z, h, r] = d.subarray(i * 8, i * 8 + 5);
+        const trunkH = Math.max(0.8, h - 1.6 * r);
+        mat4.compose(new THREE.Vector3(x, y, z), q, new THREE.Vector3(1.4, trunkH + 0.4, 1.4));
+        trunks.setMatrixAt(i, mat4);
+        mat4.compose(new THREE.Vector3(x, y + h - r, z), q, new THREE.Vector3(r, r * 1.05, r));
+        crowns.setMatrixAt(i, mat4);
+        col.setRGB(d[i * 8 + 5], d[i * 8 + 6], d[i * 8 + 7], THREE.SRGBColorSpace);
+        crowns.setColorAt(i, col);
+      }
+      crowns.name = `${inst.name} crowns`;
+      trunks.name = `${inst.name} trunks`;
+      for (const m of [crowns, trunks]) { m.castShadow = true; group.add(m); }
+    } else {
+      const geom = new THREE.CylinderGeometry(0.22, 0.26, 1, 8);
+      geom.translate(0, 0.5, 0);
+      const poles = new THREE.InstancedMesh(geom, new THREE.MeshStandardMaterial({ roughness: 0.6 }), count);
+      for (let i = 0; i < count; i++) {
+        const [x, y, z, h] = d.subarray(i * 8, i * 8 + 4);
+        mat4.compose(new THREE.Vector3(x, y - 0.2, z), q, new THREE.Vector3(1, h + 0.2, 1));
+        poles.setMatrixAt(i, mat4);
+        col.setRGB(d[i * 8 + 5], d[i * 8 + 6], d[i * 8 + 7], THREE.SRGBColorSpace);
+        poles.setColorAt(i, col);
+      }
+      poles.name = inst.name;
+      poles.castShadow = true;
+      group.add(poles);
+    }
+  }
+
+  // Facade tiles.
+  if (snap.facade && snap.facade.positions.length) {
+    const f = snap.facade;
+    const n = f.positions.length / 3;
+    const tiles = new THREE.InstancedMesh(new THREE.PlaneGeometry(1, 1), new THREE.MeshBasicMaterial({ side: THREE.DoubleSide, polygonOffset: true, polygonOffsetFactor: -2, polygonOffsetUnits: -2 }), n);
+    const zAxis = new THREE.Vector3(0, 0, 1);
+    const nv = new THREE.Vector3();
+    const p = new THREE.Vector3();
+    const s = new THREE.Vector3(f.size, f.size, 1);
+    for (let i = 0; i < n; i++) {
+      nv.set(f.normals[i * 3], f.normals[i * 3 + 1], f.normals[i * 3 + 2]);
+      q.setFromUnitVectors(zAxis, nv);
+      p.set(f.positions[i * 3], f.positions[i * 3 + 1], f.positions[i * 3 + 2]).addScaledVector(nv, 0.08);
+      mat4.compose(p, q, s);
+      tiles.setMatrixAt(i, mat4);
+      col.setRGB(f.colors[i * 3] / 255, f.colors[i * 3 + 1] / 255, f.colors[i * 3 + 2] / 255, THREE.SRGBColorSpace);
+      tiles.setColorAt(i, col);
+    }
+    tiles.name = 'facade results';
+    group.add(tiles);
+  }
+
+  // Flood surface.
+  if (snap.water) {
+    const g = new THREE.BufferGeometry();
+    g.setAttribute('position', new THREE.BufferAttribute(snap.water.positions, 3));
+    g.computeVertexNormals();
+    const w = new THREE.Mesh(g, new THREE.MeshStandardMaterial({ color: 0x2f7fc1, transparent: true, opacity: 0.62, roughness: 0.15 }));
+    w.name = 'water';
+    group.add(w);
+  }
+  return group;
+}
+
+/** JSON with typed arrays as base64 (the HTML export embeds the snapshot like this). */
+const TYPES = { Float32Array, Uint32Array, Uint16Array, Uint8Array, Int32Array };
+export function decodeSnapshot(json) {
+  return JSON.parse(json, (k, v) => {
+    if (v && typeof v === 'object' && v.__ta && TYPES[v.__ta]) {
+      const bin = atob(v.b64);
+      const bytes = new Uint8Array(bin.length);
+      for (let i = 0; i < bin.length; i++) bytes[i] = bin.charCodeAt(i);
+      return new TYPES[v.__ta](bytes.buffer);
+    }
+    return v;
+  });
+}

zero2geospatial3d/web/src/main.js

@@ -0,0 +1,75 @@
+// @ts-check
+// Entry point: load the scene named in ?scene=..., then build the panels.
+import { App } from './app.js';
+import { buildLayersPanel } from './ui/panel_layers.js';
+import { buildAnalyzePanel } from './ui/panel_analyze.js';
+import { buildTerrainPanel } from './ui/panel_terrain.js';
+import { buildComparePanel } from './ui/panel_compare.js';
+import { buildSunClock } from './ui/sunclock.js';
+import { buildViewTools } from './ui/viewtools.js';
+import { toast } from './ui/dom.js';
+
+const TABS = [
+  ['layers', 'Layers', buildLayersPanel],
+  ['analyze', 'Analyze', buildAnalyzePanel],
+  ['terrain', 'Terrain', buildTerrainPanel],
+  ['compare', 'Compare', buildComparePanel]
+];
+
+async function start() {
+  const params = new URLSearchParams(location.search);
+  const sceneUrl = params.get('scene') || '/scene/scene.json';
+  const app = new App();
+  /** @type {any} */ (window).geo3d = app; // handy in the browser console
+  try {
+    await app.load(sceneUrl);
+  } catch (e) {
+    console.error(e);
+    app.status(`Could not open the scene: ${e.message}`);
+    const el = document.getElementById('empty');
+    if (el) { el.hidden = false; el.querySelector('.detail').textContent = e.message; }
+    return;
+  }
+  document.title = `${app.manifest.title} · 02 Geo3D Analyzer`;
+  const title = document.getElementById('scene-title');
+  if (title) title.textContent = app.manifest.title;
+  buildSunClock(app, document.getElementById('sun-clock'));
+  buildViewTools(app);
+  const nav = document.getElementById('tabs');
+  const panels = document.getElementById('panels');
+  const built = new Map();
+  const show = (key) => {
+    for (const b of nav.querySelectorAll('button')) b.classList.toggle('active', b.dataset.tab === key);
+    for (const p of panels.children) /** @type {HTMLElement} */ (p).hidden = /** @type {HTMLElement} */ (p).dataset.tab !== key;
+    if (!built.has(key)) {
+      const [, , builder] = TABS.find(([k]) => k === key);
+      builder(app, panels.querySelector(`[data-tab="${key}"]`));
+      built.set(key, true);
+    }
+  };
+  for (const [key, label] of TABS) {
+    const b = document.createElement('button');
+    b.textContent = label;
+    b.dataset.tab = key;
+    b.onclick = () => show(key);
+    nav.appendChild(b);
+    const p = document.createElement('div');
+    p.dataset.tab = key;
+    p.className = 'panel';
+    p.hidden = true;
+    panels.appendChild(p);
+  }
+  show('layers');
+  // Build the analysis panel up front: it owns the shared parameters.
+  buildAnalyzePanel(app, panels.querySelector('[data-tab="analyze"]'));
+  built.set('analyze', true);
+  const fps = document.getElementById('fps');
+  setInterval(() => {
+    if (fps) fps.textContent = `${app.viewer.stats.fps.toFixed(0)} fps · ${app.viewer.stats.drawCalls} draws`;
+  }, 1000);
+  const warn = app.manifest.warnings || [];
+  if (warn.length) toast(warn[0], 'warn');
+  if (!app.qgis) toast('Opened without QGIS: results can be saved as files, not sent to QGIS.');
+}
+
+start();