leaflet-city-mapper 0.0.2 → 0.0.3

package/src/rendering/rebuildRoofAtlas.js

@@ -0,0 +1,67 @@
+import { ensureRoofBlit } from './ensureRoofBlit.js';
+import { composeRoofAtlas } from './composeRoofAtlas.js';
+import { destroyTexture } from './destroyTexture.js';
+import { getRasterTileSize } from '../raster/getRasterTileSize.js';
+
+export function rebuildRoofAtlas(backend, rasters, signature, now) {
+  const map = backend._map, renderer = backend.renderer;
+  const tiles = [];
+  let zoom = -Infinity;
+  let layer, tile, coords, size2;
+  for (layer of rasters) for (tile of layer._rasterTiles.values()) {
+    if (tile.done && !tile.request.signal.aborted && tile.image) {
+      tiles.push({ tile, layer });
+      zoom = Math.max(zoom, tile.coords.z);
+    }
+  }
+  if (!tiles.length) zoom = map.getZoom();
+  const bounds = new L.Bounds();
+  for ({ tile: { coords }, layer } of tiles) {
+    size2 = getRasterTileSize().multiplyBy(map.getZoomScale(zoom, coords.z));
+    bounds.extend(new L.Point(coords.x, coords.y).scaleBy(size2));
+    bounds.extend(new L.Point(coords.x + 1, coords.y + 1).scaleBy(size2));
+  }
+  const min = bounds.min || map.project(backend._sceneOrigin, zoom);
+  const size = bounds.isValid() ? bounds.getSize() : new L.Point(1, 1);
+  // ponytail: cap at 4096 px; virtual textures if wide views need native detail.
+  const limit = 4096;
+  const scale = Math.min(1, limit / Math.max(size.x, size.y));
+  const width = Math.max(1, Math.ceil(size.x * scale));
+  const height = Math.max(1, Math.ceil(size.y * scale));
+  const origin = map.project(backend._sceneOrigin, zoom);
+  const pixels = map.options.crs.scale(zoom) / (40075016.68557849 * Math.cos(backend._sceneOrigin.lat * Math.PI / 180));
+  const matrix = new DOMMatrix();
+  matrix.m11 = pixels / size.x; matrix.m33 = pixels / size.y;
+  matrix.m41 = (origin.x - min.x) / size.x; matrix.m43 = (origin.y - min.y) / size.y;
+  const texture = backend._roofRaster?.texture;
+  if (texture && (texture.width !== width || texture.height !== height)) {
+    destroyTexture(backend, texture.texture);
+    texture.texture = renderer.device.createTexture({
+      size: [width, height],
+      format: 'rgba8unorm',
+      usage: GPUTextureUsage.TEXTURE_BINDING | GPUTextureUsage.COPY_DST | GPUTextureUsage.RENDER_ATTACHMENT,
+    });
+    texture.width = width;
+    texture.height = height;
+  }
+  backend._roofRaster = {
+    signature, updatedAt: now, matrix: Array.from(matrix.toFloat64Array()),
+    texture: texture || {
+      device: renderer.device,
+      texture: renderer.device.createTexture({
+        size: [width, height],
+        format: 'rgba8unorm',
+        usage: GPUTextureUsage.TEXTURE_BINDING | GPUTextureUsage.COPY_DST | GPUTextureUsage.RENDER_ATTACHMENT,
+      }),
+      sampler: renderer.device.createSampler({
+        addressModeU: 'clamp-to-edge', addressModeV: 'clamp-to-edge',
+      }),
+      samplerOptions: { addressModeU: 'clamp-to-edge', addressModeV: 'clamp-to-edge' },
+      image: null, width, height,
+      format: 'rgba8unorm', srgb: false, flipY: false, uploaded: null,
+    },
+  };
+  // Compose the atlas on the GPU: re-uploading a large canvas stalls Firefox for hundreds of ms.
+  ensureRoofBlit(renderer);
+  composeRoofAtlas(backend, tiles, zoom, min, size, width, height);
+}

