leaflet-city-mapper 0.0.7 → 0.0.8

package/src/native/syncGridLayer.js

@@ -1,74 +1,27 @@
-import { L } from '../globals/L.js';
-import { coreWhite } from '../globals/coreWhite.js';
-import { streamTerrainByMap } from '../weakmaps/streamTerrainByMap.js';
-
-import { styleNativeMesh } from './styleNativeMesh.js';
-import { quadNativeMesh } from './quadNativeMesh.js';
-import { boundsQuad } from '../geometry/boundsQuad.js';
-import { loadGridTerrain } from './loadGridTerrain.js';
-import { terrainGridMesh } from './terrainGridMesh.js';
+import { prepareGridTerrainRequests } from './prepareGridTerrainRequests.js';
+import { syncGridTile } from './syncGridTile.js';
+import { syncTerrainGridTile } from './syncTerrainGridTile.js';
+import { retainGridTerrain } from './retainGridTerrain.js';
 
 
 export function syncGridLayer(state) {
-  const { source, textures, meshes } = state;
-  const stream = streamTerrainByMap.get(state.map);
-  if (state.terrainStream !== stream) {
-    state.terrainStream = stream;
-    state.terrainRequests = stream ? /* alloc */ new Map() : null;
-  }
-  let key, tile, opacity, retained, mesh, nw, se, request, pending = false;
-  if (state.terrainRequests) {
-    for (key of state.terrainRequests.keys()) {
-      if (!source._tiles[key]) state.terrainRequests.delete(key);
-    }
-  }
+  const { source } = state;
+  const stream = prepareGridTerrainRequests(state);
+  let key, tile, opacity, mesh, pending = false;
   for (key in source._tiles) {
     if (!Object.hasOwn(source._tiles, key)) continue;
     tile = source._tiles[key];
     if (!tile.loaded || tile.el instanceof HTMLImageElement && !tile.el.naturalWidth) {
-      if (stream) pending = true;
+      pending = Boolean(stream);
       continue;
     }
     opacity = (source.options.opacity ?? 1) * (tile._gpuOpacity ?? 1);
-    retained = textures.get(key);
-    mesh = meshes.get(key);
-    if (state.terrainRequests) {
-      request = state.terrainRequests.get(key);
-      if (!request || request.tile !== tile) {
-        request = /* alloc */ { tile, stream };
-        state.terrainRequests.set(key, request);
-        loadGridTerrain(state, key, tile, request);
-      }
-      if (!request.tiles) {
-        pending = true;
-        if (mesh && retained?.image === tile.el) {
-          retained.used = true;
-          styleNativeMesh(state, mesh, coreWhite, opacity);
-        }
-        continue;
-      }
-      if (mesh && mesh._terrainRequest === request && retained?.image === tile.el &&
-        retained.url === (tile.el.currentSrc || tile.el.src)) {
-        retained.used = true;
-        styleNativeMesh(state, mesh, coreWhite, opacity);
-      } else mesh = terrainGridMesh(state, key, tile, request, opacity);
-    } else if (mesh && !mesh._terrainRequest && retained?.image === tile.el && retained.url === (tile.el.currentSrc || tile.el.src)) {
-      retained.used = true;
-      styleNativeMesh(state, mesh, coreWhite, opacity);
-    } else {
-      [nw, se] = source._tileCoordsToNwSe(tile.coords);
-      mesh = quadNativeMesh(state, key, tile.el, boundsQuad(state,
-        /* alloc */ new L.LatLngBounds(nw, se)), opacity);
-    }
+    mesh = state.terrainRequests ? syncTerrainGridTile(state, key, tile, opacity)
+      : syncGridTile(state, key, tile, opacity);
+    if (state.terrainRequests && !state.terrainRequests.get(key).tiles) pending = true;
     if (mesh) mesh.renderOrder += tile.coords.z / 100;
   }
   if (stream && (pending || !Object.keys(source._tiles).length)) {
-    for ([key, mesh] of meshes) {
-      if (source._tiles[key] || !mesh._terrainRequest) continue;
-      retained = textures.get(key);
-      if (!retained) continue;
-      retained.used = true;
-      mesh._nativeUsed = true;
-    }
+    retainGridTerrain(state);
   }
 }

