leaflet-city-mapper 0.0.2 → 0.0.4

package/src/raster/readyRaster.js

@@ -0,0 +1,16 @@
+import { sceneByLayer } from '../globals/sceneByLayer.js';
+
+
+import { getHeader } from "../archives/getHeader.js";
+
+export async function readyRaster(layer, archive) {
+  const header = await getHeader(archive);
+  layer.options.archive = archive;
+  sceneByLayer.get(layer).header = header;
+  if (layer.options.maxNativeZoom === undefined) {
+    layer.options.maxNativeZoom = header.maxZoom;
+  }
+  layer.options.maxZoom = Math.max(layer.options.minZoom || 0, layer.options.maxZoom);
+  layer.fire('ready');
+  return layer;
+}

package/src/raster/registerTerrainTile.js

@@ -0,0 +1,15 @@
+import { sceneByLayer } from '../globals/sceneByLayer.js';
+
+
+import { addRasterTile } from './addRasterTile.js';
+
+export async function registerTerrainTile(backend, coords, tile) {
+  if (sceneByLayer.get(backend)._terrain3D && tile.done && !tile.request.signal.aborted &&
+    sceneByLayer.get(backend)._rasterTiles.get(`${coords.z}/${coords.x}/${coords.y}`) === tile) {
+    try {
+      await addRasterTile(sceneByLayer.get(backend)._terrain3D, backend, coords, tile);
+    } catch (error) {
+      backend.fire('tileerror', /* alloc */ { tile, coords, error });
+    }
+  }
+}

package/src/raster/releaseRasterTile.js

@@ -0,0 +1,21 @@
+import { sceneByLayer } from '../globals/sceneByLayer.js';
+
+
+import { destroyTexture } from '../rendering/destroyTexture.js';
+import { removeRasterTile } from './removeRasterTile.js';
+import { setParent } from '../scene/setParent.js';
+import { update } from '../scene/update.js';
+
+export function releaseRasterTile(backend, tile) {
+  const key = `${tile.coords.z}/${tile.coords.x}/${tile.coords.y}`;
+  if (sceneByLayer.get(backend)._rasterTiles.get(key) !== tile) return;
+  sceneByLayer.get(backend)._rasterTiles.delete(key);
+  sceneByLayer.get(backend)._rasterVersion = (sceneByLayer.get(backend)._rasterVersion || 0) + 1;
+  tile.request.abort();
+  if(sceneByLayer.get(backend)._terrain3D) removeRasterTile(sceneByLayer.get(backend)._terrain3D, tile);
+  if (tile.mesh) setParent(tile.mesh, null);
+  if (tile.texture) destroyTexture(backend, tile.texture.texture);
+  tile.image?.close();
+  backend.fire('tileunload', /* alloc */ { tile, coords: tile.coords });
+  update(backend);
+}

package/src/raster/releaseRasterTiles.js

@@ -0,0 +1,18 @@
+import { sceneByLayer } from '../globals/sceneByLayer.js';
+
+
+import { destroyTexture } from '../rendering/destroyTexture.js';
+import { releaseRasterTile } from './releaseRasterTile.js';
+
+export function releaseRasterTiles(backend) {
+  let tile, attribute;
+  for (tile of sceneByLayer.get(backend)._rasterTiles.values()) releaseRasterTile(backend, tile);
+  sceneByLayer.get(backend)._rasterProgram?.pipelineCache.clear();
+  sceneByLayer.get(backend)._rasterProgram = null;
+  if (sceneByLayer.get(backend)._rasterGeometry) {
+    for (attribute of Object.values(sceneByLayer.get(backend)._rasterGeometry.attributes)) {
+      destroyTexture(backend, attribute.buffer);
+    }
+    sceneByLayer.get(backend)._rasterGeometry = null;
+  }
+}

package/src/raster/removeRasterTile.js