package/src/rendering/render.js

@@ -0,0 +1,57 @@
+import { synchronizeZoomView } from './synchronizeZoomView.js';
+import { resizeRenderer } from './resizeRenderer.js';
+import { updateMapCamera } from './updateMapCamera.js';
+import { collectFrameMeshes } from './collectFrameMeshes.js';
+import { updateRoofRaster } from './updateRoofRaster.js';
+import { prepareFrameMeshes } from './prepareFrameMeshes.js';
+import { prepareFrameUniforms } from './prepareFrameUniforms.js';
+import { drawSceneMeshes } from './drawSceneMeshes.js';
+import { updateWorldMatrix } from "../scene/updateWorldMatrix.js";
+import { renderSunlight } from '../shadows/renderSunlight.js';
+import { cancelUpdate } from '../scene/cancelUpdate.js';
+import { update } from '../scene/update.js';
+import { pruneRasterTiles } from '../raster/pruneRasterTiles.js';
+
+/**
+ * Rendering owner: CSS pixels -> scene metres -> perspective camera.
+ * Lights and transparent sort centers are converted into the current camera space.
+ * Without raster tiles, logical map projection supplies the same static alignment.
+ */
+
+export function render(backend) {
+  cancelUpdate(backend);
+  if (backend._shared !== backend || !backend.renderer) return;
+  const map = backend._map;
+  const now = performance.now();
+  const size = map.getSize();
+  if (!size.x || !size.y) return;
+  synchronizeZoomView(backend, now);
+  resizeRenderer(backend, size);
+  updateMapCamera(backend, size);
+  updateWorldMatrix(backend.scene);
+  let sceneChanged = false;
+  let layer;
+  for (layer of backend._layers) {
+    if (!layer._beforeRender) continue;
+    layer._beforeRender();
+    sceneChanged = true;
+  }
+  const sunlight = map._sunlight;
+  collectFrameMeshes(backend, sunlight, sceneChanged);
+  const shadowMeshes = backend._shadowMeshes;
+  const renderer = backend.renderer;
+  const rasters = updateRoofRaster(backend, now);
+  const meshes = renderer.frameMeshes ||= [];
+  meshes.length = 0;
+  let appearing = prepareFrameMeshes(backend, rasters, now, meshes);
+  const encoder = renderer.device.createCommandEncoder();
+  prepareFrameUniforms(backend, meshes, shadowMeshes, sunlight);
+  renderSunlight(backend, encoder, shadowMeshes, sunlight);
+  drawSceneMeshes(backend, encoder, meshes);
+  renderer.device.queue.writeBuffer(renderer.uniformBuffer, 0, renderer.uniformData, 0, renderer.uniformSlot * 64);
+  renderer.device.queue.submit([encoder.finish()]);
+  for (layer of backend._layers) {
+    if (layer._wantedRasterTiles) appearing = pruneRasterTiles(layer) || appearing;
+  }
+  if (map._animatingZoom || appearing) update(backend);
+}

package/src/rendering/reportCompilation.js

@@ -0,0 +1,17 @@
+export async function reportCompilation(backend, pending) {
+  let info, message;
+  try {
+    const infos = await Promise.all(pending);
+    const errors = [];
+    for (info of infos) {
+      for (message of info.messages) if (message.type === 'error') errors.push(message.message);
+    }
+    if (errors.length) {
+      backend.fire('error', {
+        error: new Error(`Unable to compile Layer3D WGSL: ${errors.join('\n')}`),
+      });
+    }
+  } catch (error) {
+    backend.fire('error', { error });
+  }
+}

package/src/rendering/resizeRenderer.js

