leaflet-city-mapper 0.0.2 → 0.0.3

package/src/shaders/materialShaders.js

@@ -0,0 +1,246 @@
+import { textureBinding } from '../rendering/textureBinding.js';
+
+/** Material WGSL and texture bindings, without a GPU device or Leaflet layer. */
+export function materialShaders(material = {}, sparkle = false, elevationWGSL = '') {
+  const hasBase = Boolean(material.baseTexture);
+  const hasMetal = Boolean(material.metalTexture);
+  const hasEmissive = Boolean(material.emissiveTexture);
+  const hasOcclusion = Boolean(material.occlusionTexture);
+  const hasRoof = Boolean(material.roofTexture);
+  const hasTerrain = Boolean(material.terrain);
+  const textured = hasBase || hasMetal || hasEmissive || hasOcclusion || material.nightLight;
+  const vertex = /* wgsl */ `
+    struct Mesh {
+      worldMatrix: mat4x4<f32>,
+      baseColor: vec4<f32>,
+      material: vec4<f32>,
+      emissive: vec4<f32>,
+      terrain: vec4<f32>,
+      highlight: vec4<f32>,
+    };
+    struct Frame {
+      viewMatrix: mat4x4<f32>,
+      projectionMatrix: mat4x4<f32>,
+      roofMatrix: mat4x4<f32>,
+      lightDirection: vec4<f32>,
+      skyDirection: vec4<f32>,
+      atmosphereTint: vec4<f32>,
+    };
+    @group(0) @binding(0) var<uniform> u: Mesh;
+    @group(0) @binding(1) var<uniform> frame: Frame;
+    struct Solar { matrix: mat4x4<f32>, params: vec4<f32> };
+    @group(1) @binding(0) var<uniform> solar: Solar;
+    ${hasTerrain ? /* wgsl */ `@group(0) @binding(2) var dem: texture_2d<f32>;${elevationWGSL}` : ''}
+    struct VertexInput {
+      @location(0) position: vec3<f32>,
+      @location(1) normal: vec3<f32>,
+      ${material.instanced ? '@location(4) instanceOffset: vec4<f32>,' : ''}
+      ${material.vertexColors ? '@location(2) color: vec3<f32>,' : ''}
+      ${textured ? '@location(3) uv: vec2<f32>,' : ''}
+    };
+    struct VertexOutput {
+      @builtin(position) position: vec4<f32>,
+      @location(0) color: vec3<f32>,
+      @location(1) normal: vec3<f32>,
+      @location(2) viewPosition: vec3<f32>,
+      @location(6) shadowPosition: vec4<f32>,
+      @location(7) worldPosition: vec3<f32>,
+      ${sparkle ? '@location(8) localPosition: vec3<f32>,' : ''}
+      ${textured ? '@location(3) uv: vec2<f32>,' : ''}
+      ${hasRoof ? '@location(4) roofUv: vec2<f32>, @location(5) roof: f32,' : ''}
+    };
+    @vertex fn vertexMain(input: VertexInput, @builtin(vertex_index) vertexIndex: u32) -> VertexOutput {
+      var output: VertexOutput;
+      var position = input.position${material.instanced ? ' + input.instanceOffset.xyz' : ''};
+      ${hasTerrain ? 'position.y = elevation(u.terrain.xy + input.uv * u.terrain.z, u.terrain.w) - u.terrain.w;' : ''}
+      let featureVertex = f32(vertexIndex)${material.instanced ? ' + input.instanceOffset.w' : ''};
+      let highlighted = featureVertex >= u.highlight.x && featureVertex < u.highlight.y;
+      output.color = ${material.vertexColors
+      ? 'select(input.color, vec3<f32>(72.0 / 255.0, 217.0 / 255.0, 1.0), highlighted)'
+      : 'u.baseColor.rgb'};
+      // Inverse-transpose from cofactors; the camera view matrix is orthonormal.
+      let m = mat3x3<f32>(u.worldMatrix[0].xyz, u.worldMatrix[1].xyz, u.worldMatrix[2].xyz);
+      let normal = (cross(m[1], m[2]) * input.normal.x + cross(m[2], m[0]) * input.normal.y +
+        cross(m[0], m[1]) * input.normal.z) / determinant(m);
+      output.normal = (frame.viewMatrix * vec4<f32>(normal, 0.0)).xyz;
+      let world = u.worldMatrix * vec4<f32>(position, 1.0);
+      output.shadowPosition = solar.matrix * world;
+      output.worldPosition = world.xyz / world.w;
+      ${sparkle ? `output.localPosition = input.position${material.instanced ? ' + input.instanceOffset.xyz' : ''};` : ''}
+      let viewPosition = frame.viewMatrix * world;
+      output.viewPosition = viewPosition.xyz;
+      ${textured ? 'output.uv = input.uv;' : ''}
+      ${hasRoof ? /* wgsl */ `
+        output.roofUv = (frame.roofMatrix * world).xz;
+        output.roof = select(0.0, 1.0, input.normal.y >= 0.5 && !highlighted);
+      ` : ''}
+      output.position = frame.projectionMatrix * viewPosition;
+      return output;
+    }
+  `;
+  const bindings = [];
+  const baseBinding = textureBinding(bindings, 'baseTexture', hasBase);
+  const metalBinding = textureBinding(bindings, 'metalTexture', hasMetal);
+  const emissiveBinding = textureBinding(bindings, 'emissiveTexture', hasEmissive);
+  const occlusionBinding = textureBinding(bindings, 'occlusionTexture', hasOcclusion);
+  const roofBinding = textureBinding(bindings, 'roofTexture', hasRoof);
+  const fragment = /* wgsl */ `
+    struct Mesh {
+      worldMatrix: mat4x4<f32>,
+      baseColor: vec4<f32>,
+      material: vec4<f32>,
+      emissive: vec4<f32>,
+      terrain: vec4<f32>,
+      highlight: vec4<f32>,
+    };
+    struct Frame {
+      viewMatrix: mat4x4<f32>,
+      projectionMatrix: mat4x4<f32>,
+      roofMatrix: mat4x4<f32>,
+      lightDirection: vec4<f32>,
+      skyDirection: vec4<f32>,
+      atmosphereTint: vec4<f32>,
+    };
+    struct Solar {
+      matrix: mat4x4<f32>,
+      params: vec4<f32>,
+    };
+    @group(0) @binding(0) var<uniform> u: Mesh;
+    @group(0) @binding(1) var<uniform> frame: Frame;
+    @group(1) @binding(0) var<uniform> solar: Solar;
+    @group(1) @binding(1) var shadowTexture: texture_depth_2d;
+    @group(1) @binding(2) var shadowSampler: sampler_comparison;
+    @group(1) @binding(3) var<storage, read> lightGrid: array<vec4<f32>>;
+    ${baseBinding}${metalBinding}${emissiveBinding}${occlusionBinding}${roofBinding}
+    struct FragmentInput {
+      @builtin(position) position: vec4<f32>,
+      @location(0) color: vec3<f32>,
+      @location(1) normal: vec3<f32>,
+      @location(2) viewPosition: vec3<f32>,
+      @location(6) shadowPosition: vec4<f32>,
+      @location(7) worldPosition: vec3<f32>,
+      ${sparkle ? '@location(8) localPosition: vec3<f32>,' : ''}
+      ${textured ? '@location(3) uv: vec2<f32>,' : ''}
+      ${hasRoof ? '@location(4) roofUv: vec2<f32>, @location(5) roof: f32,' : ''}
+    };
+    const PI: f32 = 3.14159265;
+    fn toLinear(c: vec3<f32>) -> vec3<f32> {
+      return select(c / 12.92, pow((c + vec3<f32>(0.055)) / 1.055, vec3<f32>(2.4)), c >= vec3<f32>(0.04045));
+    }
+    fn toSRGB(c: vec3<f32>) -> vec3<f32> {
+      return select(c * 12.92, 1.055 * pow(max(c, vec3<f32>(0.0)), vec3<f32>(1.0 / 2.4)) - vec3<f32>(0.055), c >= vec3<f32>(0.0031308));
+    }
+    fn sunVisibility(position: vec4<f32>) -> f32 {
+      let p = position.xyz / position.w;
+      let uv = vec2<f32>(p.x * 0.5 + 0.5, 0.5 - p.y * 0.5);
+      if (solar.params.x < 0.5 || any(uv < vec2<f32>(0.0)) || any(uv > vec2<f32>(1.0)) || p.z < 0.0 || p.z > 1.0) {
+        return 1.0;
+      }
+      return textureSampleCompareLevel(shadowTexture, shadowSampler, uv, p.z - 0.0003);
+    }
+    fn gridLighting(position: vec3<f32>, normal: vec3<f32>, offset: u32) -> vec3<f32> {
+      let grid = lightGrid[offset];
+      if (grid.w < 1.0) { return vec3<f32>(0.0); }
+      let cell = vec2<i32>(floor((position.xz - grid.xy) / grid.z));
+      if (any(cell < vec2<i32>(0)) || cell.x >= i32(grid.w) || cell.y >= i32(lightGrid[offset + 1u].x)) {
+        return vec3<f32>(0.0);
+      }
+      let header = lightGrid[offset + 2u + u32(cell.y) * u32(grid.w) + u32(cell.x)];
+      var light = vec3<f32>(0.0);
+      for (var i = 0u; i < u32(header.y); i++) {
+        let source = lightGrid[offset + u32(header.x) + i * 2u];
+        let colour = lightGrid[offset + u32(header.x) + i * 2u + 1u];
+        let delta = source.xyz - position;
+        let distance2 = max(dot(delta, delta), 1.0);
+        let falloff = max(0.0, 1.0 - distance2 / (source.w * source.w));
+        let lambert = max(0.0, dot(normal, delta / sqrt(distance2)));
+        light += toLinear(colour.rgb) * colour.w * lambert * falloff * falloff / distance2;
+      }
+      return light;
+    }
+    fn localLighting(position: vec3<f32>, normal: vec3<f32>) -> vec3<f32> {
+      if (frame.skyDirection.w <= 0.0) { return vec3<f32>(0.0); }
+      var light = gridLighting(position, normal, 0u);
+      let moving = u32(lightGrid[1].z);
+      if (moving > 0u) { light += gridLighting(position, normal, moving); }
+      return light * frame.skyDirection.w;
+    }
+    fn appearance(position: vec2<f32>) {
+      // Screen-door dissolve keeps opaque depth writes and avoids sorting whole buildings as glass.
+      let noise = fract(52.9829189 * fract(dot(floor(position), vec2<f32>(0.06711056, 0.00583715))));
+      if (u.highlight.w < 1.0 && noise >= u.highlight.w) { discard; }
+    }
+    @fragment fn fragmentMain(input: FragmentInput, @builtin(front_facing) frontFacing: bool) -> @location(0) vec4<f32> {
+      ${material.nightLight ? /* wgsl */ `
+        if (input.uv.x <= 2.0) {
+        let radial = max(0.0, 1.0 - dot(input.uv, input.uv));
+        let alpha = radial * radial * frame.skyDirection.w * 0.65;
+        if (alpha < 0.005) { discard; }
+        appearance(input.position.xy);
+        return vec4<f32>(input.color, alpha);
+        }
+      ` : ''}
+      let sunlight = sunVisibility(input.shadowPosition);
+      let worldNormal = normalize(transpose(mat3x3<f32>(frame.viewMatrix[0].xyz, frame.viewMatrix[1].xyz, frame.viewMatrix[2].xyz)) * normalize(input.normal)) * select(-1.0, 1.0, frontFacing);
+      let artificial = localLighting(input.worldPosition, worldNormal);
+      ${material.unlit ? /* wgsl */ `
+        let rasterTexel = ${hasBase ? 'textureSample(baseTexture, baseTextureSampler, input.uv)' : 'vec4<f32>(input.color, 1.0)'};
+        return vec4<f32>(toSRGB(toLinear(rasterTexel.rgb) * (frame.atmosphereTint.rgb * (0.55 + 0.45 * sunlight) + artificial)), ${material.alphaMode === 'BLEND' ? 'u.material.z * rasterTexel.a' : '1.0'});
+      ` : /* wgsl */ `
+      var normal = normalize(input.normal) * select(-1.0, 1.0, frontFacing);
+      let texel = ${hasBase ? 'textureSample(baseTexture, baseTextureSampler, input.uv)' : 'vec4<f32>(1.0)'};
+      let alpha = u.material.z * texel.a;
+      ${material.alphaMode === 'MASK' ? 'if (alpha < u.material.w) { discard; }' : ''}
+      ${material.alphaMode === 'BLEND' ? 'if (alpha < 0.01) { discard; }' : ''}
+      var base = ${material.vertexColors ? 'toLinear(min(input.color, vec3<f32>(1.0)))' : 'input.color'} *
+        ${material.baseTexture?.srgb ? 'texel.rgb' : 'toLinear(texel.rgb)'};
+      ${hasRoof ? /* wgsl */ `
+        if (input.roof > 0.5 && all(input.roofUv >= vec2<f32>(0.0)) &&
+          all(input.roofUv <= vec2<f32>(1.0))) {
+          let roof = textureSampleLevel(roofTexture, roofTextureSampler, input.roofUv, 0.0);
+          base = mix(base, toLinear(roof.rgb), roof.a);
+        }
+      ` : ''}
+      let mr = ${hasMetal ? 'textureSample(metalTexture, metalTextureSampler, input.uv)' : 'vec4<f32>(1.0)'};
+      let metal = clamp(u.material.x * mr.b, 0.0, 1.0);
+      let rough = clamp(u.material.y * mr.g, 0.08, 1.0);
+      let view = normalize(-input.viewPosition);
+      let halfVector = normalize(view + frame.lightDirection.xyz);
+      let nl = max(dot(normal, frame.lightDirection.xyz), 0.0) * frame.lightDirection.w * sunlight;
+      let nv = max(dot(normal, view), 0.001);
+      let nh = max(dot(normal, halfVector), 0.0);
+      let vh = max(dot(view, halfVector), 0.0);
+      let a2 = pow(rough, 4.0);
+      let d = a2 / max(PI * pow(nh * nh * (a2 - 1.0) + 1.0, 2.0), 0.0001);
+      let gv = nl * sqrt(nv * nv * (1.0 - a2) + a2);
+      let gl = nv * sqrt(nl * nl * (1.0 - a2) + a2);
+      let visibility = 0.5 / max(gv + gl, 0.0001);
+      let f0 = mix(vec3<f32>(0.04), base, metal);
+      let fresnel = f0 + (1.0 - f0) * pow(1.0 - vh, 5.0);
+      let specular = d * visibility * fresnel;
+      let diffuse = (1.0 - metal) * base / PI;
+      let sky = dot(normal, frame.skyDirection.xyz) * 0.5 + 0.5;
+      let ambient = mix(toLinear(vec3<f32>(0.455, 0.412, 0.322)), vec3<f32>(1.0), sky) * (2.0 / PI);
+      let ao = ${hasOcclusion ? 'mix(1.0, textureSample(occlusionTexture, occlusionTextureSampler, input.uv).r, u.emissive.w)' : '1.0'};
+      ${sparkle ? /* wgsl */ `
+        let lattice = (fract(input.localPosition / 2.5) - 0.5) * 2.5;
+        let pointGlow = (1.0 - smoothstep(0.16, 0.42, length(lattice))) * u.highlight.z;
+      ` : ''}
+      // Vertex colour components above 1 are self-lit (e.g. vehicle lamps): dim by day, bright at night.
+      let glow = ${sparkle ? 'vec3<f32>(3.0, 2.6, 1.8) * pointGlow +' : ''}${material.vertexColors
+      ? ' max(input.color - vec3<f32>(1.0), vec3<f32>(0.0)) * (0.3 + 5.0 * frame.skyDirection.w) +' : ''} u.emissive.rgb * ${hasEmissive
+      ? material.emissiveTexture.srgb
+        ? 'textureSample(emissiveTexture, emissiveTextureSampler, input.uv).rgb'
+        : 'toLinear(textureSample(emissiveTexture, emissiveTextureSampler, input.uv).rgb)'
+      : 'vec3<f32>(1.0)'};
+      var color = ambient * base * (1.0 - metal) * ao +
+        (diffuse + specular) * nl * toLinear(vec3<f32>(1.0, 0.937, 0.835)) * 3.0 + glow;
+      ${material.vertexColors ? 'color = base * (ambient + toLinear(vec3<f32>(1.0, 0.937, 0.835)) * (3.0 / PI) * nl) + glow;' : ''}
+      color = (color - glow) * frame.atmosphereTint.rgb + base * artificial * (1.0 - metal * 0.5) + glow;
+      appearance(input.position.xy);
+      return vec4<f32>(toSRGB(color), ${material.alphaMode === 'BLEND' ? 'alpha' : '1.0'});
+      `}
+    }
+  `;
+  return { vertex, fragment, bindings, textured, hasTerrain };
+}