@@ -0,0 +1,16 @@
+import { sceneByLayer } from '../globals/sceneByLayer.js';
+
+
+import { destroyTexture } from '../rendering/destroyTexture.js';
+import { setParent } from '../scene/setParent.js';
+import { update } from '../scene/update.js';
+
+export function removeRasterTile(layer, tile) {
+  sceneByLayer.get(layer)._terrainRequest?.abort();
+  const mesh = sceneByLayer.get(layer)._rasterTiles.get(tile);
+  if (!mesh) return;
+  setParent(mesh, null);
+  update(layer);
+  if (mesh.texture !== tile.texture) destroyTexture(layer, mesh.texture.texture);
+  sceneByLayer.get(layer)._rasterTiles.delete(tile);
+}

package/src/raster/reportError.js

@@ -0,0 +1,6 @@
+
+
+export function reportError(layer, error) {
+  layer.fire('error', /* alloc */ { error });
+  throw error;
+}

package/src/raster/retainRasterTiles.js

@@ -0,0 +1,15 @@
+import { sceneByLayer } from '../globals/sceneByLayer.js';
+import { releaseRasterTile } from './releaseRasterTile.js';
+
+export function retainRasterTiles(backend, required) {
+  const tiles = sceneByLayer.get(backend)._rasterTiles;
+  let key, tile, coords;
+  for ([key, tile] of tiles) {
+    if (!required.has(key) && !tile.done) releaseRasterTile(backend, tile);
+  }
+  for ([key, coords] of required) {
+    if (tiles.has(key)) continue;
+    tile = /* alloc */ { coords, request: /* alloc */ new AbortController(), done: false };
+    tiles.set(key, tile);
+  }
+}

package/src/raster/setPMTileOpacity.js

@@ -0,0 +1,7 @@
+import { setRasterOpacity } from './setRasterOpacity.js';
+
+export function setPMTileOpacity(backend, opacity) {
+  backend.options.opacity = opacity;
+  setRasterOpacity(backend, opacity);
+  return backend;
+}

package/src/raster/setPMTileZIndex.js

@@ -0,0 +1,7 @@
+import { setRasterZIndex } from './setRasterZIndex.js';
+
+export function setPMTileZIndex(backend, zIndex) {
+  backend.options.zIndex = zIndex;
+  setRasterZIndex(backend, zIndex);
+  return backend;
+}

package/src/raster/setRasterOpacity.js

@@ -0,0 +1,14 @@
+import { sceneByLayer } from '../globals/sceneByLayer.js';
+
+
+import { update } from '../scene/update.js';
+
+export function setRasterOpacity(backend, opacity) {
+  let tile, terrainMesh;
+  for (tile of sceneByLayer.get(backend)._rasterTiles.values()) {
+    if (tile.mesh) tile.mesh.opacity = opacity;
+    terrainMesh = sceneByLayer.get(sceneByLayer.get(backend)._terrain3D)?._rasterTiles.get(tile);
+    if (terrainMesh) terrainMesh.opacity = opacity;
+  }
+  update(backend);
+}

package/src/raster/setRasterTerrain.js

@@ -0,0 +1,25 @@
+import { sceneByLayer } from '../globals/sceneByLayer.js';
+
+
+import { removeRasterTile } from './removeRasterTile.js';
+import { setParent } from '../scene/setParent.js';
+import { registerTerrainTile } from './registerTerrainTile.js';
+
+export function setRasterTerrain(backend, terrain) {
+  // Pending sources bind the current terrain when their raster attachment is ready.
+  if (!sceneByLayer.get(backend)._rasterTiles || sceneByLayer.get(backend)._terrain3D === terrain) return;
+  let tile;
+  for (tile of sceneByLayer.get(backend)._rasterTiles.values()) {
+    if(sceneByLayer.get(backend)._terrain3D) removeRasterTile(sceneByLayer.get(backend)._terrain3D, tile);
+    if (tile.mesh) {
+      tile.mesh.visible = true;
+      setParent(tile.mesh, sceneByLayer.get(backend).root);
+    }
+  }
+  sceneByLayer.get(backend)._terrain3D = terrain || null;
+  if (terrain) {
+    for (tile of sceneByLayer.get(backend)._rasterTiles.values()) {
+      if (tile.done) registerTerrainTile(backend, tile.coords, tile);
+    }
+  }
+}

