leaflet-city-mapper 0.0.3 → 0.0.4

package/src/archives/findTile.js

@@ -0,0 +1,31 @@
+import { getDirectoryEntries } from './getDirectoryEntries.js';
+import { findDirectoryEntry } from './findDirectoryEntry.js';
+import { getTileData } from './getTileData.js';
+
+export async function findTile(backend, header, id, signal) {
+  let offset = header.rootDirectoryOffset, length = header.rootDirectoryLength;
+  let firstOffset = -1, secondOffset = -1, thirdOffset = -1;
+  let depth, entries, entry, tile;
+  for (depth = 0; depth < 4; depth++) {
+    if (offset === firstOffset || offset === secondOffset || offset === thirdOffset) {
+      throw /* alloc */ new Error('Cyclic PMTiles directory');
+    }
+    if (depth === 0) firstOffset = offset;
+    else if (depth === 1) secondOffset = offset;
+    else if (depth === 2) thirdOffset = offset;
+    entries = await getDirectoryEntries(backend, offset, length, header.internalCompression);
+    signal?.throwIfAborted();
+    entry = findDirectoryEntry(entries, id);
+    if (!entry) return;
+    if (entry.runLength) {
+      tile = await getTileData(backend, header, entry, id, signal);
+      return tile;
+    }
+    if (entry.offset + entry.length > header.leafDirectoryLength) {
+      throw /* alloc */ new Error('PMTiles directory outside leaf section');
+    }
+    offset = header.leafDirectoryOffset + entry.offset;
+    length = entry.length;
+  }
+  throw /* alloc */ new Error('PMTiles directory depth exceeds four levels');
+}

package/src/archives/getDirectoryEntries.js

@@ -0,0 +1,18 @@
+import { sceneByLayer } from '../globals/sceneByLayer.js';
+import { loadDirectory } from './loadDirectory.js';
+
+export async function getDirectoryEntries(backend, offset, length, compression) {
+  const directories = sceneByLayer.get(backend)._directories;
+  const key = `${offset}:${length}`;
+  if (!directories.has(key)) {
+    if (directories.size >= 32) directories.delete(directories.keys().next().value);
+    directories.set(key, loadDirectory(backend, offset, length, compression));
+  }
+  const pending = directories.get(key);
+  try {
+    return await pending;
+  } catch (error) {
+    if (directories.get(key) === pending) directories.delete(key);
+    throw error;
+  }
+}

package/src/archives/getHeader.js

@@ -1,9 +1,13 @@
+import { sceneByLayer } from '../globals/sceneByLayer.js';
+
+
 import { decodeHeader } from './decodeHeader.js';
 import { read } from './read.js';
 
 /** Cache header initialization; failures remain visible to all callers. */
 