package/src/shadows/bindSunlight.js

@@ -0,0 +1,12 @@
+
+export function bindSunlight(layer) {
+  const sun = layer.renderer.sunlight;
+  sun.bindGroup = layer.renderer.device.createBindGroup({
+    layout: sun.layout, entries: [
+      { binding: 0, resource: { buffer: sun.buffer } },
+      { binding: 1, resource: sun.texture.createView() },
+      { binding: 2, resource: sun.sampler },
+      { binding: 3, resource: { buffer: sun.lights } },
+    ]
+  });
+}

package/src/shadows/drawShadowMeshes.js

@@ -0,0 +1,48 @@
+export function drawShadowMeshes(backend, encoder, meshes) {
+  const renderer = backend.renderer, device = renderer.device, sun = renderer.sunlight;
+  const pass = encoder.beginRenderPass({
+    colorAttachments: [],
+    depthStencilAttachment: {
+      view: sun.texture.createView(), depthClearValue: 1,
+      depthLoadOp: 'clear', depthStoreOp: 'store'
+    },
+  });
+  let pipeline = sun.pipeline;
+  pass.setPipeline(pipeline);
+  pass.setBindGroup(1, sun.depthBindGroup);
+  let mesh, instances, nextPipeline, offset, attribute, index, range;
+  for (mesh of meshes) {
+    instances = mesh.geometry.attributes.instanceOffset;
+    nextPipeline = instances ? sun.instancePipeline : sun.pipeline;
+    if (nextPipeline !== pipeline) {
+      pipeline = nextPipeline;
+      pass.setPipeline(pipeline);
+    }
+    offset = renderer.uniformSlot++ * 256;
+    renderer.uniformData.set(mesh.worldMatrix, offset / 4);
+    renderer.uniformData[offset / 4 + 35] = mesh._appearance ?? 1;
+    if (mesh._shadowBuffer !== renderer.uniformBuffer) {
+      mesh._shadowBuffer = renderer.uniformBuffer;
+      mesh._shadowBindGroup = device.createBindGroup({
+        layout: sun.meshLayout, entries: [
+          { binding: 0, resource: { buffer: renderer.uniformBuffer, size: 144 } },
+        ]
+      });
+    }
+    for (attribute of Object.values(mesh.geometry.attributes)) {
+      if (attribute.needsUpdate) {
+        device.queue.writeBuffer(attribute.buffer, 0, attribute.data);
+        attribute.needsUpdate = false;
+      }
+    }
+    pass.setBindGroup(0, mesh._shadowBindGroup, [offset]);
+    pass.setVertexBuffer(0, mesh.geometry.attributes.position.buffer);
+    if (instances) pass.setVertexBuffer(1, instances.buffer);
+    index = mesh.geometry.attributes.index, range = mesh.geometry.drawRange;
+    if (index) {
+      pass.setIndexBuffer(index.buffer, index.indexFormat);
+      pass.drawIndexed(range.count, instances?.count ?? 1, range.start, 0, 0);
+    } else pass.draw(range.count, instances?.count ?? 1, range.start, 0);
+  }
+  pass.end();
+}