package/src/raster/setRasterZIndex.js

@@ -0,0 +1,14 @@
+import { sceneByLayer } from '../globals/sceneByLayer.js';
+
+
+import { update } from '../scene/update.js';
+
+export function setRasterZIndex(backend, zIndex) {
+  let tile, terrainMesh;
+  for (tile of sceneByLayer.get(backend)._rasterTiles.values()) {
+    if (tile.mesh) tile.mesh.renderOrder = zIndex;
+    terrainMesh = sceneByLayer.get(sceneByLayer.get(backend)._terrain3D)?._rasterTiles.get(tile);
+    if (terrainMesh) terrainMesh.renderOrder = zIndex;
+  }
+  update(backend);
+}

package/src/raster/terrainTileGeometry.js

@@ -0,0 +1,16 @@
+import { sceneByLayer } from '../globals/sceneByLayer.js';
+
+export function terrainTileGeometry(backend, attributes, sizeX, sizeZ) {
+  const scene = sceneByLayer.get(backend), base = scene._terrainOriginElevation;
+  const bottom = Math.min(scene._dem.low, base) - base, top = Math.max(scene._dem.high, base) - base;
+  return /* alloc */ {
+    device: scene.renderer.device,
+    attributes,
+    drawRange: /* alloc */ { start: 0, count: attributes.index.count },
+    // Bounds must cover the DEM-displaced tile, although picking uses the flat grid.
+    bounds: /* alloc */ {
+      min: /* alloc */ [0, bottom, 0], max: /* alloc */ [1, top, 1], center: /* alloc */ [0.5, (bottom + top) / 2, 0.5],
+      radius: Math.hypot(sizeX, top - bottom, sizeZ) / 2 / Math.max(sizeX, 1, sizeZ),
+    },
+  };
+}

package/src/raster/updateAttachedTiles.js

@@ -0,0 +1,13 @@
+import { sceneByLayer } from '../globals/sceneByLayer.js';
+
+
+import { updateRasterTiles } from "./updateRasterTiles.js";
+
+export async function updateAttachedTiles(backend, map, attached) {
+  try {
+    await Promise.all(/* alloc */ [attached, sceneByLayer.get(backend).ready]);
+    if (backend._map === map && map.hasLayer(backend)) updateRasterTiles(backend);
+  } catch (error) {
+    backend.fire('error', /* alloc */ { error });
+  }
+}

package/src/raster/updateRasterTiles.js

@@ -0,0 +1,51 @@
+import { sceneByLayer } from '../globals/sceneByLayer.js';
+import { wantedTiles } from '../globals/wantedTiles.js';
+import { coverageTiles } from '../globals/coverageTiles.js';
+
+
+
+import { pumpRasterTiles } from './pumpRasterTiles.js';
+
+import { retainRasterTiles } from './retainRasterTiles.js';
+import { pruneRasterTiles } from './pruneRasterTiles.js';
+import { rasterTileRange } from './rasterTileRange.js';
+
+// ponytail: cap horizon views at 169 tiles; raise the radius if extreme pitches need more.
+
+export function updateRasterTiles(backend) {
+  const map = backend._map;
+  if (!map || !sceneByLayer.get(backend)._shared || !sceneByLayer.get(backend).header) return;
+
+  const zoom = Math.max(sceneByLayer.get(backend).header.minZoom ?? 0, Math.min(
+    Math.round(map.getZoom()),
+    backend.options.maxZoom,
+    backend.options.maxNativeZoom
+  ));
+  sceneByLayer.get(backend)._tileZoom = zoom;
+  const range = rasterTileRange(map, sceneByLayer.get(backend).header, zoom);
+  const wanted = wantedTiles;
+  wanted.clear();
+  let x, y, key, coords, parent;
+  for (x = range.minX; x <= range.maxX; x++) {
+    for (y = range.minY; y <= range.maxY; y++) {
+      wanted.set(`${zoom}/${x}/${y}`, /* alloc */ { z: zoom, x, y });
+    }
+  }
+  sceneByLayer.get(backend)._wantedRasterTiles = /* alloc */ new Set(wanted.keys());
+  const coverage = coverageTiles;
+  coverage.clear();
+  const parentZoom = Math.max(sceneByLayer.get(backend).header.minZoom ?? 0, zoom - 2), factor = 2 ** (zoom - parentZoom);
+  if (parentZoom < zoom) {
+    for ([key, coords] of wanted) {
+      if (sceneByLayer.get(backend)._rasterTiles.get(key)?.done) continue;
+      parent = /* alloc */ { z: parentZoom, x: Math.floor(coords.x / factor), y: Math.floor(coords.y / factor) };
+      coverage.set(`${parent.z}/${parent.x}/${parent.y}`, parent);
+    }
+  }
+  const required = /* alloc */ new Map(coverage);
+  for ([key, coords] of wanted) required.set(key, coords);
+  wanted.clear(); coverage.clear();
+  retainRasterTiles(backend, required);
+  pumpRasterTiles(backend);
+  pruneRasterTiles(backend);
+}