package/src/native/syncGridTile.js

@@ -0,0 +1,18 @@
+import { L } from '../globals/L.js';
+import { coreWhite } from '../globals/coreWhite.js';
+import { styleNativeMesh } from './styleNativeMesh.js';
+import { quadNativeMesh } from './quadNativeMesh.js';
+import { boundsQuad } from '../geometry/boundsQuad.js';
+
+export function syncGridTile(state, key, tile, opacity) {
+  const retained = state.textures.get(key), mesh = state.meshes.get(key);
+  if (mesh && !mesh._terrainRequest && retained?.image === tile.el &&
+    retained.url === (tile.el.currentSrc || tile.el.src)) {
+    retained.used = true;
+    styleNativeMesh(state, mesh, coreWhite, opacity);
+    return mesh;
+  }
+  const [nw, se] = state.source._tileCoordsToNwSe(tile.coords);
+  return quadNativeMesh(state, key, tile.el,
+    boundsQuad(state, /* alloc */ new L.LatLngBounds(nw, se)), opacity);
+}

package/src/native/syncTerrainGridTile.js

@@ -0,0 +1,28 @@
+import { coreWhite } from '../globals/coreWhite.js';
+import { loadGridTerrain } from './loadGridTerrain.js';
+import { styleNativeMesh } from './styleNativeMesh.js';
+import { terrainGridMesh } from './terrainGridMesh.js';
+
+export function syncTerrainGridTile(state, key, tile, opacity) {
+  const retained = state.textures.get(key), mesh = state.meshes.get(key);
+  let request = state.terrainRequests.get(key);
+  if (!request || request.tile !== tile) {
+    request = /* alloc */ { tile, stream: state.terrainStream };
+    state.terrainRequests.set(key, request);
+    loadGridTerrain(state, key, tile, request);
+  }
+  if (!request.tiles) {
+    if (mesh && retained?.image === tile.el) {
+      retained.used = true;
+      styleNativeMesh(state, mesh, coreWhite, opacity);
+    }
+    return null;
+  }
+  if (mesh && mesh._terrainRequest === request && retained?.image === tile.el &&
+    retained.url === (tile.el.currentSrc || tile.el.src)) {
+    retained.used = true;
+    styleNativeMesh(state, mesh, coreWhite, opacity);
+    return mesh;
+  }
+  return terrainGridMesh(state, key, tile, request, opacity);
+}

package/src/rendering/drawGeometry.js

@@ -7,7 +7,7 @@ import { prepareMeshTextures } from '../textures/prepareMeshTextures.js';
 
 /** Upload retained CPU data and draw one mesh in the active WebGPU render pass. */
 export function drawGeometry(layer, mesh, pass, cullMode, frontFace) {
-  const { geometry } = mesh;
+  const { geometry } = mesh, { attributes, drawRange } = geometry;
   const renderer = rendererByLayer.get(layer);
   const { device } = renderer;
   const pipeline = drawPipeline(renderer, mesh, cullMode, frontFace);
@@ -19,25 +19,25 @@ export function drawGeometry(layer, mesh, pass, cullMode, frontFace) {
     meshOffsets
   ));
 
-  pass.setVertexBuffer(0, geometry.attributes.position.buffer);
-  pass.setVertexBuffer(1, geometry.attributes.normal.buffer);
-  if (geometry.attributes.color) pass.setVertexBuffer(2, geometry.attributes.color.buffer);
-  if (geometry.attributes.uv) pass.setVertexBuffer(3, geometry.attributes.uv.buffer);
-  const instances = geometry.attributes.instanceOffset;
+  pass.setVertexBuffer(0, attributes.position.buffer);
+  pass.setVertexBuffer(1, attributes.normal.buffer);
+  if (attributes.color) pass.setVertexBuffer(2, attributes.color.buffer);
+  if (attributes.uv) pass.setVertexBuffer(3, attributes.uv.buffer);
+  const instances = attributes.instanceOffset;
   if (instances) pass.setVertexBuffer(4, instances.buffer);
   let name, attribute;