package/src/shadows/ensureShadowPipeline.js

@@ -0,0 +1,53 @@
+export function ensureShadowPipeline(device, sun, instanced = false) {
+  const key = instanced ? 'instancePipeline' : 'pipeline';
+  if (!sun[key]) {
+    if (!sun.meshLayout) {
+      sun.meshLayout = device.createBindGroupLayout({
+        entries: [
+          { binding: 0, visibility: GPUShaderStage.VERTEX | GPUShaderStage.FRAGMENT, buffer: { type: 'uniform', hasDynamicOffset: true } },
+        ]
+      });
+      // Do not bind the sampled depth texture while it is a render attachment.
+      sun.depthLayout = device.createBindGroupLayout({
+        entries: [
+          { binding: 0, visibility: GPUShaderStage.VERTEX, buffer: { type: 'uniform' } },
+        ]
+      });
+      sun.depthBindGroup = device.createBindGroup({
+        layout: sun.depthLayout, entries: [{ binding: 0, resource: { buffer: sun.buffer } }],
+      });
+    }
+    const shader = device.createShaderModule({
+      code: /* wgsl */ `
+      struct Mesh { world: mat4x4<f32>, padding: array<vec4<f32>, 4>, highlight: vec4<f32> };
+      @group(0) @binding(0) var<uniform> mesh: Mesh;
+      @group(1) @binding(0) var<uniform> matrix: mat4x4<f32>;
+      @vertex fn main(@location(0) position: vec3<f32>${instanced ? ', @location(4) offset: vec4<f32>' : ''}) -> @builtin(position) vec4<f32> {
+        return matrix * mesh.world * vec4<f32>(position${instanced ? ' + offset.xyz' : ''}, 1.0);
+      }
+      @fragment fn fragmentMain(@builtin(position) position: vec4<f32>) {
+        let noise = fract(52.9829189 * fract(dot(floor(position.xy), vec2<f32>(0.06711056, 0.00583715))));
+        if (mesh.highlight.w < 1.0 && noise >= mesh.highlight.w) { discard; }
+      }
+    ` });
+    const buffers = [
+      { arrayStride: 12, attributes: [{ shaderLocation: 0, offset: 0, format: 'float32x3' }] },
+    ];
+    if (instanced) buffers.push({
+      arrayStride: 16, stepMode: 'instance',
+      attributes: [{ shaderLocation: 4, offset: 0, format: 'float32x4' }],
+    });
+    sun[key] = device.createRenderPipeline({
+      layout: device.createPipelineLayout({ bindGroupLayouts: [sun.meshLayout, sun.depthLayout] }),
+      vertex: {
+        module: shader, entryPoint: 'main', buffers
+      },
+      fragment: { module: shader, entryPoint: 'fragmentMain', targets: [] },
+      primitive: { topology: 'triangle-list', cullMode: 'none' },
+      depthStencil: {
+        format: 'depth32float', depthWriteEnabled: true, depthCompare: 'less',
+        depthBias: 2, depthBiasSlopeScale: 2
+      },
+    });
+  }
+}