package/src/rendering/bindMeshTextures.js

@@ -0,0 +1,50 @@
+import { meshBindGroup } from '../globals/meshBindGroup.js';
+import { drawEntries } from '../globals/drawEntries.js';
+import { drawMeshEntry } from '../globals/drawMeshEntry.js';
+import { drawFrameEntry } from '../globals/drawFrameEntry.js';
+import { drawTerrainEntry } from '../globals/drawTerrainEntry.js';
+import { drawTextureEntries } from '../globals/drawTextureEntries.js';
+import { drawSamplerEntries } from '../globals/drawSamplerEntries.js';
+
+export function bindMeshTextures(renderer, mesh, textures) {
+  const { program } = mesh;
+  const entries = drawEntries;
+  entries.length = 0;
+  drawMeshEntry.resource.buffer = renderer.uniformBuffer;
+  drawFrameEntry.resource.buffer = renderer.uniformBuffer;
+  entries.push(drawMeshEntry, drawFrameEntry);
+  if (program.terrain) {
+    drawTerrainEntry.resource = program.terrain.texture.createView();
+    entries.push(drawTerrainEntry);
+  }
+  mesh.boundBuffer = renderer.uniformBuffer;
+  const boundTextures = mesh.boundTextures ||= /* alloc */ [];
+  boundTextures.length = textures.length;
+  let i, binding, texture;
+  for (i = 0; i < textures.length; i++) {
+    binding = program.bindings[i], texture = textures[i];
+    drawTextureEntries[i].binding = binding.texture;
+    drawTextureEntries[i].resource = texture.texture.createView();
+    drawSamplerEntries[i].binding = binding.sampler;
+    drawSamplerEntries[i].resource = texture.sampler;
+    entries.push(drawTextureEntries[i], drawSamplerEntries[i]);
+    boundTextures[i] ||= /* alloc */ [];
+    boundTextures[i][0] = texture.texture;
+    boundTextures[i][1] = texture.sampler;
+  }
+  mesh.bindGroup = renderer.device.createBindGroup((
+    meshBindGroup.layout = program.bindGroupLayout,
+    meshBindGroup.entries = entries,
+    meshBindGroup
+  ));
+  meshBindGroup.layout = null;
+  meshBindGroup.entries = null;
+  drawMeshEntry.resource.buffer = null;
+  drawFrameEntry.resource.buffer = null;
+  drawTerrainEntry.resource = null;
+  for (i = 0; i < textures.length; i++) {
+    drawTextureEntries[i].resource = null;
+    drawSamplerEntries[i].resource = null;
+  }
+  entries.length = 0;
+}

package/src/rendering/collectFrameMeshes.js