@@ -0,0 +1,19 @@
+import { destroyTexture } from './destroyTexture.js';
+
+export function resizeRenderer(backend, size) {
+  if (!backend._size || !backend._size.equals(size)) {
+    backend.renderer.width = size.x;
+    backend.renderer.height = size.y;
+    backend.renderer.canvas.width = Math.round(size.x * backend.renderer.dpr);
+    backend.renderer.canvas.height = Math.round(size.y * backend.renderer.dpr);
+    backend.renderer.canvas.style.width = `${size.x}px`;
+    backend.renderer.canvas.style.height = `${size.y}px`;
+    if (backend.renderer.depthTexture) destroyTexture(backend, backend.renderer.depthTexture);
+    backend.renderer.depthTexture = backend.renderer.device.createTexture({
+      size: [backend.renderer.canvas.width, backend.renderer.canvas.height],
+      format: 'depth24plus',
+      usage: GPUTextureUsage.RENDER_ATTACHMENT,
+    });
+    backend._size = size;
+  }
+}

package/src/rendering/sortMeshes.js

@@ -0,0 +1,6 @@
+
+import { compareMeshes } from './compareMeshes.js';
+
+export function sortMeshes(meshes) {
+  return meshes.sort(compareMeshes);
+}

package/src/rendering/synchronizeZoomView.js

@@ -0,0 +1,34 @@
+export function synchronizeZoomView(backend, now) {
+  const map = backend._map;
+  let animation, time, start;
+  if (map._animatingZoom) {
+    backend._zoomTransitions ||= new Map();
+    for (animation of map.getContainer().getAnimations({ subtree: true })) {
+      if (!(animation instanceof CSSTransition) || animation.transitionProperty !== 'transform' ||
+        !animation.effect.target.classList.contains('leaflet-zoom-animated') ||
+        backend._zoomTransitions.has(animation)) {
+        continue;
+      }
+      time = animation.currentTime || 0;
+      animation.pause();
+      backend._zoomTransitions.set(animation, { start: now, time });
+    }
+    // Freeze CSS between rendered frames: the compositor must not outrun the canvas.
+    for ([animation, { start, time }] of backend._zoomTransitions) {
+      animation.currentTime = Math.min(animation.effect.getComputedTiming().endTime, time + now - start);
+    }
+    if (backend._zoomView) {
+      const view = backend._zoomView;
+      let proxy;
+      for (animation of backend._zoomTransitions.keys()) {
+        if (animation.effect.target === map._proxy) { proxy = animation; break; }
+      }
+      const progress = proxy?.effect.getComputedTiming().progress ?? Math.min(1, (now - view.start) / 250);
+      const targetScale = map.getZoomScale(view.targetZoom, view.zoom), scale = 1 + (targetScale - 1) * progress;
+      const from = map.project(view.from, view.zoom), to = map.project(view.to, view.zoom);
+      map._cameraView = { zoom: map.getScaleZoom(scale, view.zoom),
+        center: map.unproject(from.add(to.subtract(from).multiplyBy(targetScale * progress / scale)), view.zoom) };
+      map._updateCameraOverlays();
+    }
+  }
+}

package/src/rendering/textureBinding.js

@@ -0,0 +1,7 @@
+export function textureBinding(bindings, name, enabled) {
+  if (!enabled) return '';
+  const current = 3 + bindings.length * 2;
+  bindings.push({ name, texture: current, sampler: current + 1 });
+  return /* wgsl */ `@group(0) @binding(${current}) var ${name}: texture_2d<f32>;
+      @group(0) @binding(${current + 1}) var ${name}Sampler: sampler;`;
+}

package/src/rendering/updateMapCamera.js