package/src/shadows/renderSunlight.js

@@ -0,0 +1,46 @@
+import { shadowCacheMatches } from './shadowCacheMatches.js';
+import { shadowMatrix } from './shadowMatrix.js';
+import { ensureShadowPipeline } from './ensureShadowPipeline.js';
+import { drawShadowMeshes } from './drawShadowMeshes.js';
+import { resizeSunlight } from './resizeSunlight.js';
+
+/** One shared directional depth map. Off-screen but loaded geometry can cast shadows. */
+
+export function renderSunlight(backend, encoder, meshes, sunlight) {
+  const renderer = backend.renderer, device = renderer.device, sun = renderer.sunlight;
+  if (!meshes.length || !sunlight || sunlight.altitude < 3) {
+    if (!sun.enabled) return;
+    const values = new Float32Array(20);
+    values.set([1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1]);
+    device.queue.writeBuffer(sun.buffer, 0, values);
+    sun.enabled = false;
+    sun.cache = null;
+    return;
+  }
+  if (shadowCacheMatches(sun, meshes, sunlight)) return;
+  const values = new Float32Array(20);
+  sun.enabled = true;
+  resizeSunlight(backend, Math.min(2048, device.limits.maxTextureDimension2D));
+  values.set(shadowMatrix(meshes, sunlight));
+  values[16] = 1;
+  device.queue.writeBuffer(sun.buffer, 0, values);
+  ensureShadowPipeline(device, sun);
+  let mesh;
+  for (mesh of meshes) {
+    if (mesh.geometry.attributes.instanceOffset) {
+      ensureShadowPipeline(device, sun, true);
+      break;
+    }
+  }
+  drawShadowMeshes(backend, encoder, meshes);
+  const snapshots = new Map();
+  let mesh2;
+  for (mesh2 of meshes) {
+    snapshots.set(mesh2, {
+      world: mesh2._worldMatrixVersion, geometry: mesh2.geometry,
+      start: mesh2.geometry.drawRange.start, count: mesh2.geometry.drawRange.count,
+      appearance: mesh2._appearance ?? 1,
+    });
+  }
+  sun.cache = { direction: [...sunlight.direction], meshes: snapshots };
+}