@@ -0,0 +1,38 @@
+import { sceneByLayer } from '../globals/sceneByLayer.js';
+
+
+import { updateWorldMatrix } from "../scene/updateWorldMatrix.js";
+import { collectMeshes } from './collectMeshes.js';
+
+export function collectFrameMeshes(backend, sunlight, sceneChanged) {
+  const camera = sceneByLayer.get(backend).camera;
+  const projection = camera.projectionViewMatrix;
+  const renderer = sceneByLayer.get(backend).renderer;
+  const frustum = renderer.frustum ||= /* alloc */ [
+    /* alloc */ new Float64Array(4),
+    /* alloc */ new Float64Array(4),
+    /* alloc */ new Float64Array(4),
+    /* alloc */ new Float64Array(4),
+    /* alloc */ new Float64Array(4),
+    /* alloc */ new Float64Array(4),
+  ];
+  const frustumLengths = renderer.frustumLengths ||= /* alloc */ new Float64Array(6);
+  let i, axis, plane, j, offset;
+  for (i = 0; i < 6; i++) {
+    axis = Math.floor(i / 2);
+    plane = frustum[i];
+    for (j = 0; j < 4; j++) {
+      offset = j * 4;
+      plane[j] = i === 4 ? projection[offset + 2]
+        : i % 2 ? projection[offset + 3] - projection[offset + axis]
+        : projection[offset + 3] + projection[offset + axis];
+    }
+    frustumLengths[i] = Math.hypot(plane[0], plane[1], plane[2]);
+  }
+  const candidates = sceneByLayer.get(backend)._visibleMeshes ||= /* alloc */ [];
+  candidates.length = 0;
+  const shadowMeshes = sceneByLayer.get(backend)._shadowMeshes ||= /* alloc */ [];
+  shadowMeshes.length = 0;
+  if (sceneChanged) updateWorldMatrix(sceneByLayer.get(backend).scene);
+  collectMeshes(sceneByLayer.get(backend).scene, sunlight, projection, frustum, frustumLengths, candidates, shadowMeshes);
+}

package/src/rendering/collectMeshes.js

@@ -0,0 +1,14 @@
+import { collectVisibleMesh } from './collectVisibleMesh.js';
+
+export function collectMeshes(mesh, sunlight, projection, frustum, frustumLengths, candidates, shadowMeshes) {
+  if (!mesh.visible) return;
+  if (mesh.geometry) {
+    if (sunlight?.altitude >= 3 && !mesh.tile && mesh._appearance !== 0 &&
+      !mesh.program.nightLight && mesh.program.depthTest !== false) shadowMeshes.push(mesh);
+    collectVisibleMesh(mesh, projection, frustum, frustumLengths, candidates);
+  }
+  let child;
+  for (child of mesh.children) {
+    collectMeshes(child, sunlight, projection, frustum, frustumLengths, candidates, shadowMeshes);
+  }
+}

package/src/rendering/collectRoofTiles.js

@@ -0,0 +1,15 @@
+import { sceneByLayer } from '../globals/sceneByLayer.js';
+
+export function collectRoofTiles(rasters, tiles) {
+  let zoom = -Infinity, layer, tile;
+  for (layer of rasters) {
+    for (tile of sceneByLayer.get(layer)._rasterTiles.values()) {
+      if (tile.done && !tile.request.signal.aborted && tile.image) {
+        tile._roofEntry ||= /* alloc */ { tile, layer };
+        tiles.push(tile._roofEntry);
+        zoom = Math.max(zoom, tile.coords.z);
+      }
+    }
+  }
+  return zoom;
+}

package/src/rendering/collectVisibleMesh.js