-  for (name in geometry.attributes) {
-    attribute = geometry.attributes[name];
+  for (name in attributes) {
+    attribute = attributes[name];
     if (!attribute.needsUpdate) continue;
     device.queue.writeBuffer(attribute.buffer, 0, attribute.data);
     attribute.needsUpdate = false;
     if (name === 'position' || name === 'instanceOffset') geometry.bounds = null;
   }
-  const index = geometry.attributes.index;
+  const index = attributes.index;
   if (index) {
     pass.setIndexBuffer(index.buffer, index.indexFormat);
-    pass.drawIndexed(geometry.drawRange.count, instances?.count ?? 1, geometry.drawRange.start, 0, 0);
+    pass.drawIndexed(drawRange.count, instances?.count ?? 1, drawRange.start, 0, 0);
   } else {
-    pass.draw(geometry.drawRange.count, instances?.count ?? 1, geometry.drawRange.start, 0);
+    pass.draw(drawRange.count, instances?.count ?? 1, drawRange.start, 0);
   }
 }

package/src/rendering/resizeRenderer.js

@@ -8,25 +8,26 @@ import { colorTexture as sharedColorTexture } from '../globals/colorTexture.js';
 import { destroyTexture } from '../textures/destroyTexture.js';
 
 export function resizeRenderer(layer, size) {
+  const renderer = rendererByLayer.get(layer);
   if (!sizeByLayer.get(layer) || !sizeByLayer.get(layer).equals(size)) {
-    rendererByLayer.get(layer).width = size.x;
-    rendererByLayer.get(layer).height = size.y;
-    rendererByLayer.get(layer).canvas.width = Math.round(size.x * rendererByLayer.get(layer).dpr);
-    rendererByLayer.get(layer).canvas.height = Math.round(size.y * rendererByLayer.get(layer).dpr);
-    rendererByLayer.get(layer).canvas.style.width = `${size.x}px`;
-    rendererByLayer.get(layer).canvas.style.height = `${size.y}px`;
-    if (rendererByLayer.get(layer).depthTexture) destroyTexture(layer, rendererByLayer.get(layer).depthTexture);
-    rendererByLayer.get(layer).colorTexture?.destroy();
-    rendererByLayer.get(layer).colorTexture = rendererByLayer.get(layer).device.createTexture((
-      sharedColorTexture.size[0] = rendererByLayer.get(layer).canvas.width,
-      sharedColorTexture.size[1] = rendererByLayer.get(layer).canvas.height,
-      sharedColorTexture.format = rendererByLayer.get(layer).format,
+    renderer.width = size.x;
+    renderer.height = size.y;
+    renderer.canvas.width = Math.round(size.x * renderer.dpr);
+    renderer.canvas.height = Math.round(size.y * renderer.dpr);
+    renderer.canvas.style.width = `${size.x}px`;
+    renderer.canvas.style.height = `${size.y}px`;
+    if (renderer.depthTexture) destroyTexture(layer, renderer.depthTexture);
+    renderer.colorTexture?.destroy();
+    renderer.colorTexture = renderer.device.createTexture((
+      sharedColorTexture.size[0] = renderer.canvas.width,
+      sharedColorTexture.size[1] = renderer.canvas.height,
+      sharedColorTexture.format = renderer.format,
       sharedColorTexture.usage = GPUTextureUsage.RENDER_ATTACHMENT,
       sharedColorTexture
     ));
-    rendererByLayer.get(layer).depthTexture = rendererByLayer.get(layer).device.createTexture((
-      sharedDepthTexture.size[0] = rendererByLayer.get(layer).canvas.width,
-      sharedDepthTexture.size[1] = rendererByLayer.get(layer).canvas.height,
+    renderer.depthTexture = renderer.device.createTexture((
+      sharedDepthTexture.size[0] = renderer.canvas.width,
+      sharedDepthTexture.size[1] = renderer.canvas.height,
       sharedDepthTexture.usage = GPUTextureUsage.RENDER_ATTACHMENT,
       sharedDepthTexture
     ));

package/src/scene/initializerFor.js

@@ -2,8 +2,9 @@ import { initRaster } from '../raster/initRaster.js';
 import { initTerrain } from '../terrain/initTerrain.js';
 import { initTraffic } from '../traffic/initTraffic.js';
 import { initCog } from '../cog/initCog.js';
+import { sceneEmptyOptions } from '../globals/sceneEmptyOptions.js';
 
-export function initializerFor(type, options = {}) {
+export function initializerFor(type, options = sceneEmptyOptions) {
   switch (type) {
     case 'raster': return options.asset !== undefined || /\.tiff?(?:[?#]|$)/i.test(options.url)
       ? initCog : initRaster;

package/src/scene/layerInitialize.js

@@ -36,7 +36,7 @@ export function layerInitialize(options = sceneEmptyOptions) {
   if (type === 'vector') {
     if (isVectorTileSource(settings)) {
       initVectorTiles(this, settings);
-    } else if (settings.data !== undefined ||
+    } else if (settings.data !== undefined || settings.style !== undefined && !settings.url ||
         settings.url && !/\.(?:pmtiles|glb|gltf)(?:[?#]|$)/i.test(settings.url)) {
       initializeGeoJSON(this, settings);
     } else {

package/src/shadows/drawShadowMeshes.js

@@ -15,9 +15,10 @@ export function drawShadowMeshes(layer, encoder, meshes) {
   let pipeline = sun.pipeline;
   pass.setPipeline(pipeline);
   pass.setBindGroup(1, sun.depthBindGroup);
-  let mesh, instances, nextPipeline, offset, attribute, index, range;
+  let mesh, attributes, instances, nextPipeline, offset, attribute, index, range;
   for (mesh of meshes) {
-    instances = mesh.geometry.attributes.instanceOffset;
+    attributes = mesh.geometry.attributes;
+    instances = attributes.instanceOffset;
     nextPipeline = instances ? sun.instancePipeline : sun.pipeline;
     if (nextPipeline !== pipeline) {
       pipeline = nextPipeline;
@@ -36,7 +37,7 @@ export function drawShadowMeshes(layer, encoder, meshes) {
       shadowBindGroup.layout = null;
       shadowBindGroup.entries[0].resource.buffer = null;
     }
-    for (attribute of Object.values(mesh.geometry.attributes)) {
+    for (attribute of Object.values(attributes)) {
       if (attribute.needsUpdate) {
         device.queue.writeBuffer(attribute.buffer, 0, attribute.data);
         attribute.needsUpdate = false;
@@ -47,9 +48,9 @@ export function drawShadowMeshes(layer, encoder, meshes) {
       shadowOffsets
     ));
 
-    pass.setVertexBuffer(0, mesh.geometry.attributes.position.buffer);
+    pass.setVertexBuffer(0, attributes.position.buffer);
     if (instances) pass.setVertexBuffer(1, instances.buffer);
-    index = mesh.geometry.attributes.index, range = mesh.geometry.drawRange;
+    index = 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);

package/src/sources/pumpSourceAreas.js

@@ -16,7 +16,7 @@ import { pendingSourceAreas } from './pendingSourceAreas.js';
 /** Share four load/build slots across source layers, nearest ground blocks first. */
 export function pump(layer, map = layer._map) {
   const shared = map && renderers.get(map);
-  if (!shared) return;
+  if (!shared || !layersByLayer.has(shared)) return;
   const layers = /* alloc */ [];
   let sourceLayer, area, areaBackend;
   for (sourceLayer of layersByLayer.get(shared)) {

package/src/sunlight/initSunlight.js

@@ -6,12 +6,23 @@ import { onAdd } from './onAddTimeControl.js';
 import { addTo } from './addTimeControlToMap.js';
 import { remove } from './removeTimeControl.js';
 import { onRemoveSun } from './onRemoveSun.js';
+import { extendLeafletClass } from '../core/extendLeafletClass.js';
 
-L.Control.Time = L.Control.extend({
-  options: { position: 'bottomright' },
-  initialize,
-  onAdd,
-  onRemove: onRemoveSun,
-  addTo,
-  remove,
-});
+class TimeControl extends extendLeafletClass(L.Control) {
+  static initHooks = true;
+  static defaultOptions = { position: 'bottomright' };
+
+  constructor(options) {
+    super(options);
+    if (L.version.startsWith('2.')) {
+      initialize.call(this, options);
+      this.callInitHooks();
+    }
+  }
+}
+Object.assign(TimeControl.prototype, { onAdd, onRemove: onRemoveSun, addTo, remove });
+if (L.version.startsWith('1.')) {
+  TimeControl.prototype.options = Object.assign(Object.create(L.Control.prototype.options), TimeControl.defaultOptions);
+  TimeControl.prototype.initialize = initialize;
+}
+L.Control.Time = TimeControl;

package/src/textures/nativeTextureFor.js

@@ -17,8 +17,7 @@ export function textureFor(state, key, image) {
   const url = image.currentSrc || image.src;
   if (!texture || texture.image !== image || texture.url !== url) {
     if (texture) {
-      const mesh = meshes.get(key);
-      if (mesh) disposeMesh(layer, mesh);
+      disposeMesh(layer, meshes.get(key));
       meshes.delete(key);
       destroyTexture(layer, texture.texture);
       textures.delete(key);
@@ -35,7 +34,7 @@ export function textureFor(state, key, image) {
       sampler: device.createSampler(coreSampler),
     };
     textures.set(key, texture);
-    if (image instanceof HTMLCanvasElement) {
+    if (image instanceof HTMLCanvasElement || url.startsWith('data:image/svg+xml')) {
       texture.pending = true;
       uploadCanvasTexture(state, key, texture, image, device, width, height);
     } else {

package/src/textures/uploadCanvasTexture.js

@@ -2,9 +2,18 @@ import { current } from '../native/isCurrentNativeLayer.js';
 import { refreshNativeLayer } from '../native/refreshNativeLayer.js';
 
 export async function uploadCanvasTexture(state, key, texture, image, device, width, height) {
-  let bitmap;
+  let bitmap, source = image;
   try {
-    bitmap = await createImageBitmap(image);
+    if (image instanceof HTMLImageElement) {
+      const canvas = document.createElement('canvas');
+      canvas.width = width;
+      canvas.height = height;
+      const context = canvas.getContext('2d');
+      if (!context) throw /* alloc */ new Error('Unable to rasterize SVG image');
+      context.drawImage(image, 0, 0, width, height);
+      source = canvas;
+    }
+    bitmap = await createImageBitmap(source);
     if (!current(state) || state.textures.get(key) !== texture) return;
     device.queue.copyExternalImageToTexture(
       /* alloc */ { source: bitmap },

package/src/vector-tiles/createVectorLabel.js

@@ -0,0 +1,22 @@
+import { evaluateStyle } from '../vector-style/evaluateStyle.js';
+import { projectVectorPoint } from './projectVectorPoint.js';
+import { vectorStyleValue } from './vectorStyleValue.js';
+
+export function createVectorLabel(job, layer, entry, properties, order, text, icon, anchor, size) {
+  return /* alloc */ {
+    text, latlng: projectVectorPoint(anchor.point, job.coords, layer.extent),
+    order, entry, properties, size, pixelBase: anchor.length * 256 / layer.extent / 2 ** job.coords.z,
+    along: anchor.a ? /* alloc */ [
+      projectVectorPoint(anchor.a, job.coords, layer.extent),
+      projectVectorPoint(anchor.b, job.coords, layer.extent),
+    ] : null,
+    icon: text.trim() ? null : icon,
+    iconOffset: evaluateStyle(entry.layout?.['icon-offset'], properties, job.zoom) || /* alloc */ [0, 0],
+    allowOverlap: entry.layout?.['icon-allow-overlap'] === true,
+    color: vectorStyleValue(entry.paint, 'text-color', '#000', properties, job.zoom),
+    halo: vectorStyleValue(entry.paint, 'text-halo-color', '#fff', properties, job.zoom),
+    haloWidth: vectorStyleValue(entry.paint, 'text-halo-width', 0, properties, job.zoom),
+    priority: /* alloc */ ['place_labels', 'place'].includes(entry['source-layer']) ? 0
+      : /* alloc */ ['street_labels', 'transportation_name'].includes(entry['source-layer']) ? 1 : 2,
+  };
+}

package/src/vector-tiles/prepareVectorLabel.js

@@ -1,43 +1,25 @@
 import { evaluateStyle } from '../vector-style/evaluateStyle.js';
-import { projectVectorPoint } from './projectVectorPoint.js';
-import { vectorLabelProperty } from './vectorLabelProperty.js';
 import { vectorStyleValue } from './vectorStyleValue.js';
-import { vectorLabelAnchors } from './vectorLabelAnchors.js';
+import { vectorLabelAnchors } from './vectorLabelAnchors.js';
+import { vectorLabelText } from './vectorLabelText.js';
+import { createVectorLabel } from './createVectorLabel.js';
 
 export function prepareVectorLabel(job, layer, entry, feature, order) {
-  let text = entry.layout?.['text-field'];
   const { properties } = feature, { zoom } = job;
+  const text = vectorLabelText(entry, properties, zoom);
   const icon = entry.layout?.['symbol-placement'] === 'line' ? null
     : evaluateStyle(entry.layout?.['icon-image'], properties, zoom);
-  if (Array.isArray(text)) text = evaluateStyle(text, properties, zoom);
-  if (typeof text !== 'string') text = '';
-  text = text.replace(/\{([^}]+)\}/g, vectorLabelProperty.bind(null, properties));
   if (!text.trim() && typeof icon !== 'string') return;
-  if (entry.layout?.['text-transform'] === 'uppercase') text = text.toUpperCase();
-  const size = vectorStyleValue(entry.layout, 'text-size', 12, properties, zoom), line = feature.type === 2 && text.trim();
-  const spacing = layer.extent / 16, anchors = /* alloc */ [];
-  let path, anchor;
-  for (path of line ? feature.geometry : feature.geometry.slice(0, 1)) {
-    if (!path?.length) continue;
-    if (!line) anchors.push(/* alloc */ { point: path[Math.floor(path.length / 2)], a: null });
-    else for (anchor of vectorLabelAnchors(path, spacing)) anchors.push(anchor);
-  }
-  for (anchor of anchors) {
-    if (anchor.point[0] < 0 || anchor.point[0] >= layer.extent || anchor.point[1] < 0 || anchor.point[1] >= layer.extent) continue;
-    job.labels.push(/* alloc */ { text, latlng: projectVectorPoint(anchor.point, job.coords, layer.extent),
-    order, entry, properties, size, pixelBase: anchor.length * 256 / layer.extent / 2 ** job.coords.z,
-    along: anchor.a ? /* alloc */ [
-      projectVectorPoint(anchor.a, job.coords, layer.extent),
-      projectVectorPoint(anchor.b, job.coords, layer.extent),
-    ] : null,
-    icon: text.trim() ? null : icon,
-    iconOffset: evaluateStyle(entry.layout?.['icon-offset'], properties, zoom) || /* alloc */ [0, 0],
-    allowOverlap: entry.layout?.['icon-allow-overlap'] === true,
-    color: vectorStyleValue(entry.paint, 'text-color', '#000', properties, zoom),
-    halo: vectorStyleValue(entry.paint, 'text-halo-color', '#fff', properties, zoom),
-    haloWidth: vectorStyleValue(entry.paint, 'text-halo-width', 0, properties, zoom),
-    priority: /* alloc */ ['place_labels', 'place'].includes(entry['source-layer']) ? 0
-      : /* alloc */ ['street_labels', 'transportation_name'].includes(entry['source-layer']) ? 1 : 2,
-        });
-      }
-    }
+  const size = vectorStyleValue(entry.layout, 'text-size', 12, properties, zoom), line = feature.type === 2 && text.trim();
+  const spacing = layer.extent / 16, anchors = /* alloc */ [];
+  let path, anchor;
+  for (path of line ? feature.geometry : feature.geometry.slice(0, 1)) {
+    if (!path?.length) continue;
+    if (!line) anchors.push(/* alloc */ { point: path[Math.floor(path.length / 2)], a: null });
+    else for (anchor of vectorLabelAnchors(path, spacing)) anchors.push(anchor);
+  }
+  for (anchor of anchors) {
+    if (anchor.point[0] < 0 || anchor.point[0] >= layer.extent || anchor.point[1] < 0 || anchor.point[1] >= layer.extent) continue;
+    job.labels.push(createVectorLabel(job, layer, entry, properties, order, text, icon, anchor, size));
+  }
+}

package/src/vector-tiles/updateVectorLabelStyle.js

@@ -0,0 +1,8 @@
+import { evaluateStyle } from '../vector-style/evaluateStyle.js';
+
+export function updateVectorLabelStyle(label, zoom) {
+  label.size = evaluateStyle(label.entry.layout?.['text-size'] ?? 12, label.properties, zoom);
+  label.color = evaluateStyle(label.entry.paint?.['text-color'] ?? '#000', label.properties, zoom);
+  label.halo = evaluateStyle(label.entry.paint?.['text-halo-color'] ?? '#fff', label.properties, zoom);
+  label.haloWidth = evaluateStyle(label.entry.paint?.['text-halo-width'] ?? 0, label.properties, zoom);
+}

package/src/vector-tiles/vectorLabelCells.js

@@ -1,17 +1,14 @@
-import { evaluateStyle } from '../vector-style/evaluateStyle.js';
 import { vectorStyleZoom } from './vectorStyleZoom.js';
 import { vectorTileOptionsByLayer } from '../weakmaps/vectorTileOptionsByLayer.js';
 import { visibleStyle } from '../vector-style/visibleStyle.js';
+import { updateVectorLabelStyle } from './updateVectorLabelStyle.js';
 
 export function vectorLabelCells(layer, label, size) {
   const map = layer._map, zoom = vectorStyleZoom(layer);
   if (!visibleStyle(label.entry, label.properties, zoom)) return null;
-  label.size = evaluateStyle(label.entry.layout?.['text-size'] ?? 12, label.properties, zoom);
+  updateVectorLabelStyle(label, zoom);
   if (!(label.size > 0)) return null;
   if (label.icon && !vectorTileOptionsByLayer.get(layer).spriteSheet?.index[label.icon]) return null;
-  label.color = evaluateStyle(label.entry.paint?.['text-color'] ?? '#000', label.properties, zoom);
-  label.halo = evaluateStyle(label.entry.paint?.['text-halo-color'] ?? '#fff', label.properties, zoom);
-  label.haloWidth = evaluateStyle(label.entry.paint?.['text-halo-width'] ?? 0, label.properties, zoom);
   if (label.along && label.pixelBase * 2 ** map.getZoom() < label.text.length * label.size * 0.6) return null;
   const point = map.latLngToContainerPoint(label.latlng);
   if (point.x < 0 || point.y < 0 || point.x > size.x || point.y > size.y) return null;

package/src/vector-tiles/vectorLabelIcon.js

@@ -5,7 +5,7 @@ import { wrapVectorLabel } from './wrapVectorLabel.js';
 export function vectorLabelIcon(label, sheet) {
   if (label.icon) return vectorSpriteIcon(label, sheet);
   const svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
-  const lines = label.along ? [label.text] : wrapVectorLabel(label.text);
+  const lines = label.along ? /* alloc */ [label.text] : wrapVectorLabel(label.text);
   let longest = 0, line, key, text, index;
   for (line of lines) longest = Math.max(longest, Array.from(line).length);
   const width = Math.max(40, longest * label.size * 0.65 + 12);

package/src/vector-tiles/vectorLabelText.js

@@ -0,0 +1,10 @@
+import { evaluateStyle } from '../vector-style/evaluateStyle.js';
+import { vectorLabelProperty } from './vectorLabelProperty.js';
+
+export function vectorLabelText(entry, properties, zoom) {
+  let text = entry.layout?.['text-field'];
+  if (Array.isArray(text)) text = evaluateStyle(text, properties, zoom);
+  if (typeof text !== 'string') text = '';
+  text = text.replace(/\{([^}]+)\}/g, vectorLabelProperty.bind(null, properties));
+  return entry.layout?.['text-transform'] === 'uppercase' ? text.toUpperCase() : text;
+}

package/src/walk/initWalk.js

@@ -2,6 +2,7 @@ import { L } from '../globals/L.js';
 import { initialize } from './initializeWalkControl.js';
 import { onAdd } from './onAddWalkControl.js';
 import { onRemove } from './onRemoveWalkControl.js';
+import { extendLeafletClass } from '../core/extendLeafletClass.js';
 
 /**
  * Third-person walk mode, toggled by a map button (and Esc): a pedestrian at the map centre runs with W/S (or ↑/↓) and
@@ -11,9 +12,21 @@ import { onRemove } from './onRemoveWalkControl.js';
  * Options: `speed` (m/s, default 70), `distance` (camera distance in metres, default 20), `position` (button corner, default 'bottomright').
  * Buildings, trees, models, streetlights and traffic block movement; the walker is moved out of newly loaded obstacles.
  */
-L.Control.Walk = L.Control.extend({
-  options: { position: 'bottomright', speed: 70, distance: 20 },
-  initialize,
-  onAdd,
-  onRemove,
-});
+class WalkControl extends extendLeafletClass(L.Control) {
+  static initHooks = true;
+  static defaultOptions = { position: 'bottomright', speed: 70, distance: 20 };
+
+  constructor(options) {
+    super(options);
+    if (L.version.startsWith('2.')) {
+      initialize.call(this, options);
+      this.callInitHooks();
+    }
+  }
+}
+Object.assign(WalkControl.prototype, { onAdd, onRemove });
+if (L.version.startsWith('1.')) {
+  WalkControl.prototype.options = Object.assign(Object.create(L.Control.prototype.options), WalkControl.defaultOptions);
+  WalkControl.prototype.initialize = initialize;
+}
+L.Control.Walk = WalkControl;

package/src/weakmaps/pathProjectionByMap.js

@@ -0,0 +1 @@
+export const pathProjectionByMap = new WeakMap();

package/src/workers/cogWorker.js

@@ -4,12 +4,11 @@ import { workerCogSource } from '../globals/workerCogSource.js';
 export async function onCogMessage({ data }) {
   try {
     const key = JSON.stringify(/* alloc */ [data.url, data.asset]);
-    // ponytail: one cached COG per worker; use a bounded per-source cache if interleaved archives cause churn.
-    if (workerCogSource.key !== key) {
-      workerCogSource.key = key;
-      workerCogSource.archive = openCog(data.url, data.asset);
+    if (!workerCogSource.has(key)) {
+      workerCogSource.set(key, openCog(data.url, data.asset));
+      if (workerCogSource.size > 4) workerCogSource.delete(workerCogSource.keys().next().value);
     }
-    const archive = await workerCogSource.archive;
+    const archive = await workerCogSource.get(key);
     const result = data.z === undefined ? await archive.getHeader() : await archive.getZxy(data.z, data.x, data.y);
     const transfers = /* alloc */ [];
     if (result?.data) transfers.push(result.data);

package/src/globals/layerCallInitHooks.js

@@ -1 +0,0 @@
-export const layerCallInitHooks = { value: undefined };