package/src/shadows/resizeSunlight.js

@@ -0,0 +1,15 @@
+import { bindSunlight } from './bindSunlight.js';
+import { destroyTexture } from '../rendering/destroyTexture.js';
+
+
+export function resizeSunlight(backend, size) {
+  const device = backend.renderer.device, sun = backend.renderer.sunlight;
+  if (sun.size === size) return;
+  if (sun.texture) destroyTexture(backend, sun.texture);
+  sun.size = size;
+  sun.texture = device.createTexture({
+    size: [size, size], format: 'depth32float',
+    usage: GPUTextureUsage.RENDER_ATTACHMENT | GPUTextureUsage.TEXTURE_BINDING | GPUTextureUsage.COPY_SRC,
+  });
+  bindSunlight(backend);
+}

package/src/shadows/shadowBounds.js

@@ -0,0 +1,32 @@
+import { computeBounds } from '../geometry/computeBounds.js';
+
+export function shadowBounds(meshes) {
+  const min = [Infinity, Infinity, Infinity], max = [-Infinity, -Infinity, -Infinity];
+  let mesh, bounds, matrix, cached, i, x, y, z, w, axis, value;
+  for (mesh of meshes) {
+    if (!mesh.geometry.bounds || mesh.geometry.attributes.position.needsUpdate) computeBounds(mesh.geometry);
+    bounds = mesh.geometry.bounds, matrix = mesh.worldMatrix;
+    cached = mesh._shadowBounds;
+    if (!cached || cached.version !== mesh._worldMatrixVersion || cached.bounds !== bounds) {
+      cached = mesh._shadowBounds = { version: mesh._worldMatrixVersion, bounds,
+        min: [Infinity, Infinity, Infinity], max: [-Infinity, -Infinity, -Infinity] };
+      for (i = 0; i < 8; i++) {
+        x = i & 1 ? bounds.max[0] : bounds.min[0], y = i & 2 ? bounds.max[1] : bounds.min[1];
+        z = i & 4 ? bounds.max[2] : bounds.min[2];
+        w = matrix[3] * x + matrix[7] * y + matrix[11] * z + matrix[15];
+        for (axis = 0; axis < 3; axis++) {
+          value = (matrix[axis] * x + matrix[axis + 4] * y + matrix[axis + 8] * z + matrix[axis + 12]) / w;
+          cached.min[axis] = Math.min(cached.min[axis], value);
+          cached.max[axis] = Math.max(cached.max[axis], value);
+        }
+      }
+    }
+    for (axis = 0; axis < 3; axis++) {
+      min[axis] = Math.min(min[axis], cached.min[axis]);
+      max[axis] = Math.max(max[axis], cached.max[axis]);
+    }
+  }
+  // Include ground receivers below/around the loaded buildings and trees.
+  min[1] = Math.min(0, min[1]);
+  return { min, max };
+}