@@ -0,0 +1,27 @@
+import { computeBounds } from '../geometry/computeBounds.js';
+
+export function collectVisibleMesh(mesh, projection, frustum, frustumLengths, candidates) {
+  if (!mesh.geometry.bounds) computeBounds(mesh.geometry);
+  const bounds = mesh.geometry.bounds;
+  const world = mesh.worldMatrix;
+  const center = bounds.center;
+  const x = world[0] * center[0] + world[4] * center[1] + world[8] * center[2] + world[12];
+  const y = world[1] * center[0] + world[5] * center[1] + world[9] * center[2] + world[13];
+  const z = world[2] * center[0] + world[6] * center[1] + world[10] * center[2] + world[14];
+  const clipZ = projection[2] * x + projection[6] * y + projection[10] * z + projection[14];
+  const clipW = projection[3] * x + projection[7] * y + projection[11] * z + projection[15];
+  mesh._sortDepth = clipZ / clipW;
+  const radius = bounds.radius * Math.max(
+    Math.hypot(world[0], world[1], world[2]),
+    Math.hypot(world[4], world[5], world[6]),
+    Math.hypot(world[8], world[9], world[10])
+  );
+  mesh._visibleInFrame =
+    frustum[0][0] * x + frustum[0][1] * y + frustum[0][2] * z + frustum[0][3] >= -radius * frustumLengths[0] &&
+    frustum[1][0] * x + frustum[1][1] * y + frustum[1][2] * z + frustum[1][3] >= -radius * frustumLengths[1] &&
+    frustum[2][0] * x + frustum[2][1] * y + frustum[2][2] * z + frustum[2][3] >= -radius * frustumLengths[2] &&
+    frustum[3][0] * x + frustum[3][1] * y + frustum[3][2] * z + frustum[3][3] >= -radius * frustumLengths[3] &&
+    frustum[4][0] * x + frustum[4][1] * y + frustum[4][2] * z + frustum[4][3] >= -radius * frustumLengths[4] &&
+    frustum[5][0] * x + frustum[5][1] * y + frustum[5][2] * z + frustum[5][3] >= -radius * frustumLengths[5];
+  if (mesh._visibleInFrame) candidates.push(mesh);
+}

package/src/rendering/compareMeshDepth.js

@@ -0,0 +1,6 @@
+export function compareMeshDepth(a, b) {
+  return a.program.transparent
+    ? (a.renderOrder || 0) - (b.renderOrder || 0) ||
+      b._sortDepth - a._sortDepth || a.id - b.id
+    : (a._sortDepth ?? 0) - (b._sortDepth ?? 0) || a.id - b.id;
+}

package/src/rendering/compareMeshes.js

@@ -0,0 +1,8 @@
+export function compareMeshes(a, b) {
+  return Number(Boolean(b.ground)) - Number(Boolean(a.ground)) ||
+    (a.ground && b.ground ? (a.renderOrder || 0) - (b.renderOrder || 0) ||
+      a.tile.coords.z - b.tile.coords.z : 0) ||
+    Number(a.program.transparent) - Number(b.program.transparent) ||
+    compareMeshDepth(a, b);
+}
+import { compareMeshDepth } from './compareMeshDepth.js';

package/src/rendering/compareRoofTiles.js

@@ -0,0 +1,4 @@
+export function compareRoofTiles(a, b) {
+  return (a.layer.options.zIndex || 0) - (b.layer.options.zIndex || 0) ||
+    a.tile.coords.z - b.tile.coords.z;
+}

package/src/rendering/composeRoofAtlas.js