@@ -0,0 +1,32 @@
+import { updateCamera } from "../scene/updateCamera.js";
+import { getElevation } from "../terrain/getElevation.js";
+
+export function updateMapCamera(backend, size) {
+  const map = backend._map;
+  // Match the map's perspective, including the intermediate view of an animated zoom.
+  const zoom = map._cameraView?.zoom ?? map.getZoom(), center = map._cameraView?.center ?? map.getCenter();
+  const pixelsPerMeter = map.options.crs.scale(zoom) / (40075016.68557849 * Math.cos(backend._sceneOrigin.lat * Math.PI / 180));
+  const offset = map.project(center, zoom).subtract(map.project(backend._sceneOrigin, zoom));
+  const distance = size.y * 1.5 / pixelsPerMeter;
+  const target = [
+    offset.x / pixelsPerMeter,
+    (map._terrain3D ? getElevation(map._terrain3D, center): undefined) ?? 0,
+    offset.y / pixelsPerMeter
+  ];
+  const pitch = map.getPitch() * Math.PI / 180;
+  const bearing = map.getBearing() * Math.PI / 180;
+  const camera = backend.camera;
+  camera.fov = 2 * Math.atan(1 / 3) * 180 / Math.PI;
+  camera.aspect = size.x / size.y;
+  camera.near = Math.max(0.1, distance / 10000);
+  camera.far = Math.max(10000, distance * 10);
+  camera.position[0] = target[0] + Math.sin(bearing) * Math.sin(pitch) * distance;
+  camera.position[1] = target[1] + Math.cos(pitch) * distance;
+  camera.position[2] = target[2] + Math.cos(bearing) * Math.sin(pitch) * distance;
+  camera.up[0] = -Math.sin(bearing) * Math.cos(pitch);
+  camera.up[1] = Math.sin(pitch);
+  camera.up[2] = -Math.cos(bearing) * Math.cos(pitch);
+  camera.target[0] = target[0]; camera.target[1] = target[1]; camera.target[2] = target[2];
+  // Refresh the camera view, projection and combined projection-view matrices.
+  updateCamera(camera);
+}

package/src/rendering/updateRoofRaster.js

@@ -0,0 +1,32 @@
+import { rebuildRoofAtlas } from './rebuildRoofAtlas.js';
+import { destroyTexture } from './destroyTexture.js';
+
+export function updateRoofRaster(backend, now) {
+  const map = backend._map;
+  const rasters = [];
+  let hasRoofTexture = false;
+  let layer;
+  for (layer of backend._layers) {
+    if (layer.options.roofTexture) { hasRoofTexture = true; break; }
+  }
+  if (hasRoofTexture) {
+    for (layer of Object.values(map._layers)) {
+      if (layer._type === 'pmtiles' && layer._rasterTiles && layer.options.opacity > 0) rasters.push(layer);
+    }
+    const signatures = [];
+    let loading = false;
+    for (layer of rasters) {
+      signatures.push(`${L.Util.stamp(layer)}:${layer._rasterVersion || 0}:${layer.options.opacity}:${layer.options.zIndex}`);
+      loading ||= Boolean(layer._loadingTiles);
+    }
+    const signature = signatures.join('|');
+    if (!backend._roofRaster || backend._roofRaster.signature !== signature &&
+      (!loading || now - backend._roofRaster.updatedAt >= 50)) {
+      rebuildRoofAtlas(backend, rasters, signature, now);
+    }
+  } else if (backend._roofRaster) {
+    destroyTexture(backend, backend._roofRaster.texture.texture);
+    backend._roofRaster = null;
+  }
+  return rasters;
+}

package/src/scene/attach.js