package/src/shadows/shadowCacheMatches.js

@@ -0,0 +1,23 @@
+export function shadowCacheMatches(sun, meshes, sunlight) {
+  const cache = sun.cache;
+  let unchanged = sun.enabled && cache?.meshes.size === meshes.length;
+  let i, mesh, previous, range, attribute;
+  if (unchanged) {
+    for (i = 0; i < sunlight.direction.length; i++) {
+      if (sunlight.direction[i] !== cache.direction[i]) { unchanged = false; break; }
+    }
+  }
+  if (unchanged) {
+    for (mesh of meshes) {
+      previous = cache.meshes.get(mesh), range = mesh.geometry.drawRange;
+      if (!(previous && previous.world === mesh._worldMatrixVersion && previous.geometry === mesh.geometry &&
+        previous.start === range.start && previous.count === range.count &&
+        previous.appearance === (mesh._appearance ?? 1))) { unchanged = false; break; }
+      for (attribute of Object.values(mesh.geometry.attributes)) {
+        if (attribute.needsUpdate) { unchanged = false; break; }
+      }
+      if (!unchanged) break;
+    }
+  }
+  return unchanged;
+}

package/src/shadows/shadowMatrix.js

@@ -0,0 +1,39 @@
+import { shadowBounds } from './shadowBounds.js';
+import { updateCamera } from '../scene/updateCamera.js';
+
+export function shadowMatrix(meshes, sunlight) {
+  const { min, max } = shadowBounds(meshes);
+  const span = [], center = [], position = [];
+  let i, corner, axis, point, coordinates, value;
+  for (i = 0; i < 3; i++) {
+    span[i] = max[i] - min[i];
+    center[i] = (min[i] + max[i]) / 2;
+  }
+  const radius = Math.max(100, Math.hypot(...span));
+  for (i = 0; i < 3; i++) position[i] = center[i] + sunlight.direction[i] * radius * 2;
+  const lightCamera = {
+    position,
+    target: center, up: [0, 0, -1], fov: 45, aspect: 1, near: 1, far: radius * 5,
+    viewMatrix: [], projectionMatrix: [], projectionViewMatrix: [],
+  };
+  updateCamera(lightCamera);
+  const view = new DOMMatrix(lightCamera.viewMatrix);
+  const low = [Infinity, Infinity, Infinity], high = [-Infinity, -Infinity, -Infinity];
+  for (i = 0; i < 8; i++) {
+    corner = [];
+    for (axis = 0; axis < 3; axis++) corner[axis] = i & (1 << axis) ? max[axis] : min[axis];
+    point = new DOMPoint(...corner, 1).matrixTransform(view);
+    coordinates = [point.x, point.y, point.z];
+    for (axis = 0; axis < 3; axis++) {
+      value = coordinates[axis];
+      low[axis] = Math.min(low[axis], value - 20);
+      high[axis] = Math.max(high[axis], value + 20);
+    }
+  }
+  for (i = 0; i < 3; i++) span[i] = high[i] - low[i];
+  const projection = new DOMMatrix([
+    2 / span[0], 0, 0, 0, 0, 2 / span[1], 0, 0, 0, 0, -1 / span[2], 0,
+    -(high[0] + low[0]) / span[0], -(high[1] + low[1]) / span[1], high[2] / span[2], 1,
+  ]);
+  return projection.multiply(view).toFloat32Array();
+}