@@ -0,0 +1,69 @@
+import { roofBuffer } from '../globals/roofBuffer.js';
+import { roofPass } from '../globals/roofPass.js';
+import { uploadRoofTile } from './uploadRoofTile.js';
+import { roofBindGroup } from '../globals/roofBindGroup.js';
+import { roofCommands } from '../globals/roofCommands.js';
+import { sceneByLayer } from '../globals/sceneByLayer.js';
+import { roofOpacities } from '../globals/roofOpacities.js';
+import { TILE_SIZE } from '../globals/TILE_SIZE.js';
+
+
+import { compareRoofTiles } from './compareRoofTiles.js';
+
+export function composeRoofAtlas(backend, tiles, zoom, min, size, width, height) {
+  const renderer = sceneByLayer.get(backend).renderer, device = renderer.device, map = backend._map;
+  const opacityLength = Math.max(1, tiles.length) * 64;
+  if (roofOpacities.value.length < opacityLength) {
+    roofOpacities.value = /* alloc */ new Float32Array(opacityLength);
+  }
+  const opacities = roofOpacities.value;
+  const opacityBuffer = device.createBuffer((
+    roofBuffer.size = opacities.byteLength,
+    roofBuffer.usage = GPUBufferUsage.UNIFORM | GPUBufferUsage.COPY_DST,
+    roofBuffer
+  ));
+
+  const encoder = device.createCommandEncoder();
+  const atlasPass = encoder.beginRenderPass((
+    roofPass.colorAttachments[0].view = sceneByLayer.get(backend)._roofRaster.texture.texture.createView(),
+    roofPass
+  ));
+  roofPass.colorAttachments[0].view = null;
+  atlasPass.setPipeline(renderer.roofBlit.pipeline);
+  tiles.sort(compareRoofTiles);
+  let i, tile, layer, coords, source, tileSize, x, y;
+  for ([i, { tile, layer }] of tiles.entries()) {
+    ({ coords } = tile);
+    source = tile.texture;
+    uploadRoofTile(device, tile);
+
+    opacities[i * 64] = layer.options.opacity;
+    tileSize = TILE_SIZE * map.getZoomScale(zoom, coords.z);
+    x = (coords.x * tileSize - min.x) * width / size.x;
+    y = (coords.y * tileSize - min.y) * height / size.y;
+    atlasPass.setViewport(x, y, Math.min(tileSize * width / size.x, width - x),
+      Math.min(tileSize * height / size.y, height - y), 0, 1);
+    atlasPass.setBindGroup(0, device.createBindGroup((
+      roofBindGroup.layout = renderer.roofBlit.pipeline.getBindGroupLayout(0),
+      roofBindGroup.entries[0].resource = source.texture.createView(),
+      roofBindGroup.entries[1].resource = renderer.roofBlit.sampler,
+      roofBindGroup.entries[2].resource.buffer = opacityBuffer,
+      roofBindGroup.entries[2].resource.offset = i * 256,
+      roofBindGroup
+    )));
+    roofBindGroup.layout = null;
+    roofBindGroup.entries[0].resource = null;
+    roofBindGroup.entries[1].resource = null;
+    roofBindGroup.entries[2].resource.buffer = null;
+
+    atlasPass.draw(4);
+  }
+  atlasPass.end();
+  device.queue.writeBuffer(opacityBuffer, 0, opacities);
+  device.queue.submit((
+    roofCommands[0] = encoder.finish(),
+    roofCommands
+  ));
+  roofCommands[0] = null;
+  opacityBuffer.destroy();
+}

package/src/rendering/createMesh.js

@@ -0,0 +1,44 @@
+import { defaultMaterial } from '../globals/defaultMaterial.js';
+import { meshBuffer } from '../globals/meshBuffer.js';
+import { sceneByLayer } from '../globals/sceneByLayer.js';
+import { nextId } from '../globals/nextId.js';
+
+
+
+import { emptyNode } from '../scene/emptyNode.js';
+import { createProgram } from './createProgram.js';
+import { setParent } from '../scene/setParent.js';
+import { update } from '../scene/update.js';
+
+/**
+ * Add a non-indexed, vertex-coloured mesh from flat vec3 arrays `{ position, normal, color }` in layer-local metres.
+ * `usage` adds GPUBufferUsage flags to the vertex buffers (e.g. STORAGE for compute passes).
+ * A supplied `program` shares compiled shaders and pipelines across compatible meshes.
+ */
+
+export function createMesh(backend, data, material = defaultMaterial, usage = 0, program) {
+  const { device } = sceneByLayer.get(backend).renderer, attributes = /* alloc */ {};
+  let name, values, array, size, buffer;
+  for ([name, values] of Object.entries(data)) {
+    array = /* alloc */ new Float32Array(values);
+    size = name === 'uv' ? 2 : 3;
+    buffer = device.createBuffer((
+      meshBuffer.size = Math.max(4, array.byteLength),
+      meshBuffer.usage = GPUBufferUsage.VERTEX | GPUBufferUsage.COPY_DST | usage,
+      meshBuffer
+    ));
+
+    device.queue.writeBuffer(buffer, 0, array);
+    attributes[name] = /* alloc */ { size, data: array, count: array.length / size, buffer };
+  }
+  const mesh = /* alloc */ {
+    ...emptyNode(),
+    device,
+    geometry: /* alloc */ { device, attributes, drawRange: /* alloc */ { start: 0, count: attributes.position.count } },
+    program: program || createProgram(backend, /* alloc */ { vertexColors: true, doubleSided: true, ...material }),
+    id: nextId.value++, renderOrder: 0, extras: /* alloc */ {},
+  };
+  setParent(mesh, sceneByLayer.get(backend).root);
+  update(backend);
+  return mesh;
+}