@@ -0,0 +1,161 @@
+import { cityMapper } from '../constants/cityMapper.js';
+import { emptyNode } from './emptyNode.js';
+import { setParent } from './setParent.js';
+import { createProgram } from '../rendering/createProgram.js';
+import { endZoom } from './endZoom.js';
+import { onMapChange } from './onMapChange.js';
+import { onZoomAnim } from './onZoomAnim.js';
+import { render } from '../rendering/render.js';
+import { startZoom } from './startZoom.js';
+import { update } from './update.js';
+import { updateArea } from '../sources/updateArea.js';
+import { setTerrainHeight } from '../terrain/setTerrainHeight.js';
+import { resizeSunlight } from '../shadows/resizeSunlight.js';
+import { attachState } from '../constants/attachState.js';
+import { noOperation } from '../utils/noOperation.js';
+import { failAttachment } from './failAttachment.js';
+import { requestAdapter } from './requestAdapter.js';
+import { requestDevice } from './requestDevice.js';
+import { rendererDeviceError } from './rendererDeviceError.js';
+import { rendererDeviceLost } from './rendererDeviceLost.js';
+import { restoreObject } from './restoreObject.js';
+
+attachState.rendererDevices = new WeakMap();
+
+/** WebGPU device attachment, materials/pipelines and draw calls. */
+/**
+ * Join/create this map's shared scene and rebuild GPU objects if its context changed.
+ * Buffer/program handles belong to one context; typed arrays and decoded images do not.
+ * @private
+ */
+
+export async function attach(backend, map) {
+  let shared = cityMapper.renderers.get(map);
+  if (shared?._rendererReady) {
+    await shared._rendererReady.promise;
+  }
+  if (!shared) {
+    shared = backend;
+    backend._rendererReady = Promise.withResolvers();
+    backend._rendererReady.promise.catch(noOperation);
+    cityMapper.renderers.set(map, shared);
+    const canvas = document.createElement('canvas');
+    if (!navigator.gpu) {
+      failAttachment(new Error('Layer3D requires WebGPU'), backend, map);
+    }
+    const adapter = await requestAdapter(backend, map);
+    const device = await requestDevice(adapter, backend, map);
+    attachState.rendererDevices.set(device, map);
+    device.addEventListener('uncapturederror', rendererDeviceError);
+    Promise.all([device.lost, Promise.resolve(device)]).then(rendererDeviceLost);
+    const context = canvas.getContext('webgpu');
+    if (!context) {
+      device.destroy();
+      failAttachment(new Error('Unable to create a WebGPU canvas context'), backend, map);
+    }
+    const format = navigator.gpu.getPreferredCanvasFormat();
+    context.configure({ device, format, alphaMode: 'premultiplied' });
+    map.getContainer().querySelector('.leaflet-webgpu-warning')?.remove();
+    backend._shared = backend;
+    backend._layers = new Set();
+    backend._sceneOrigin = backend.location;
+    backend.scene = emptyNode();
+    // Perspective camera state: fov in degrees, near/far in scene metres.
+    backend.camera = {
+      position: [0, 0, 0],
+      up: [0, 1, 0],
+      target: [0, 0, 0],
+      viewMatrix: [1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1],
+      projectionMatrix: [1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1],
+      projectionViewMatrix: [1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1],
+      fov: 45,
+      aspect: 1,
+      near: 0.1,
+      far: 10000,
+    };
+    backend.renderer = {
+      device,
+      context,
+      format,
+      canvas,
+      dpr: Math.min(window.devicePixelRatio, 2)
+    };
+    const layout = device.createBindGroupLayout({
+      entries: [
+        { binding: 0, visibility: GPUShaderStage.VERTEX | GPUShaderStage.FRAGMENT, buffer: { type: 'uniform' } },
+        { binding: 1, visibility: GPUShaderStage.FRAGMENT, texture: { sampleType: 'depth' } },
+        { binding: 2, visibility: GPUShaderStage.FRAGMENT, sampler: { type: 'comparison' } },
+        { binding: 3, visibility: GPUShaderStage.FRAGMENT, buffer: { type: 'read-only-storage' } },
+      ]
+    });
+    const buffer = backend.renderer.device.createBuffer({ size: 80, usage: GPUBufferUsage.UNIFORM | GPUBufferUsage.COPY_DST });
+    const sampler = backend.renderer.device.createSampler({ compare: 'less-equal', minFilter: 'linear', magFilter: 'linear' });
+    const lights = backend.renderer.device.createBuffer({ size: 32, usage: GPUBufferUsage.STORAGE | GPUBufferUsage.COPY_DST });
+    backend.renderer.sunlight = { layout, buffer, sampler, lights, size: 0 };
+    const values = new Float32Array(20);
+    values.set([1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1]);
+    backend.renderer.device.queue.writeBuffer(buffer, 0, values);
+    resizeSunlight(backend, 1);
+    const emptyImage = document.createElement('canvas');
+    emptyImage.width = 1;
+    emptyImage.height = 1;
+    backend.renderer.roofFallbackTexture = {
+      device,
+      texture: device.createTexture({
+        size: [1, 1],
+        format: 'rgba8unorm',
+        usage: GPUTextureUsage.TEXTURE_BINDING | GPUTextureUsage.COPY_DST | GPUTextureUsage.RENDER_ATTACHMENT,
+      }),
+      sampler: device.createSampler({
+        addressModeU: 'clamp-to-edge', addressModeV: 'clamp-to-edge',
+      }),
+      image: emptyImage, format: 'rgba8unorm', srgb: false, uploaded: null,
+    };
+    shared._size = null;
+    canvas.className = 'leaflet-3d';
+    canvas.style.cssText = 'position:absolute;top:0;left:0;pointer-events:none';
+    canvas.setAttribute('role', 'img');
+    canvas.setAttribute('aria-label', backend.options.ariaLabel ?? '3D scene');
+    let pane = map.getPane('webgpuPane');
+    if (!pane) {
+      pane = map.createPane('webgpuPane', map.getContainer());
+      // The pitch sky uses 0 and may be inserted after this pane.
+      pane.style.zIndex = 1;
+      pane.style.pointerEvents = 'none';
+    }
+    pane.append(canvas);
+    map.on('move zoom rotate pitch resize viewreset layeradd layerremove', onMapChange, shared);
+    map.on('zoomstart', startZoom, shared);
+    map.on('zoomanim', onZoomAnim, shared);
+    map.on('zoomend', endZoom, shared);
+    backend._rendererReady.resolve();
+    delete shared._rendererReady;
+    render(shared);
+    cityMapper.renderers.set(map, shared);
+  }
+  const origin = map.options.crs.project(shared._sceneOrigin);
+  const point = map.options.crs.project(backend.location);
+  const metres = Math.cos(shared._sceneOrigin.lat * Math.PI / 180);
+  backend._terrainBaseY ??= backend.root.position[1];
+  backend.root.position[0] = (point.x - origin.x) * metres;
+  backend.root.position[1] = backend._terrainBaseY;
+  backend.root.position[2] = -(point.y - origin.y) * metres;
+  setTerrainHeight(backend);
+  // Each group's metres are measured at its own latitude, not the shared camera origin.
+  backend.root.scale.fill(metres / Math.cos(backend.location.lat * Math.PI / 180));
+  backend._shared = shared;
+  backend.renderer = shared.renderer;
+  backend.scene = shared.scene;
+  backend.camera = shared.camera;
+  shared._layers.add(backend);
+  setParent(backend.root, shared.scene);
+  const pendingObjects = [backend.root];
+  let object, i;
+  while (pendingObjects.length) {
+    object = pendingObjects.pop();
+    restoreObject(backend, shared, object);
+    for (i = object.children.length - 1; i >= 0; i--) pendingObjects.push(object.children[i]);
+  }
+  update(shared);
+  if ((backend.header && backend._type !== 'pmtiles') || backend._geojson) updateArea(backend);
+}