package/src/sources/addGeneratedTriangle.js

@@ -0,0 +1,6 @@
+import { addTriangle } from './addTriangle.js';
+import { pumpState } from '../constants/pumpState.js';
+
+export function addGeneratedTriangle(...args) {
+  addTriangle(pumpState.triangleContexts[pumpState.triangleContexts.length - 1], ...args);
+}

package/src/sources/addTriangle.js

@@ -0,0 +1,17 @@
+import { groundOffset } from './groundOffset.js';
+
+export function addTriangle(context, a, ah, b, bh, c, ch, nx, ny, nz, color) {
+  const { backend, positions, normals, colors, uvs } = context;
+  const ux = b.x - a.x, uy = bh - ah, uz = a.y - b.y;
+  const vx = c.x - a.x, vy = ch - ah, vz = a.y - c.y;
+  if ((uy * vz - uz * vy) * nx + (uz * vx - ux * vz) * ny + (ux * vy - uy * vx) * nz < 0) {
+    const point = b, height = bh;
+    b = c; bh = ch; c = point; ch = height;
+  }
+  positions.push(a.x, ah + groundOffset(a), -a.y,
+    b.x, bh + groundOffset(b), -b.y,
+    c.x, ch + groundOffset(c), -c.y);
+  normals.push(nx, ny, nz, nx, ny, nz, nx, ny, nz);
+  colors.push(color.r, color.g, color.b, color.r, color.g, color.b, color.r, color.g, color.b);
+  if (backend.options.nightLight) uvs.push(...a.uv, ...b.uv, ...c.uv);
+}

