leaflet-city-mapper 0.0.1 → 0.0.2

package/src/types/traffic.js

@@ -1,356 +0,0 @@
-import './3d.js';
-import { computeBounds } from '../utils/geometry.js';
-import { along, speed, toLanes, tripsAt, routeGeometry } from '../utils/traffic.js';
-import { build, vehicles } from '../utils/vehicles.js';
-import { underEntry } from '../utils/control.js';
-
-const tooltip = ({ properties: p }) => {
-  const content = document.createElement('div');
-  content.style.whiteSpace = 'pre-line';
-  content.textContent = [p.name, p.departure && `Departure ${p.departure} ${p.timetable.timeZone}`, p.description].filter(Boolean).join('\n');
-  return content;
-};
-
-function installTraffic(layer, { url, model, lights, side, outline, velocity }) {
-  const L = globalThis.L;
-  // The 'sunlight' layer on the same map drives the simulation time; without one, vehicles run live.
-  const now = () => {
-    let control = { live: true };
-    layer._map?.eachLayer(other => { if (other.control?.time) control = other.control; });
-    return { live: control.live, time: control.live ? new Date() : control.time };
-  };
-  const status = L.DomUtil.create('small', 'traffic-status');
-  status.style.cssText = 'display:block;max-width:200px;margin:0 0 4px 20px;color:#555;';
-  const template = build(model(0)), stride = template.position.length, vertices = stride / 3;
-  let ready = false, frame, request, lanes = [], tripsKey, mesh, route, litAt = -Infinity;
-  // Vehicles move on the GPU: `trips` are rebased at most once per second, a compute pass places them every frame.
-  let trips = [], rebasedAt = 0, nextCheck = -Infinity, elapsed = 0, gpu = null, lanesDirty = true, stale = false;
-  const params = new ArrayBuffer(16), paramFloats = new Float32Array(params), paramInts = new Uint32Array(params);
-
-  const createMesh = (data, featureFaces, material, usage = 0) => {
-    const result = layer._createMesh(data, material, usage);
-    result.extras.featureFaces = featureFaces;
-    return result;
-  };
-  const dispose = object => {
-    if (!object) return;
-    if (layer.highlightedFeature?.mesh === object) {
-      layer._setHighlight(null);
-      layer.hoveredFeature = null;
-      layer._showFeature(null);
-    }
-    layer._disposeMesh(object);
-  };
-  const fail = error => {
-    status.textContent = `Error: ${error.message}`;
-    status.setAttribute('role', 'alert');
-    console.error('Traffic layer', error);
-  };
-
-  const ground = () => {
-    const terrain = layer._map._terrain3D?._terrainReady && layer._map._terrain3D, base = layer.root.position[1];
-    for (const lane of lanes) lane.points.forEach((point, i) => {
-      const elevation = terrain && (lane.elevation ?? terrain._getElevation(lane.latlngs[i]));
-      point[2] = Number.isFinite(elevation) && Number.isFinite(base) ? elevation - base : 0;
-    });
-    lanesDirty = true;
-    nextCheck = -Infinity;
-  };
-  const prepare = () => {
-    const crs = layer._map.options.crs, origin = crs.project(layer.location);
-    const metres = Math.cos(layer.location.lat * Math.PI / 180);
-    for (const lane of lanes) {
-      lane.points = lane.latlngs.map(([lat, lng]) => {
-        const point = crs.project(new L.LatLng(lat, lng));
-        return [(point.x - origin.x) * metres, -(point.y - origin.y) * metres, 0];
-      });
-      lane.lengths = [0];
-      for (let i = 1; i < lane.points.length; i++) {
-        lane.lengths.push(lane.lengths[i - 1] + Math.hypot(lane.points[i][0] - lane.points[i - 1][0], lane.points[i][1] - lane.points[i - 1][1]));
-      }
-      lane.length = lane.lengths.at(-1);
-    }
-    ground();
-    dispose(route); route = null;
-    tripsKey = null;
-  };
-
-  // Dashed lane outline, just above the lanes.
-  const drawRoute = () => {
-
-    route = createMesh(routeGeometry(lanes), [], { emissive: [0.03, 0.25, 0.3], alphaMode: 'BLEND' });
-    route.renderOrder = 1000;
-  };
-  // One batched mesh, `vertices` per vehicle; the compute pass writes its position/normal buffers (STORAGE).
-  const rebuild = () => {
-    dispose(mesh); mesh = null;
-    if (!trips.length) return;
-    const color = trips.flatMap((trip, i) => build(model(i)).color), count = color.length / 3;
-    mesh = createMesh({ position: color.map(() => 0), normal: color.map(() => 0), color },
-      trips.map((trip, i) => ({ id: trip.id, properties: trip.properties, faceStart: i * vertices / 3, faceEnd: (i + 1) * vertices / 3,
-        vertexStart: i * vertices, vertexEnd: (i + 1) * vertices })), {}, GPUBufferUsage.STORAGE | GPUBufferUsage.COPY_SRC);
-    mesh.geometry.drawRange.count = count;
-    bounds();
-  };
-  // Vehicles never leave their lanes: cull and pick against the lanes' extent.
-  const bounds = () => {
-    const extent = { attributes: { position: { data: lanes.flatMap(lane => lane.points.flatMap(([x, z, y]) => [x - 20, y, z - 20, x + 20, y + 5, z + 20])) } } };
-    computeBounds(extent);
-    mesh.geometry.bounds = extent.bounds;
-  };
-
-  const destroyGpu = () => {
-    for (const buffer of [gpu?.params, gpu?.template, gpu?.points, gpu?.vehicles]) buffer?.destroy();
-    gpu = null;
-  };
-  const storage = (device, data) => {
-    const buffer = device.createBuffer({ size: Math.max(16, data.byteLength), usage: GPUBufferUsage.STORAGE | GPUBufferUsage.COPY_DST });
-    device.queue.writeBuffer(buffer, 0, data);
-    return buffer;
-  };
-  // Lane points are [x, z, ground, cumulative length]. Mirrors along() and place().
-  const shader = `
-    struct Params { seconds: f32, side: f32, vertices: u32, total: u32 }
-    struct Vehicle { start: u32, count: u32, base: f32, speed: f32 }
-    @group(0) @binding(0) var<uniform> params: Params;
-    @group(0) @binding(1) var<storage, read> model: array<f32>;
-    @group(0) @binding(2) var<storage, read> points: array<vec4f>;
-    @group(0) @binding(3) var<storage, read> vehicles: array<Vehicle>;
-    @group(0) @binding(4) var<storage, read_write> position: array<f32>;
-    @group(0) @binding(5) var<storage, read_write> normal: array<f32>;
-    @compute @workgroup_size(64)
-    fn main(@builtin(global_invocation_id) id: vec3u) {
-      let v = id.x;
-      if (v >= params.total) { return; }
-      let vehicle = vehicles[v / params.vertices];
-      let last = vehicle.start + vehicle.count - 1u;
-      let length = points[last].w;
-      var s = vehicle.base + params.seconds * vehicle.speed;
-      s -= length * floor(s / length);
-      var i = vehicle.start + 1u;
-      while (i < last && points[i].w < s) { i++; }
-      let a = points[i - 1u];
-      let b = points[i];
-      let d = select(b.w - a.w, 1.0, b.w == a.w);
-      let t = (s - a.w) / d;
-      let dx = (b.x - a.x) / d;
-      let dz = (b.y - a.y) / d;
-      let cx = a.x + (b.x - a.x) * t - dz * params.side;
-      let cz = a.y + (b.y - a.y) * t + dx * params.side;
-      let y = a.z + (b.z - a.z) * t;
-      let k = (v % params.vertices) * 3u;
-      let n = params.vertices * 3u + k;
-      let o = v * 3u;
-      position[o] = cx - model[k] * dz - model[k + 2u] * dx;
-      position[o + 1u] = y + model[k + 1u];
-      position[o + 2u] = cz + model[k] * dx - model[k + 2u] * dz;
-      normal[o] = -model[n] * dz - model[n + 2u] * dx;
-      normal[o + 1u] = model[n + 1u];
-      normal[o + 2u] = model[n] * dx - model[n + 2u] * dz;
-    }`;
-  // Upload lanes and the rebased trips; the CPU copy is refreshed only for picking (place()).
-  const rebase = () => {
-    const { device } = layer.renderer;
-    if (gpu?.device !== device) {
-      destroyGpu();
-      gpu = {
-        device,
-        pipeline: device.createComputePipeline({ layout: 'auto', compute: { module: device.createShaderModule({ code: shader }), entryPoint: 'main' } }),
-        params: device.createBuffer({ size: 16, usage: GPUBufferUsage.UNIFORM | GPUBufferUsage.COPY_DST }),
-        template: storage(device, new Float32Array([...template.position, ...template.normal])),
-      };
-      lanesDirty = true;
-    }
-    if (lanesDirty) {
-      const data = new Float32Array(lanes.reduce((count, lane) => count + lane.points.length, 0) * 4);
-      let offset = 0;
-      for (const lane of lanes) {
-        lane.start = offset / 4;
-        lane.points.forEach((point, i) => { data.set([point[0], point[1], point[2], lane.lengths[i]], offset); offset += 4; });
-      }
-      gpu.points?.destroy();
-      gpu.points = storage(device, data);
-      lanesDirty = false;
-    }
-    const data = new Float32Array(trips.length * 4), index = new Uint32Array(data.buffer);
-    trips.forEach((trip, i) => {
-      index[i * 4] = trip.lane.start;
-      index[i * 4 + 1] = trip.lane.points.length;
-      data[i * 4 + 2] = trip.distance;
-      data[i * 4 + 3] = trip.speed;
-      mesh.extras.featureFaces[i].properties = trip.properties;
-    });
-    if (gpu.vehicles?.size >= data.byteLength) device.queue.writeBuffer(gpu.vehicles, 0, data);
-    else {
-      gpu.vehicles?.destroy();
-      gpu.vehicles = storage(device, data);
-    }
-    const { position, normal } = mesh.geometry.attributes;
-    gpu.bindGroup = device.createBindGroup({
-      layout: gpu.pipeline.getBindGroupLayout(0),
-      entries: [gpu.params, gpu.template, gpu.points, gpu.vehicles, position.buffer, normal.buffer]
-        .map((buffer, binding) => ({ binding, resource: { buffer } })),
-    });
-  };
-  const move = seconds => {
-    const { device } = gpu;
-    paramFloats[0] = elapsed = seconds;
-    paramFloats[1] = side;
-    paramInts[2] = vertices;
-    paramInts[3] = trips.length * vertices;
-    device.queue.writeBuffer(gpu.params, 0, params);
-    const encoder = device.createCommandEncoder(), pass = encoder.beginComputePass();
-    pass.setPipeline(gpu.pipeline);
-    pass.setBindGroup(0, gpu.bindGroup);
-    pass.dispatchWorkgroups(Math.ceil(paramInts[3] / 64));
-    pass.end();
-    device.queue.submit([encoder.finish()]);
-    stale = true;
-  };
-  // CPU twin of the compute pass: the centre of `trip` and its heading.
-  const locate = trip => {
-    const { points, lengths, length } = trip.lane;
-    let distance = trip.distance + elapsed * trip.speed;
-    distance -= length * Math.floor(distance / length);
-    const { x, y, z, dx, dz } = along(points, lengths, distance);
-    return { x: x - dz * side, y, z: z + dx * side, dx, dz };
-  };
-  // Run lazily before picking.
-  const place = () => {
-    if (!mesh || !stale) return;
-    stale = false;
-    const { position, normal } = mesh.geometry.attributes;
-    trips.forEach((trip, i) => {
-      const { x: cx, y, z: cz, dx, dz } = locate(trip);
-      for (let k = 0, o = i * stride; k < stride; k += 3, o += 3) {
-        const lx = template.position[k], lz = template.position[k + 2], nx = template.normal[k], nz = template.normal[k + 2];
-        position.data[o] = cx - lx * dz - lz * dx;
-        position.data[o + 1] = y + template.position[k + 1];
-        position.data[o + 2] = cz + lx * dx - lz * dz;
-        normal.data[o] = -nx * dz - nz * dx;
-        normal.data[o + 1] = template.normal[k + 1];
-        normal.data[o + 2] = nx * dx - nz * dz;
-      }
-    });
-  };
-  const raycast = layer.raycast;
-  layer.raycast = function (...args) {
-    place();
-    return raycast.apply(this, args);
-  };
-
-  const tick = () => {
-    frame = undefined;
-    if (!ready || !layer._map) return;
-    // Re-adding after the last GPU owner was removed can attach asynchronously.
-    if (!layer.renderer) { frame = requestAnimationFrame(tick); return; }
-    // A renderer change re-creates vertex buffers without STORAGE: rebuild the mesh.
-    if (mesh && !(mesh.geometry.attributes.position.buffer.usage & GPUBufferUsage.STORAGE)) { tripsKey = null; nextCheck = -Infinity; }
-    const { live, time } = now(), ms = time?.getTime(), valid = Number.isFinite(ms);
-    let changed = false;
-    // Trips only change at timetable/hour boundaries: re-check once per second while live.
-    if (!live || !valid || !(ms >= rebasedAt && ms < nextCheck)) {
-      let text;
-      try {
-        trips = valid ? tripsAt(time, lanes, velocity) : [];
-        text = !valid ? 'Select a valid simulation date' : !loaded ? 'Loading…' :
-          `${trips.length} vehicle${trips.length === 1 ? '' : 's'}${loaded.note ? ` · ${loaded.note}` : ''}`;
-      } catch (error) { return fail(error); }
-      rebasedAt = ms;
-      nextCheck = ms + 1000;
-      const key = trips.map(trip => trip.id).join();
-      changed = key !== tripsKey || (outline && !route && lanes.length);
-      if (outline && !route && lanes.length) drawRoute();
-      if (key !== tripsKey) { rebuild(); tripsKey = key; }
-      if (mesh) rebase();
-      if (status.textContent !== text) status.textContent = text;
-      status.removeAttribute('role');
-    }
-    if (mesh) move((ms - rebasedAt) / 1000);
-    // ponytail: night point lights follow the vehicles at 10 Hz via the shared CPU light grid (~5 ms with thousands of lamps);
-    // bin the lights in a compute pass if it shows up in profiles.
-    if (mesh && lights && (!live || !(performance.now() - litAt < 100))) {
-      litAt = performance.now();
-      mesh.extras.lights = trips.flatMap(trip => {
-        const { x, y, z, dx, dz } = locate(trip);
-        return lights.map(({ position: [lx, ly, lz], ...light }) => ({ ...light, position: [x - lx * dz - lz * dx, y + ly, z + lx * dx - lz * dz] }));
-      });
-    }
-    if (mesh || changed) layer.update();
-    if (live && valid) frame = requestAnimationFrame(tick);
-  };
-  let loaded, file;
-  // A JS module serves time-dependent lanes; anything else is a static GeoJSON file, fetched once.
-  const fetchLanes = async (time, signal) => {
-    const href = new URL(url, document.baseURI).href;
-    if (/\.m?js(?:[?#]|$)/i.test(url)) return (await import(href)).default(time, layer, signal);
-    if (!file) {
-      const response = await fetch(href, { signal });
-      if (!response.ok) throw new Error(`HTTP ${response.status}`);
-      file = await response.json();
-    }
-    return file;
-  };
-  const load = () => {
-    const { time } = now();
-    if (!Number.isFinite(time?.getTime())) return;
-    request?.abort();
-    const { signal } = request = new AbortController();
-    fetchLanes(time, signal).then(data => {
-      if (signal.aborted || !layer._map || data === loaded) return;
-      loaded = data;
-      lanes = toLanes(data);
-      prepare();
-      if (!frame) tick();
-    }, error => { if (error.name !== 'AbortError') fail(error); });
-  };
-  // 'layerremove' fires once the clock layer has really left the map.
-  const update = event => {
-    if (event?.layer === layer) return;
-    cancelAnimationFrame(frame);
-    load();
-    tick();
-  };
-  const terrain = () => {
-    if (!lanes.length) return;
-    ground();
-    dispose(route); route = null;
-    if (mesh) bounds();
-    if (!frame) tick();
-  };
-  const start = () => {
-    layer._map.off('simulationtimechange layerremove', update).on('simulationtimechange layerremove', update);
-    layer._map.off('terrainchange', terrain).on('terrainchange', terrain);
-    underEntry(layer, status);
-    update();
-  };
-  layer.on('ready', () => { ready = true; if (layer._map) start(); });
-  layer.on('add', () => { if (ready) start(); });
-  layer.on('remove', () => {
-    request?.abort();
-    cancelAnimationFrame(frame); frame = undefined;
-    layer._map.off('simulationtimechange layerremove', update).off('terrainchange', terrain);
-    dispose(mesh); dispose(route); mesh = route = null;
-    destroyGpu();
-    lanes = []; trips = []; tripsKey = loaded = null;
-  });
-}
-
-/**
- * Vehicles moving along GeoJSON lanes; a compute pass places them on the GPU every frame.
- * Source options:
- * - `url`: GeoJSON (Multi)LineStrings, or a JS module whose default export `(time, layer, signal)` returns them (time-dependent data);
- * - `vehicle`: 'car' (default) or 'boat'; `side`: offset right of the lane centreline in metres (vehicle default);
- * - `speed`: m/s of `flow` lanes; `outline`: draw the lanes.
- * Lane properties: `flow` (vehicles/h) or `timetable` (see scheduledTrips in utils/traffic.js), optional fixed `elevation`
- * in metres, `name`/`description` for the default tooltip. The status line (vehicle count, then the FeatureCollection `note`) sits under the layer's entry in the layers control.
- * The 'sunlight' layer on the same map drives the time; without one, vehicles run live.
- */
-L.Layer.types.traffic = L.Layer.types['3d'].extend({
-  initialize({ url, vehicle = 'car', side, outline = false, speed: velocity = speed, ...options } = {}) {
-    if (!url) throw new Error('Traffic needs a source url');
-    if (!vehicles[vehicle]) throw new Error(`Unknown vehicle: ${vehicle}`);
-    L.Layer.types['3d'].prototype.initialize.call(this, { tooltipContent: tooltip, nightLight: Boolean(vehicles[vehicle].lights), ...options });
-    installTraffic(this, { url, ...vehicles[vehicle], side: side ?? vehicles[vehicle].side, outline, velocity });
-  },
-});

package/src/types/walk.js

@@ -1,219 +0,0 @@
-import { CELL, collider, horizontalRay, parts, limbs } from '../utils/walk.js';
-import './3d.js';
-import { computeBounds } from '../utils/geometry.js';
-import { traverse, updateWorldMatrix } from '../utils/scene.js';
-import { build } from '../utils/vehicles.js';
-
-// W/S (↑/↓) run forward/back along the heading, A/D (←/→) turn: [forward, turn].
-const moves = { KeyW: [1, 0], ArrowUp: [1, 0], KeyS: [-1, 0], ArrowDown: [-1, 0], KeyD: [0, 1], ArrowRight: [0, 1], KeyA: [0, -1], ArrowLeft: [0, -1] };
-const wrap = angle => Math.atan2(Math.sin(angle), Math.cos(angle));
-
-// Horizontal normal of the nearest wall faced within `reach` metres of the feet at world (x, y, z), walking along
-// the unit (dx, dz); knee and chest rays, so arches and tree crowns above the head let the walker through.
-// ponytail: traffic vehicles and boats move on the GPU and are not obstacles.
-function hit(layer, x, y, z, dx, dz, reach) {
-  const types = globalThis.L.Layer.types, skip = other => other === layer ||
-    ['terrain', 'traffic'].some(name => types[name] && other instanceof types[name]);
-  updateWorldMatrix(layer.scene);
-  let best = reach, found = null;
-  for (const other of layer._shared._layers) {
-    if (skip(other)) continue;
-    traverse(other.root, mesh => {
-      if (!mesh.visible) return true;
-      if (!mesh.geometry?.attributes?.position?.data || mesh.program?.depthTest === false) return;
-      if (!mesh.geometry.bounds) computeBounds(mesh.geometry);
-      const m = mesh.worldMatrix, { center: k, radius } = mesh.geometry.bounds;
-      if (Math.hypot(m[0] * k[0] + m[4] * k[1] + m[8] * k[2] + m[12] - x, m[2] * k[0] + m[6] * k[1] + m[10] * k[2] + m[14] - z) >
-        radius * Math.hypot(m[0], m[1], m[2]) + reach) return;
-      const c = collider(mesh), ox = x - m[12] + c.origin[0], oy = y - m[13] + c.origin[1], oz = z - m[14] + c.origin[2];
-      const seen = new Set();
-      for (let ix = Math.floor(Math.min(ox, ox + dx * reach) / CELL); ix <= Math.floor(Math.max(ox, ox + dx * reach) / CELL); ix++)
-        for (let iz = Math.floor(Math.min(oz, oz + dz * reach) / CELL); iz <= Math.floor(Math.max(oz, oz + dz * reach) / CELL); iz++)
-          for (const t of c.cells.get(ix + ',' + iz) || []) {
-            // Walls are one-way: walking out of a building (e.g. starting inside one) is allowed.
-            if (seen.has(t) || dx * c.nrm[t * 2] + dz * c.nrm[t * 2 + 1] >= 0) continue;
-            seen.add(t);
-            for (const height of [0.4, 1.5]) {
-              const d = horizontalRay(c.tri, t, ox, oy + height, oz, dx, dz);
-              if (d >= 0 && d < best) { best = d; found = [c.nrm[t * 2], c.nrm[t * 2 + 1]]; }
-            }
-          }
-    });
-  }
-  return found;
-}
-
-function installWalk(layer, { speed, distance, position }) {
-  const L = globalThis.L, keys = new Set();
-  // Map button (leaflet-bar look) toggling the walk; the key hint shows beside it while walking.
-  const control = new L.Control({ position });
-  const container = L.DomUtil.create('div', 'leaflet-bar leaflet-control');
-  container.style.cssText = 'display:flex;align-items:center;background:#fff;';
-  const button = L.DomUtil.create('button', '', container);
-  button.type = 'button';
-  button.title = 'Walk';
-  button.setAttribute('aria-label', 'Walk');
-  button.setAttribute('aria-pressed', 'false');
-  button.textContent = '🚶';
-  button.style.cssText = 'width:30px;height:30px;padding:0;border:0;border-radius:4px;background:#fff;font-size:18px;line-height:30px;cursor:pointer;';
-  const hint = L.DomUtil.create('small', '', container);
-  hint.style.cssText = 'display:none;padding:0 8px;color:#333;white-space:nowrap;';
-  hint.textContent = 'W/S: run · A/D: turn · drag: look around · Esc: exit';
-  L.DomEvent.disableClickPropagation(container);
-  control.onAdd = () => container;
-  let meshes, frame, last, swing = 0, saved, drag;
-  // Walker state: position, compass heading (radians, clockwise from north) and stride phase.
-  const state = layer.walker = { latlng: null, heading: 0, phase: 0 };
-
-  // Feet position in this layer's root space.
-  const local = () => {
-    const map = layer._map, crs = map.options.crs, origin = crs.project(layer.location), metres = Math.cos(layer.location.lat * Math.PI / 180);
-    const p = crs.project(state.latlng), terrain = map._terrain3D?._terrainReady && map._terrain3D;
-    const ground = (terrain && terrain._getElevation(state.latlng)) || 0;
-    return [(p.x - origin.x) * metres, ground - layer.root.position[1], -(p.y - origin.y) * metres];
-  };
-  const place = () => {
-    const [x, y, z] = local();
-    // Model forward is -z; a yaw of -heading turns it to the compass heading (x east, -z north).
-    const yaw = -state.heading, cos = Math.cos(yaw), sin = Math.sin(yaw);
-    limbs.forEach(([, px, py, sign], i) => {
-      const mesh = meshes[i];
-      mesh.position[0] = x + px * cos; mesh.position[1] = y + py; mesh.position[2] = z - px * sin;
-      mesh.rotation[0] = sign * swing * Math.sin(state.phase);
-      mesh.rotation[1] = yaw;
-    });
-    layer.update();
-  };
-
-  const step = now => {
-    frame = requestAnimationFrame(step);
-    const map = layer._map, dt = Math.min(0.1, (now - (last ?? now)) / 1000);
-    last = now;
-    if (!layer.renderer) return;
-    let changed = false;
-    if (!meshes) { meshes = limbs.map(([part]) => layer._createMesh(build(parts[part]))); changed = true; }
-    let forward = 0, turn = 0;
-    for (const key of keys) { forward += moves[key]?.[0] || 0; turn += moves[key]?.[1] || 0; }
-    forward = Math.sign(forward); turn = Math.sign(turn);
-    if (turn) { state.heading = wrap(state.heading + turn * 2.5 * dt); changed = true; }
-    if (forward) {
-      const metres = forward * speed * dt, { lat, lng } = state.latlng, { position, scale } = layer.root;
-      let east = Math.sin(state.heading) * metres, north = Math.cos(state.heading) * metres;
-      const feet = local().map((value, i) => position[i] + scale[i] * value);
-      // World x is east, z south; keep 0.3 m from walls and slide along the one in the way.
-      const blocked = () => {
-        const length = Math.hypot(east, north);
-        return length > 1e-6 && hit(layer, feet[0], feet[1], feet[2], east / length, -north / length, length + 0.3);
-      };
-      const wall = blocked();
-      if (wall) {
-        const into = east * wall[0] - north * wall[1];
-        east -= into * wall[0]; north += into * wall[1];
-        if (blocked()) east = north = 0;
-      }
-      state.latlng = new L.LatLng(lat + north / 111320, lng + east / (111320 * Math.cos(lat * Math.PI / 180)));
-      state.phase += Math.hypot(east, north) / 1.6 * Math.PI;
-      changed = true;
-    }
-    if (forward || turn) {
-      // The camera (looking along -bearing) swings back behind the walker.
-      const bearing = map.getBearing() * Math.PI / 180, behind = wrap(-state.heading - bearing);
-      if (Math.abs(behind) > 1e-3) map._setPitchAndBearing(map.getPitch(), (bearing + behind * Math.min(1, dt * 4)) * 180 / Math.PI);
-      map.setView(state.latlng, map.getZoom(), { animate: false });
-    }
-    const target = forward ? 0.9 : 0;
-    if (Math.abs(swing - target) > 1e-3) { swing += (target - swing) * Math.min(1, dt * 10); changed = true; }
-    if (changed) place();
-  };
-
-  const onKey = event => {
-    // Text fields and sliders keep their keys; buttons and checkboxes (e.g. the Walk button, focused once clicked) don't.
-    if (event.target.closest?.('input:not([type=checkbox], [type=radio]), select, textarea, [contenteditable]') ||
-      event.ctrlKey || event.altKey || event.metaKey) return;
-    if (event.type === 'keydown' && event.code === 'Escape') { stop(); return; }
-    if (!moves[event.code]) return;
-    event.preventDefault();
-    if (event.type === 'keydown') keys.add(event.code); else keys.delete(event.code);
-  };
-  const onBlur = () => keys.clear();
-  // Dragging only turns the camera around the walker: horizontal = bearing, vertical = pitch.
-  const onPointer = event => {
-    const map = layer._map;
-    if (event.type === 'pointerdown') {
-      if (event.button !== 0 || event.target.closest('.leaflet-control')) return;
-      drag = { x: event.clientX, y: event.clientY };
-      map.getContainer().setPointerCapture(event.pointerId);
-    } else if (drag && event.type === 'pointermove') {
-      map._setPitchAndBearing(Math.max(20, Math.min(85, map.getPitch() - (event.clientY - drag.y) * 0.2)),
-        map.getBearing() - (event.clientX - drag.x) * 0.25);
-      drag = { x: event.clientX, y: event.clientY };
-    } else drag = null;
-  };
-  const onTerrain = () => { if (meshes) place(); };
-
-  const start = () => {
-    const map = layer._map;
-    if (saved || !map) return;
-    state.latlng = map.getCenter();
-    // Zoom whose camera distance (1.5 viewport heights, as in scene/render.js) is about `distance` metres behind the walker.
-    const pixelsPerMetre = map.getSize().y * 1.5 / distance;
-    const zoom = Math.min(map.getMaxZoom(), Math.log2(pixelsPerMetre * 40075016.68557849 * Math.cos(state.latlng.lat * Math.PI / 180) / 256));
-    saved = { zoom: map.getZoom(), pitch: map.getPitch(), scrollWheelZoom: map.options.scrollWheelZoom,
-      handlers: ['dragging', 'keyboard', 'doubleClickZoom', 'boxZoom'].filter(name => map[name]?.enabled()) };
-    for (const name of saved.handlers) map[name].disable();
-    // Wheel zoom moves the camera closer or farther, keeping the walker centred.
-    map.options.scrollWheelZoom = saved.scrollWheelZoom && 'center';
-    state.heading = -map.getBearing() * Math.PI / 180;
-    map.setView(state.latlng, zoom, { animate: false });
-    map.setPitch(75);
-    L.DomEvent.on(document, 'keydown keyup', onKey);
-    L.DomEvent.on(window, 'blur', onBlur);
-    L.DomEvent.on(map.getContainer(), 'pointerdown pointermove pointerup pointercancel', onPointer);
-    map.on('terrainchange', onTerrain);
-    button.setAttribute('aria-pressed', 'true');
-    button.style.background = '#e4e4e4';
-    hint.style.display = '';
-    last = undefined;
-    frame = requestAnimationFrame(step);
-  };
-  const stop = () => {
-    const map = layer._map;
-    cancelAnimationFrame(frame);
-    keys.clear(); drag = null;
-    L.DomEvent.off(document, 'keydown keyup', onKey);
-    L.DomEvent.off(window, 'blur', onBlur);
-    for (const mesh of meshes || []) layer._disposeMesh(mesh);
-    meshes = null;
-    button.setAttribute('aria-pressed', 'false');
-    button.style.background = '#fff';
-    hint.style.display = 'none';
-    if (!map || !saved) return;
-    L.DomEvent.off(map.getContainer(), 'pointerdown pointermove pointerup pointercancel', onPointer);
-    map.off('terrainchange', onTerrain);
-    map.options.scrollWheelZoom = saved.scrollWheelZoom;
-    for (const name of saved.handlers) map[name].enable();
-    map.setView(state.latlng, saved.zoom, { animate: false });
-    map.setPitch(saved.pitch);
-    saved = null;
-  };
-  L.DomEvent.on(button, 'click', () => (saved ? stop() : start()));
-  let ready = false;
-  layer.on('ready', () => { ready = true; if (layer._map) control.addTo(layer._map); });
-  layer.on('add', () => { if (ready) control.addTo(layer._map); });
-  layer.on('remove', () => { stop(); control.remove(); });
-}
-
-/**
- * Third-person walk mode, toggled by a map button (and Esc): a pedestrian at the map centre runs with W/S (or ↑/↓) and
- * turns with A/D (or ←/→); the camera swings back behind it while it moves. Dragging the map only turns the camera
- * (bearing, pitch); the wheel changes the camera distance.
- * The walker follows the terrain, bridges included, and `layer.walker` exposes `{ latlng, heading, phase }`.
- * Source options: `speed` (m/s, default 6), `distance` (camera distance in metres, default 20), `position` (button corner, default 'topleft').
- * Visible meshes of the other 3D layers (buildings, trees, models, streetlights) are solid; terrain and traffic are not.
- */
-L.Layer.types.walk = L.Layer.types['3d'].extend({
-  initialize({ speed = 70, distance = 20, position = 'bottomright', ...options } = {}) {
-    L.Layer.types['3d'].prototype.initialize.call(this, options);
-    installWalk(this, { speed, distance, position });
-  },
-});