package/src/scene/attachLayer.js

@@ -0,0 +1,10 @@
+import * as attach from './attach.js';
+
+export async function attachLayer(backend, map) {
+  try {
+    await attach.attach(backend, map);
+    backend._added.resolve();
+  } catch (error) {
+    backend.fire('error', { error });
+  }
+}

package/src/scene/cancelUpdate.js

@@ -0,0 +1,10 @@
+import { pendingUpdates } from '../constants/pendingUpdates.js';
+
+export function cancelUpdate(backend) {
+  const frame = backend._frame;
+  pendingUpdates.delete(backend);
+  backend._frame = null;
+  if (!pendingUpdates.size && frame != null) {
+    cancelAnimationFrame(frame);
+  }
+}

package/src/scene/emptyEvents.js

@@ -0,0 +1,3 @@
+export function emptyEvents() {
+  return {};
+}

package/src/scene/emptyNode.js

@@ -0,0 +1,11 @@
+/** A fresh, empty scene-graph node. */
+export function emptyNode() {
+  return {
+  position: [0, 0, 0],
+  rotation: [0, 0, 0],
+  scale: [1, 1, 1],
+  worldMatrix: [1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1],
+  children: [],
+  visible: true,
+  };
+}

package/src/scene/endZoom.js

@@ -0,0 +1,16 @@
+import { update } from './update.js';
+
+/** Stop using the outgoing level after zoomend; the next redraw uses current tiles. */
+
+export function endZoom() {
+  const backend = this;
+  let animation;
+  for (animation of backend._zoomTransitions?.keys() || []) animation.finish();
+  backend._zoomTransitions = null;
+  backend._zoomView = null;
+  delete backend._map._cameraView;
+  backend._map.getContainer().classList.remove('leaflet-camera-zoom');
+  backend._map._updateCameraOverlays();
+  backend._zoomLevel = null;
+  update(backend);
+}