package/src/sources/attachAreaMesh.js

@@ -0,0 +1,58 @@
+import { emptyNode } from '../scene/emptyNode.js';
+import { createProgram } from '../rendering/createProgram.js';
+import { cityMapper } from '../constants/cityMapper.js';
+import { setParent } from '../scene/setParent.js';
+import { update } from '../scene/update.js';
+import { instanceAreaGeometry } from './instanceAreaGeometry.js';
+
+export function attachAreaMesh(context) {
+  const { backend, area } = context;
+  if (!context.positions.length) {
+    Object.assign(area, { mesh: null, buildings: 0, skipped: context.skipped, done: true });
+    return;
+  }
+  const device = backend.renderer.device;
+  const data = instanceAreaGeometry(context);
+  const attributes = {
+    position: { size: 3, data: new Float32Array(data.positions) },
+    normal: { size: 3, data: new Float32Array(data.normals) },
+    color: { size: 3, data: new Float32Array(data.colors) },
+  };
+  if (data.instanceOffsets) attributes.instanceOffset = { size: 4, data: data.instanceOffsets };
+  if (backend.options.nightLight) attributes.uv = { size: 2, data: new Float32Array(context.uvs) };
+  let name, attribute;
+  for ([name, attribute] of Object.entries(attributes)) {
+    attribute.count = attribute.data.length / attribute.size;
+    attribute.buffer = device.createBuffer({
+      size: Math.max(4, attribute.data.byteLength),
+      usage: GPUBufferUsage.VERTEX | GPUBufferUsage.COPY_DST,
+    });
+    device.queue.writeBuffer(attribute.buffer, 0, attribute.data);
+  }
+  const meshGeometry = {
+    device,
+    attributes,
+    drawRange: { start: 0, count: attributes.position.count },
+  };
+  Object.assign(area, {
+    mesh: {
+      ...emptyNode(),
+      device,
+      geometry: meshGeometry,
+      program: createProgram(backend, {
+        instanced: Boolean(data.instanceOffsets),
+        vertexColors: true, roofTexture: Boolean(backend.options.roofTexture),
+        ...(backend.options.nightLight ? { nightLight: true, alphaMode: 'BLEND', doubleSided: true } : {}),
+      }),
+      id: cityMapper.nextId++,
+      renderOrder: 0,
+      fadeDuration: 250,
+      extras: { featureFaces: context.featureFaces, lights: context.lights },
+    },
+    buildings: context.featureFaces.length,
+    skipped: context.skipped,
+    done: true,
+  });
+  setParent(area.mesh, backend.root);
+  update(backend);
+}

package/src/sources/buildArea.js

@@ -0,0 +1,42 @@
+import { buildAreaFeature } from './buildAreaFeature.js';
+import { attachAreaMesh } from './attachAreaMesh.js';
+import { loadSource } from '../archives/loadSource.js';
+import { sourceAreaContext } from './sourceAreaContext.js';
+import { pump } from './pump.js';
+
+export async function buildArea(backend, area, map) {
+  let feature;
+  try {
+    await new Promise(requestAnimationFrame);
+    await map._terrain3D?._terrainPromise;
+    if (area.request.signal.aborted) return;
+    const data = await loadSource(backend, area);
+    if (area.request.signal.aborted) return;
+    if (data?.type !== 'FeatureCollection' || !Array.isArray(data.features)) {
+      throw new Error('Invalid GeoJSON response');
+    }
+    if (backend._geojson && typeof backend.options.style !== 'function') {
+      throw new Error('style must be a function');
+    }
+    const context = sourceAreaContext(backend, area, map);
+    let deadline = performance.now() + 4;
+    for (feature of data.features) {
+      if (area.request.signal.aborted) return;
+      if (performance.now() >= deadline) {
+        await new Promise(requestAnimationFrame);
+        if (area.request.signal.aborted) return;
+        deadline = performance.now() + 4;
+      }
+      buildAreaFeature(context, feature);
+    }
+    attachAreaMesh(context);
+  } catch (error) {
+    if (!area.request.signal.aborted) {
+      area.error = error.message;
+      backend.fire('error', { error });
+    }
+  } finally {
+    backend._inflight--;
+    pump(backend, map);
+  }
+}