package/src/rendering/createProgram.js

@@ -0,0 +1,75 @@
+import { defaultMaterial } from '../globals/defaultMaterial.js';
+import { vertexShader } from '../globals/vertexShader.js';
+import { fragmentShader } from '../globals/fragmentShader.js';
+import { pipelineLayout as sharedPipelineLayout } from '../globals/pipelineLayout.js';
+import { elevationWGSL } from '../globals/elevationWGSL.js';
+import { sceneByLayer } from '../globals/sceneByLayer.js';
+import { positionLayout } from '../globals/positionLayout.js';
+import { normalLayout } from '../globals/normalLayout.js';
+import { colorLayout } from '../globals/colorLayout.js';
+import { uVLayout } from '../globals/uVLayout.js';
+import { instanceLayout } from '../globals/instanceLayout.js';
+import { createProgramLayout } from './createProgramLayout.js';
+import { createProgramUniforms } from './createProgramUniforms.js';
+
+
+import { materialShaders } from '../shaders/materialShaders.js';
+
+import { reportCompilation } from './reportCompilation.js';
+
+export function createProgram(backend, material = defaultMaterial) {
+  const shaders = materialShaders(
+    material,
+    !!backend.options.nightSparkle,
+    material.terrain ? elevationWGSL : ''
+  );
+  const vertex = sceneByLayer.get(backend).renderer.device.createShaderModule((
+    vertexShader.code = shaders.vertex,
+    vertexShader
+  ));
+  vertexShader.code = null;
+  const fragment = sceneByLayer.get(backend).renderer.device.createShaderModule((
+    fragmentShader.code = shaders.fragment,
+    fragmentShader
+  ));
+  fragmentShader.code = null;
+  reportCompilation(backend, /* alloc */ [
+    vertex.getCompilationInfo(),
+    fragment.getCompilationInfo()
+  ]);
+  const vertexBuffers = /* alloc */ [
+    positionLayout,
+    normalLayout,
+    material.vertexColors ? colorLayout : null,
+    shaders.textured ? uVLayout : null,
+  ];
+  if (material.instanced) vertexBuffers.push(instanceLayout);
+  const bindGroupLayout = createProgramLayout(sceneByLayer.get(backend).renderer.device, shaders);
+  const pipelineLayout = sceneByLayer.get(backend).renderer.device.createPipelineLayout((
+    sharedPipelineLayout.bindGroupLayouts[0] = bindGroupLayout,
+    sharedPipelineLayout.bindGroupLayouts[1] = sceneByLayer.get(backend).renderer.sunlight.layout,
+    sharedPipelineLayout
+  ));
+  sharedPipelineLayout.bindGroupLayouts[0] = null;
+  sharedPipelineLayout.bindGroupLayouts[1] = null;
+  const uniforms = createProgramUniforms(material);
+  return /* alloc */ {
+    device: sceneByLayer.get(backend).renderer.device,
+    vertex,
+    fragment,
+    bindings: shaders.bindings,
+    vertexBuffers,
+    bindGroupLayout,
+    pipelineLayout,
+    pipelineCache: /* alloc */ new Map(),
+    cullMode: material.doubleSided ? 'none' : 'back',
+    transparent: material.alphaMode === 'BLEND',
+    depthWrite: material.depthWrite ?? material.alphaMode !== 'BLEND',
+    depthTest: material.depthTest !== false,
+    terrain: material.terrain,
+    nightLight: Boolean(material.nightLight),
+    nightSparkle: !!backend.options.nightSparkle,
+    uniforms,
+    _layerMaterial: material,
+  };
+}