package/src/scene/failAttachment.js

@@ -0,0 +1,9 @@
+import { showWebGPUWarning } from './showWebGPUWarning.js';
+import { cityMapper } from '../constants/cityMapper.js';
+
+export function failAttachment(error, backend, map) {
+  showWebGPUWarning(map);
+  backend._rendererReady.reject(error);
+  cityMapper.renderers.delete(map);
+  throw error;
+}

package/src/scene/get3DEvents.js

@@ -0,0 +1,13 @@
+import { updateArea } from '../sources/updateArea.js';
+import { onTerrainChange } from '../terrain/onTerrainChange.js';
+
+export function get3DEvents(layer) {
+  const events = {};
+  if (layer.url) {
+    events.moveend = events.zoomend = events.rotate = events.pitch = events.resize = updateArea.bind(null, layer);
+  }
+  if (layer._geojson || layer.url) {
+    events.terrainchange = onTerrainChange.bind(null, layer);
+  }
+  return events;
+}

package/src/scene/init3D.js

@@ -0,0 +1,30 @@
+import { attach } from './attach.js';
+import { emptyNode } from './emptyNode.js';
+import { onAdd3DLayer } from './onAdd3DLayer.js';
+import { onRemove3DLayer } from './onRemove3DLayer.js';
+import { update } from './update.js';
+import { updateArea } from '../sources/updateArea.js';
+import { onTerrainChange } from '../terrain/onTerrainChange.js';
+import { getHeader } from '../archives/getHeader.js';
+import { loadModel } from '../models/loadModel.js';
+import { get3DEvents } from './get3DEvents.js';
+import { ready3D } from './ready3D.js';
+
+export function init3D(layer, options = {}) {
+  layer._3d = true;
+  L.Util.setOptions(layer, { ariaLabel: '3D scene', ...options });
+  layer.onAdd = onAdd3DLayer.bind(null, layer);
+  layer.onRemove = onRemove3DLayer.bind(null, layer);
+  layer.getEvents = get3DEvents.bind(null, layer);
+  const isModel = !layer._geojson && /\.(glb|gltf)(?:[?#]|$)/i.test(layer.options.url);
+  layer.modelUrl = isModel ? layer.options.url : null;
+  layer.url = layer.options.url && !isModel && !layer._geojson ? new URL(layer.options.url, document.baseURI).href : null;
+  layer._directories = new Map();
+  if (layer.options.center) {
+    layer.location = new L.LatLng(layer.options.center[0], layer.options.center[1]);
+  }
+  layer._areas = new Map();
+  layer._inflight = 0;
+  layer._added = Promise.withResolvers();
+  queueMicrotask(ready3D.bind(null, layer));
+}

package/src/scene/initializeLayer.js

@@ -0,0 +1,16 @@
+export function initializeLayer(task) {
+  const { layer, ready } = task;
+  try {
+    if (task.error) throw task.error;
+    const map = layer._map;
+    map?.removeLayer(layer);
+    delete layer.onAdd;
+    delete layer.onRemove;
+    task.initialize(layer, task.settings);
+    map?.addLayer(layer);
+    return layer.ready === ready ? layer : layer.ready;
+  } catch (error) {
+    layer.fire('error', { error });
+    throw error;
+  }
+}

package/src/scene/initializerFor.js

@@ -0,0 +1,14 @@
+import { initializeGeoJSON } from '../sources/initializeGeoJSON.js';
+import { initRaster } from '../raster/initRaster.js';
+import { initTerrain } from '../terrain/initTerrain.js';
+import { initTraffic } from '../traffic/initTraffic.js';
+
+export function initializerFor(type) {
+  switch (type) {
+    case 'geojson': return initializeGeoJSON;
+    case 'pmtiles': return initRaster;
+    case 'terrain': return initTerrain;
+    case 'traffic': return initTraffic;
+    default: throw new Error(`Unknown layer type: ${type}`);
+  }
+}

package/src/scene/layerInitialize.js

@@ -0,0 +1,38 @@
+import { indexState } from '../constants/indexState.js';
+import { init3D } from './init3D.js';
+import { noOperation } from '../utils/noOperation.js';
+import { resolveNextInitialization } from './resolveNextInitialization.js';
+import { initializeLayer } from './initializeLayer.js';
+
+export function layerInitialize(options = {}) {
+  if (Object.getPrototypeOf(this) !== L.Layer.prototype || !options.source) {
+    if (indexState.layerProto.initialize) return indexState.layerProto.initialize.apply(this, arguments);
+    L.Util.setOptions(this, options);
+    return;
+  }
+  const {
+    source: {
+      type = options.source.data?.type === 'FeatureCollection'
+        ? 'geojson'
+        : /\.pmtiles(?:[?#]|$)/i.test(options.source.url) ? 'pmtiles' : '3d',
+      ...source
+    },
+    ...core
+  } = options;
+  const settings = { ...source, ...core };
+  L.Util.setOptions(this, core);
+  this._type = type;
+  if (type === '3d') {
+    init3D(this, settings);
+    return;
+  }
+  this.onAdd = noOperation;
+  this.onRemove = noOperation;
+  // ponytail: type methods (setOpacity, add, ...) exist only once `ready` resolves.
+  const task = { layer: this, type, settings, ready: null };
+  indexState.pendingInitializations.push(task);
+  indexState.loading = indexState.loading.catch(noOperation).then(resolveNextInitialization);
+  const ready = this.ready = indexState.loading.then(initializeLayer);
+  task.ready = ready;
+  ready.catch(noOperation);
+}

package/src/scene/layerLayerAdd.js

@@ -0,0 +1,21 @@
+import { indexState } from '../constants/indexState.js';
+import { initNativeGPU } from '../core/initNativeGPU.js';
+
+export function layerLayerAdd(event) {
+  const native = !this._3d && (
+    this instanceof L.GridLayer ||
+    this instanceof L.Polyline ||
+    this instanceof L.CircleMarker ||
+    this instanceof L.Marker && !(this.options.icon instanceof L.DivIcon) ||
+    this instanceof L.ImageOverlay && !(this instanceof L.VideoOverlay) && !(this instanceof L.SVGOverlay)
+  );
+  if (native) {
+    if (this instanceof L.GridLayer || this instanceof L.ImageOverlay) {
+      this.options.crossOrigin ||= true;
+    }
+    if (this instanceof L.Marker) this.options.icon.options.crossOrigin ||= true;
+  }
+  indexState.layerProto._layerAdd.call(this, event);
+  if (!native || !event.target.hasLayer(this)) return;
+  initNativeGPU(this, event.target);
+}