-export function getHeader(backend) {
-  if (backend.options.archive && backend.options.archive !== backend) return backend.options.archive.getHeader();
-  return backend._header ||= read(backend, 0, 127).then(decodeHeader);
+export function getHeader(layer) {
+  if (!sceneByLayer.has(layer)) return layer.getHeader();
+  if (layer.options.archive && layer.options.archive !== layer) return getHeader(layer.options.archive);
+  return sceneByLayer.get(layer)._header ||= read(layer, 0, 127).then(decodeHeader);
 }

package/src/archives/getTileData.js

@@ -0,0 +1,13 @@
+import { decompress } from './decompress.js';
+import { read } from './read.js';
+
+export async function getTileData(backend, header, entry, id, signal) {
+  if (id - entry.tileId >= entry.runLength) return;
+  if (entry.offset + entry.length > header.tileDataLength) {
+    throw /* alloc */ new Error('PMTiles tile outside data section');
+  }
+  const data = await decompress(await read(backend, header.tileDataOffset + entry.offset, entry.length, signal),
+    header.tileCompression);
+  signal?.throwIfAborted();
+  return /* alloc */ { data };
+}

package/src/archives/getZxy.js

@@ -1,75 +1,19 @@
-import { loadDirectory } from './loadDirectory.js';
-import { decompress } from './decompress.js';
+import { sceneByLayer } from '../globals/sceneByLayer.js';
 import { tileId } from './tileId.js';
-import { read } from './read.js';
 import { getHeader } from './getHeader.js';
+import { findTile } from './findTile.js';
 
 /** Nearest directory entry at/before the Hilbert ID, then follow leaf pointers. */
 
 export async function getZxy(backend, z, x, y, signal) {
-  if (backend.options.archive && backend.options.archive !== backend && backend.options.archive.getZxy) {
-    return backend.options.archive.getZxy(z, x, y, signal);
+  if (!sceneByLayer.has(backend)) return backend.getZxy(z, x, y, signal);
+  if (backend.options.archive && backend.options.archive !== backend) {
+    return getZxy(backend.options.archive, z, x, y, signal);
   }
   const id = tileId(z, x, y);
   signal?.throwIfAborted();
   const header = await getHeader(backend);
   signal?.throwIfAborted();
-  if (z < header.minZoom || z > header.maxZoom) {
-    return;
-  }
-  let offset = header.rootDirectoryOffset, length = header.rootDirectoryLength;
-  const visited = new Set();
-  let depth, key, pending, entries, low, high, mid, entry, data;
-  for (depth = 0; depth < 4; depth++) {
-    if (visited.has(offset)) {
-      throw new Error('Cyclic PMTiles directory');
-    }
-    visited.add(offset);
-    key = `${offset}:${length}`;
-    if (!backend._directories.has(key)) {
-      if (backend._directories.size >= 32) {
-        backend._directories.delete(backend._directories.keys().next().value);
-      }
-      backend._directories.set(key, loadDirectory(backend, offset, length, header.internalCompression));
-    }
-    pending = backend._directories.get(key);
-    entries = void 0;
-    try {
-      entries = await pending;
-    } catch (error) {
-      if (backend._directories.get(key) === pending) backend._directories.delete(key);
-      throw error;
-    }
-    signal?.throwIfAborted();
-    low = 0, high = entries.length - 1;
-    while (low <= high) {
-      mid = (low + high) >> 1;
-      if (entries[mid].tileId <= id) {
-        low = mid + 1;
-      } else {
-        high = mid - 1;
-      }
-    }
-    entry = entries[high];
-    if (!entry) {
-      return;
-    }
-    if (entry.runLength) {
-      if (id - entry.tileId >= entry.runLength) {
-        return;
-      }
-      if (entry.offset + entry.length > header.tileDataLength) {
-        throw new Error('PMTiles tile outside data section');
-      }
-      data = await decompress(await read(backend, header.tileDataOffset + entry.offset, entry.length, signal), header.tileCompression);
-      signal?.throwIfAborted();
-      return { data };
-    }
-    if (entry.offset + entry.length > header.leafDirectoryLength) {
-      throw new Error('PMTiles directory outside leaf section');
-    }
-    offset = header.leafDirectoryOffset + entry.offset;
-    length = entry.length;
-  }
-  throw new Error('PMTiles directory depth exceeds four levels');
+  if (z < header.minZoom || z > header.maxZoom) return;
+  return findTile(backend, header, id, signal);
 }

package/src/archives/loadSource.js

@@ -1,17 +1,31 @@
+import { sceneByLayer } from '../globals/sceneByLayer.js';
+import { archiveDecoder } from '../globals/archiveDecoder.js';
+
 import { getZxy } from './getZxy.js';
 
-export async function loadSource(backend, area) {
-  if (backend._geojson) {
-    const { data, url } = backend.options;
-    if (data !== undefined && url) throw new Error('GeoJSON source requires either data or url');
+
+export async function loadSource(layer, area) {
+  if (sceneByLayer.get(layer)._geojson) {
+    const { data, url } = layer.options;
+    if (data !== undefined && url) {
+      throw /* alloc */ new Error('GeoJSON source requires either data or url');
+    }
     if (data !== undefined) return data;
-    if (!url) throw new Error('GeoJSON source requires either data or url');
-    const response = await fetch(new URL(url, document.baseURI), { signal: area.request.signal });
-    if (!response.ok) throw new Error(`Unable to load GeoJSON: HTTP ${response.status}`);
+    if (!url) {
+      throw /* alloc */ new Error('GeoJSON source requires either data or url');
+    }
+    const sourceUrl = /* alloc */ new URL(url, document.baseURI);
+    const response = await fetch(sourceUrl, /* alloc */ { signal: area.request.signal });
+    if (!response.ok) {
+      throw /* alloc */ new Error(`Unable to load GeoJSON: HTTP ${response.status}`);
+    }
     return response.json();
   }
-  const result = await getZxy(backend, area.coords.z, area.coords.x, area.coords.y, area.request.signal);
+  const result = await getZxy(layer, area.coords.z, area.coords.x, area.coords.y, area.request.signal);
   return result
-    ? JSON.parse(new TextDecoder().decode(result.data))
-    : { type: 'FeatureCollection', features: [] };
+    ? JSON.parse(archiveDecoder.decode(result.data))
+    : /* alloc */ {
+      type: 'FeatureCollection',
+      features: /* alloc */ [],
+    };
 }

package/src/archives/read.js

@@ -1,29 +1,32 @@
+import { sceneByLayer } from '../globals/sceneByLayer.js';
+
+
 export async function read(backend, offset, length, signal) {
   signal?.throwIfAborted();
   if (!Number.isSafeInteger(offset) || !Number.isSafeInteger(length) ||
     offset < 0 || length <= 0 || !Number.isSafeInteger(offset + length)) {
-    throw new Error('Invalid PMTiles byte range');
+    throw /* alloc */ new Error('Invalid PMTiles byte range');
   }
-  const response = await fetch(backend.url, {
-    headers: { Range: `bytes=${offset}-${offset + length - 1}` }, signal,
+  const response = await fetch(sceneByLayer.get(backend).url, /* alloc */ {
+    headers: /* alloc */ { Range: `bytes=${offset}-${offset + length - 1}` }, signal,
   });
   if (!response.ok) {
-    throw new Error(`Unable to read PMTiles: HTTP ${response.status}`);
+    throw /* alloc */ new Error(`Unable to read PMTiles: HTTP ${response.status}`);
   }
   const etag = response.headers.get('ETag');
-  if (backend._etag && etag !== backend._etag) {
-    throw new Error('PMTiles archive changed; recreate the layer');
+  if (sceneByLayer.get(backend)._etag && etag !== sceneByLayer.get(backend)._etag) {
+    throw /* alloc */ new Error('PMTiles archive changed; recreate the layer');
   }
-  if (etag) backend._etag = etag;
+  if (etag) sceneByLayer.get(backend)._etag = etag;
   let data = await response.arrayBuffer();
   if (response.status === 200) {
     data = data.slice(offset, offset + length);
   } else if (response.status !== 206 ||
     !response.headers.get('Content-Range')?.startsWith(`bytes ${offset}-${offset + length - 1}/`)) {
-    throw new Error('Invalid PMTiles range response');
+    throw /* alloc */ new Error('Invalid PMTiles range response');
   }
   if (data.byteLength !== length) {
-    throw new Error('Truncated PMTiles range');
+    throw /* alloc */ new Error('Truncated PMTiles range');
   }
   return data;
 }

package/src/archives/tileId.js

@@ -2,17 +2,21 @@
 
 export function tileId(z, x, y) {
   if (!Number.isInteger(z) || !Number.isInteger(x) || !Number.isInteger(y) || z < 0 || z > 26 ||
-    x < 0 || y < 0 || x >= 2 ** z || y >= 2 ** z) throw new Error('Invalid PMTiles tile coordinates');
+    x < 0 || y < 0 || x >= 2 ** z || y >= 2 ** z) {
+    throw /* alloc */ new Error('Invalid PMTiles tile coordinates');
+  }
   let id = (4 ** z - 1) / 3;
   const n = 2 ** z;
   // Same cumulative Hilbert ordering used by build/pmtiles.js.
-  let s, rx, ry;
+  let s, rx, ry, swap;
   for (s = n / 2; s >= 1; s /= 2) {
     rx = (x & s) ? 1 : 0, ry = (y & s) ? 1 : 0;
     id += s * s * ((3 * rx) ^ ry);
     if (!ry) {
       if (rx) { x = n - 1 - x; y = n - 1 - y; }
-      [x, y] = [y, x];
+      swap = x;
+      x = y;
+      y = swap;
     }
   }
   return id;

package/src/archives/varint.js

@@ -5,11 +5,15 @@ export function varint(reader) {
   let value = 0;
   let factor, byte;
   for (factor = 1; factor <= 2 ** 49; factor *= 128) {
-    if (reader.cursor >= bytes.length) throw new Error('Truncated PMTiles directory');
+    if (reader.cursor >= bytes.length) {
+      throw /* alloc */ new Error('Truncated PMTiles directory');
+    }
     byte = bytes[reader.cursor++];
     value += (byte & 127) * factor;
-    if (!Number.isSafeInteger(value)) throw new Error('Invalid PMTiles directory integer');
+    if (!Number.isSafeInteger(value)) {
+      throw /* alloc */ new Error('Invalid PMTiles directory integer');
+    }
     if (byte < 128) return value;
   }
-  throw new Error('Invalid PMTiles directory integer');
+  throw /* alloc */ new Error('Invalid PMTiles directory integer');
 }

package/src/camera/angles.js

@@ -1,6 +1,14 @@
-import { mapCameraState } from '../constants/mapCameraState.js';
+import { radians } from '../globals/radians.js';
 
-export function angles(map) {
-  const bearing = map.getBearing() * mapCameraState.radians, pitch = map.getPitch() * mapCameraState.radians;
-  return [Math.cos(bearing), Math.sin(bearing), Math.cos(pitch), Math.sin(pitch)];
+import { mapGetBearing } from './mapGetBearing.js';
+import { mapGetPitch } from './mapGetPitch.js';
+
+export function angles(map, target) {
+  const bearing = mapGetBearing(map) * radians, pitch = mapGetPitch(map) * radians;
+  target ||= /* alloc */ [];
+  target[0] = Math.cos(bearing);
+  target[1] = Math.sin(bearing);
+  target[2] = Math.cos(pitch);
+  target[3] = Math.sin(pitch);
+  return target;
 }

package/src/camera/animationPoint.js

@@ -1,5 +1,8 @@
+import { cameraByMap } from '../globals/cameraByMap.js';
+
+
 export function animationPoint(map, point, inverse = false) {
-  const view = map._cameraView;
+  const view = cameraByMap.get(map)._cameraView;
   if (!view) return point;
   const half = map.getSize().divideBy(2), scale = map.getZoomScale(view.zoom);
   const shift = map.project(map.getCenter(), view.zoom).subtract(map.project(view.center, view.zoom));

package/src/camera/cameraMapReady.js

@@ -1,8 +1,11 @@
+import { cameraByMap } from '../globals/cameraByMap.js';
+
+
 import { adjustCameraDrag } from '../controls/adjustCameraDrag.js';
 
 export function cameraMapReady() {
   const draggable = this.dragging?._draggable;
   if (!draggable) return;
-  this._cameraDraggable = draggable;
+  cameraByMap.get(this)._cameraDraggable = draggable;
   draggable.on('predrag', adjustCameraDrag, this);
 }

package/src/camera/cancelCameraAnimation.js

@@ -1,11 +1,15 @@
-import { mapCameraState } from '../constants/mapCameraState.js';
+import { cameraAnimations } from '../globals/cameraAnimations.js';
+import { cameraByMap } from '../globals/cameraByMap.js';
+import { cameraAnimationFrame } from '../globals/cameraAnimationFrame.js';
+
+
 
 export function cancelCameraAnimation(map) {
-  mapCameraState.cameraAnimations.delete(map);
-  map._cameraAnimation = null;
-  map._cameraFrame = null;
-  if (!mapCameraState.cameraAnimations.size && mapCameraState.cameraAnimationFrame !== null) {
-    cancelAnimationFrame(mapCameraState.cameraAnimationFrame);
-    mapCameraState.cameraAnimationFrame = null;
+  cameraAnimations.delete(map);
+  cameraByMap.get(map)._cameraAnimation = null;
+  cameraByMap.get(map)._cameraFrame = null;
+  if (!cameraAnimations.size && cameraAnimationFrame.value !== null) {
+    cancelAnimationFrame(cameraAnimationFrame.value);
+    cameraAnimationFrame.value = null;
   }
 }

package/src/camera/cleanupCameraMap.js

@@ -1,11 +1,14 @@
+import { cameraByMap } from '../globals/cameraByMap.js';
+
+
 import { cancelCameraAnimation } from './cancelCameraAnimation.js';
 import { adjustCameraDrag } from '../controls/adjustCameraDrag.js';
 
 export function cleanupCameraMap() {
   cancelCameraAnimation(this);
-  this._pitchSky?.remove();
-  if (this._cameraDraggable) {
-    this._cameraDraggable.off('predrag', adjustCameraDrag, this);
-    delete this._cameraDraggable;
+  cameraByMap.get(this)._pitchSky?.remove();
+  if (cameraByMap.get(this)._cameraDraggable) {
+    cameraByMap.get(this)._cameraDraggable.off('predrag', adjustCameraDrag, this);
+    delete cameraByMap.get(this)._cameraDraggable;
   }
 }

package/src/camera/fitCameraBounds.js

@@ -1,34 +1,43 @@
+import { L } from '../globals/L.js';
+import { cameraEmptyOptions } from '../globals/cameraEmptyOptions.js';
+import { cameraZeroPadding } from '../globals/cameraZeroPadding.js';
+import { cameraAngles } from '../globals/cameraAngles.js';
 import { pointOf } from './pointOf.js';
 import { angles } from './angles.js';
 import { verticalGroundY } from './verticalGroundY.js';
 
-export function fitCameraBounds(map, bounds, options = {}) {
-  bounds = bounds.getBounds ? bounds.getBounds() : bounds instanceof L.LatLngBounds ? bounds : new L.LatLngBounds(bounds);
+
+export function fitCameraBounds(map, bounds, options = cameraEmptyOptions) {
+  bounds = bounds.getBounds ? bounds.getBounds() : bounds instanceof L.LatLngBounds ? bounds
+    : /* alloc */ new L.LatLngBounds(bounds);
   const zoom = map.getZoom() ?? 0, half = map.getSize().divideBy(2), distance = map.getSize().y * 1.5;
-  const min = pointOf(options.paddingTopLeft || options.padding || [0, 0]).subtract(half);
-  const max = half.subtract(pointOf(options.paddingBottomRight || options.padding || [0, 0]));
-  const [cos, sin, tilt, rise] = angles(map);
+  const min = pointOf(options.paddingTopLeft || options.padding || cameraZeroPadding).subtract(half);
+  const max = half.subtract(pointOf(options.paddingBottomRight || options.padding || cameraZeroPadding));
+  const [cos, sin, tilt, rise] = angles(map, cameraAngles);
+  if (tilt < 0) {
+    const y = min.y;
+    min.y = -max.y;
+    max.y = -y;
+  }
   const far = map.getSize().y * map.options.pitchMaxDistance;
-  const top = verticalGroundY(min.y, tilt, distance, rise, far);
-  const bottom = verticalGroundY(max.y, tilt, distance, rise, far);
+  const top = verticalGroundY(min.y, Math.abs(tilt), distance, rise, far);
+  const bottom = verticalGroundY(max.y, Math.abs(tilt), distance, rise, far);
   const origin = map.project(bounds.getNorthWest(), zoom).add(map.project(bounds.getSouthEast(), zoom)).divideBy(2);
-  const points = [];
-  let latlng, p, point;
-  for (latlng of [bounds.getNorthWest(), bounds.getNorthEast(), bounds.getSouthWest(), bounds.getSouthEast()]) {
-    p = map.project(latlng, zoom).subtract(origin);
-    points.push(new L.Point(cos * p.x - sin * p.y, sin * p.x + cos * p.y));
-  }
   let low = Infinity, high = -Infinity;
-  for (point of points) {
-    low = Math.min(low, point.y);
-    high = Math.max(high, point.y);
-  }
   const leftSlope = min.x * rise / distance, rightSlope = max.x * rise / distance;
   const slope = rightSlope - leftSlope;
   let left = Infinity, right = -Infinity;
-  for (point of points) {
-    left = Math.min(left, point.x + leftSlope * point.y);
-    right = Math.max(right, point.x + rightSlope * point.y);
+  const corners = /* alloc */ [bounds.getNorthWest(), bounds.getNorthEast(), bounds.getSouthWest(), bounds.getSouthEast()];
+  let i, latlng, p, x, y;
+  for (i = 0; i < 4; i++) {
+    latlng = corners[i];
+    p = map.project(latlng, zoom).subtract(origin);
+    x = cos * p.x - sin * p.y;
+    y = sin * p.x + cos * p.y;
+    low = Math.min(low, y);
+    high = Math.max(high, y);
+    left = Math.min(left, x + leftSlope * y);
+    right = Math.max(right, x + rightSlope * y);
   }
   // Perspective viewport edges are straight lines on the ground: fit all four corners, not their screen midpoint.
   const scale = Math.min((bottom - top) / (high - low),
@@ -37,12 +46,13 @@ export function fitCameraBounds(map, bounds, options = {}) {
   const snap = map.options.zoomSnap;
   if (snap) target = Math.floor(Math.round(target / (snap / 100)) / 100) * snap;
   target = Math.max(map.getMinZoom(), Math.min(map.getMaxZoom(), options.maxZoom ?? Infinity, target));
-  if (!Number.isFinite(target)) return { center: bounds.getCenter(), zoom: target };
+  if (!Number.isFinite(target)) return /* alloc */ { center: bounds.getCenter(), zoom: target };
   const actual = map.getZoomScale(target, zoom);
   const vMin = high * actual - bottom, vMax = low * actual - top;
   const v = Math.max(vMin, slope ? (actual * (right - left) - max.x + min.x) / slope : vMin);
   const centerY = (Math.min(vMax, v) + vMax) / 2;
   const centerX = (actual * (left + right) - min.x - max.x - (leftSlope + rightSlope) * centerY) / 2;
-  const center = origin.add(new L.Point(cos * centerX + sin * centerY, -sin * centerX + cos * centerY).divideBy(actual));
-  return { center: map.unproject(center, zoom), zoom: target };
+  origin.x += (cos * centerX + sin * centerY) / actual;
+  origin.y += (-sin * centerX + cos * centerY) / actual;
+  return /* alloc */ { center: map.unproject(origin, zoom), zoom: target };
 }

package/src/camera/getBearing.js

@@ -0,0 +1,5 @@
+import { mapGetBearing } from './mapGetBearing.js';
+
+export function getBearing() {
+  return mapGetBearing(this);
+}

package/src/camera/getPitch.js

@@ -0,0 +1,5 @@
+import { mapGetPitch } from './mapGetPitch.js';
+
+export function getPitch() {
+  return mapGetPitch(this);
+}

package/src/camera/groundBounds.js

@@ -1,11 +1,18 @@
+import { L } from '../globals/L.js';
+import { cameraZeroPadding } from '../globals/cameraZeroPadding.js';
 import { pointOf } from './pointOf.js';
 import { project } from './project.js';
 
-export function groundBounds(map, padding = [0, 0]) {
+
+export function groundBounds(map, padding = cameraZeroPadding) {
   const min = pointOf(padding).divideBy(2), max = map.getSize().subtract(min);
-  const corners = [[min.x, min.y], [max.x, min.y], [min.x, max.y], [max.x, max.y]];
-  const points = [];
-  let point;
-  for (point of corners) points.push(project(map, point, true, true));
-  return new L.Bounds(points);
+  const bounds = /* alloc */ new L.Bounds();
+  const minX = min.x, minY = min.y;
+  let i;
+  for (i = 0; i < 4; i++) {
+    min.x = i % 2 ? max.x : minX;
+    min.y = i < 2 ? minY : max.y;
+    bounds.extend(project(map, min, true, true));
+  }
+  return bounds;
 }

package/src/camera/initializeCameraMap.js

@@ -1,3 +1,7 @@
+import { cameraByMap } from '../globals/cameraByMap.js';
+
+import { mapSetPitchAndBearing } from './mapSetPitchAndBearing.js';
+
 import { updateSky } from './updateSky.js';
 import { constrainCameraToBounds } from './constrainCameraToBounds.js';
 import { cleanupCameraMap } from './cleanupCameraMap.js';
@@ -6,6 +10,7 @@ import { loadCameraControls } from '../controls/loadCameraControls.js';
 import { noOperation } from '../utils/noOperation.js';
 
 export function initializeCameraMap() {
+  cameraByMap.set(this, /* alloc */ {});
   if (!document.getElementById('leaflet-camera-zoom-style')) {
     const style = document.createElement('style');
     style.id = 'leaflet-camera-zoom-style';
@@ -13,13 +18,13 @@ export function initializeCameraMap() {
       '.leaflet-camera-zoom .leaflet-popup,.leaflet-camera-zoom .leaflet-tooltip{transition:none!important}';
     document.head.append(style);
   }
-  this._setPitchAndBearing(this.options.pitch, this.options.bearing);
+  mapSetPitchAndBearing(this, this.options.pitch, this.options.bearing);
   this.on('load resize pitch', updateSky);
   this.on('rotate pitch', constrainCameraToBounds, this);
   this.once('unload', cleanupCameraMap, this);
   this.whenReady(cameraMapReady, this);
   if (this.options.rotate || this.options.trackContainerMutation) {
-    this.cameraReady = loadCameraControls(this);
-    this.cameraReady.catch(noOperation);
+    cameraByMap.get(this).cameraReady = loadCameraControls(this);
+    cameraByMap.get(this).cameraReady.catch(noOperation);
   }
 }

package/src/camera/mapAnimateCamera.js

@@ -1,17 +1,24 @@
+import { cameraEmptyOptions } from '../globals/cameraEmptyOptions.js';
+import { cameraByMap } from '../globals/cameraByMap.js';
+import { mapSetPitchAndBearing } from './mapSetPitchAndBearing.js';
+import { mapGetPitch } from './mapGetPitch.js';
+import { mapGetBearing } from './mapGetBearing.js';
+
 import { cancelCameraAnimation } from './cancelCameraAnimation.js';
 import { scheduleCameraAnimation } from './scheduleCameraAnimation.js';
 
-export function mapAnimateCamera(pitch, bearing, options = {}) {
-  cancelCameraAnimation(this);
-  if (!Number.isFinite(pitch) || !Number.isFinite(bearing)) throw new TypeError('Camera angles must be finite numbers');
-  if (!options.animate || matchMedia('(prefers-reduced-motion: reduce)').matches) {
-    return this._setPitchAndBearing(pitch, bearing);
-  }
-  const duration = options.duration ?? 0.3;
-  if (!Number.isFinite(duration) || duration < 0) throw new TypeError('Camera duration must be nonnegative');
-  const start = performance.now(), fromPitch = this.getPitch(), fromBearing = this.getBearing();
-  const delta = ((bearing - fromBearing) % 360 + 540) % 360 - 180;
-  const animation = this._cameraAnimation = { duration, start, fromPitch, fromBearing, pitch, delta };
-  scheduleCameraAnimation(this, animation);
-  return this;
+
+export function mapAnimateCamera(map, pitch, bearing, options = cameraEmptyOptions) {
+  cancelCameraAnimation(map);
+  if (!Number.isFinite(pitch) || !Number.isFinite(bearing)) throw /* alloc */ new TypeError('Camera angles must be finite numbers');
+  if (!options.animate || matchMedia('(prefers-reduced-motion: reduce)').matches) {
+    return mapSetPitchAndBearing(map, pitch, bearing);
+  }
+  const duration = options.duration ?? 0.3;
+  if (!Number.isFinite(duration) || duration < 0) throw /* alloc */ new TypeError('Camera duration must be nonnegative');
+  const start = performance.now(), fromPitch = mapGetPitch(map), fromBearing = mapGetBearing(map);
+  const delta = ((bearing - fromBearing) % 360 + 540) % 360 - 180;
+  const animation = cameraByMap.get(map)._cameraAnimation = /* alloc */ { duration, start, fromPitch, fromBearing, pitch, delta };
+  scheduleCameraAnimation(map, animation);
+  return map;
 }