isard 1.1.0 → 1.2.0

package/dist/basemap/vectortiles.js

@@ -13,11 +13,12 @@ import { assetUrl } from "../engine-loader.js";
 import { IGN_ATTRIBUTION } from "../geoplateforme.js";
 import { loadSprites, readPixels } from "../layers/icons.js";
 import { mercatorX, mercatorY } from "../util/geo.js";
+import { isRecord } from "../util/guards.js";
 import { Lru } from "../util/lru.js";
 import { OPENFREEMAP_ATTRIBUTION } from "./basemaps.js";
 import { pmtiles, pmtilesUrl } from "./pmtiles.js";
 import { SOURCE_CACHE } from "./resample.js";
-import { labelFont, } from "./vectorstyle.js";
+import { isStyle, labelFont, } from "./vectorstyle.js";
 /** OpenFreeMap's styles: OpenStreetMap data in the OpenMapTiles schema, worldwide, free and without a key */
 export const OPENFREEMAP_STYLES = {
     positron: 'https://tiles.openfreemap.org/styles/positron',
@@ -38,43 +39,75 @@ export const VECTOR_BASEMAPS = {
     'ign-plan-grey-vector': PLAN_STYLES.grey,
 };
 /** The credits of a known style: OpenFreeMap's, PLAN.IGN's */
-export function styleAttribution(style) {
+export const styleAttribution = (style) => {
     if (typeof style !== 'string')
         return undefined;
-    if (Object.values(OPENFREEMAP_STYLES).includes(style))
+    if (Object.values(OPENFREEMAP_STYLES).some((s) => s === style))
         return OPENFREEMAP_ATTRIBUTION;
-    if (Object.values(PLAN_STYLES).includes(style))
+    if (Object.values(PLAN_STYLES).some((s) => s === style))
         return IGN_ATTRIBUTION;
     return undefined;
-}
+};
 /** Text or icon size of a style (a number, legacy stops, or the stops of a zoom expression made by the worker) as a
  * size for the symbol layer */
-export function size(value, fallback = 16) {
+export const size = (value, fallback = 16) => {
+    const stop = (s) => {
+        const [z, v] = Array.isArray(s) ? s : [];
+        return [Number(z), Number(v)];
+    };
     if (typeof value === 'number')
         return value;
-    if (Array.isArray(value) && value.length > 0 && value.every(Array.isArray)) {
-        return value.map((s) => [Number(s[0]), Number(s[1])]);
-    }
-    if (value && typeof value === 'object' && !Array.isArray(value) && Array.isArray(value.stops)) {
-        return value.stops.map((s) => {
-            const [z, v] = s;
-            return [Number(z), Number(v)];
-        });
-    }
+    if (Array.isArray(value) && value.length > 0 && value.every(Array.isArray))
+        return value.map(stop);
+    if (isRecord(value) && Array.isArray(value.stops))
+        return value.stops.map(stop);
     return fallback;
-}
+};
+/** The anchors of the symbol layer */
+const ANCHORS = new Set([
+    'center',
+    'top',
+    'bottom',
+    'left',
+    'right',
+    'top-left',
+    'top-right',
+    'bottom-left',
+    'bottom-right',
+]);
+const isAnchor = (value) => value !== undefined && ANCHORS.has(value);
+/** A style's anchor (`text-anchor`, `icon-anchor`) for the symbol layer: `center` if it is none */
+const anchor = (value) => (isAnchor(value) ? value : 'center');
 /** Fetches a JSON document (a style, a TileJSON) */
-async function json(url) {
+const json = async (url) => {
     const response = await fetch(url, withHeaders(url));
     if (!response.ok)
         throw new Error(`${url}: ${response.status}`);
-    return (await response.json());
-}
+    return response.json();
+};
+/** A style fetched: a MapLibre style, or an error */
+const fetchStyle = async (url) => {
+    const style = await json(url);
+    if (!isStyle(style))
+        throw new Error(`${url}: not a MapLibre style`);
+    return style;
+};
+const isTileJson = (value) => isRecord(value) &&
+    Array.isArray(value.tiles) &&
+    value.tiles.every((t) => typeof t === 'string') &&
+    (value.maxzoom === undefined || typeof value.maxzoom === 'number');
+/** A TileJSON fetched, or an error */
+const fetchTileJson = async (url) => {
+    const tilejson = await json(url);
+    if (!isTileJson(tilejson))
+        throw new Error(`${url}: not a TileJSON`);
+    return tilejson;
+};
 /**
  * A style source's tiles and deepest level: a `pmtiles://` archive (its `url`, or a `tiles` template) read for its
  * header, its tiles then named `pmtiles://<absolute archive URL>/{z}/{x}/{y}` for the workers; other sources as they are
  */
-async function resolveSource(source) {
+const resolveSource = async (source) => {
     const given = source.url ?? source.tiles?.[0] ?? '';
     const archive = pmtilesUrl(given.replace(/\/\{z\}\/\{x\}\/\{y\}$/, ''));
     if (!archive)
@@ -84,20 +117,20 @@ async function resolveSource(source) {
         };
     const header = await pmtiles(archive).header();
     return { tiles: [`pmtiles://${archive}/{z}/{x}/{y}`], maxzoom: source.maxzoom ?? header.maxZoom };
-}
+};
 /** Pause before the labels of tiles that failed are asked for again, when no move brings an update (ms) */
 const RETRY_LABELS_MS = 3000;
 /** Default size of a basemap worker pool: cores - 1, 1 to 4 */
-export function defaultWorkerCount() {
+export const defaultWorkerCount = () => {
     return Math.min(4, Math.max(1, (typeof navigator !== 'undefined' ? navigator.hardwareConcurrency || 2 : 2) - 1));
-}
+};
 /** Default URL of the basemap worker: in the page's assets folder (`isard/vite`), else next to the module */
-export function defaultWorkerUrl(assetsUrl) {
+export const defaultWorkerUrl = (assetsUrl) => {
     return assetUrl('basemap.worker.js', undefined, assetsUrl);
-}
+};
 /** Fetch priority of a raster tile drawn by the workers: 'high' near the center of the view, at the current zoom or
  * coarser; 'low' far from it or finer (prefetch); 'auto' between */
-export function tilePriority(z, x, y, camera) {
+export const tilePriority = (z, x, y, camera) => {
     // A raster tile of level z covers the map at zoom z - 1
     if (z - 1 > camera.zoom + 1)
         return 'low';
@@ -106,22 +139,22 @@ export function tilePriority(z, x, y, camera) {
     const cx = mercatorX(lon) * n;
     const cy = mercatorY(lat) * n;
     // Across the antimeridian, the short way
-    let dx = Math.abs(x + 0.5 - cx) % n;
-    dx = Math.min(dx, n - dx);
+    const along = Math.abs(x + 0.5 - cx) % n;
+    const dx = Math.min(along, n - along);
     const d = Math.hypot(dx, y + 0.5 - cy);
     if (d <= 1.5)
         return 'high';
     return d >= 4 ? 'low' : 'auto';
-}
+};
 /** The worker of a vector tile among `count`: always the same one */
-export function workerIndex(vz, vx, vy, count) {
+export const workerIndex = (vz, vx, vy, count) => {
     // Unsigned: every worker gets its share
     return ((Math.imul(vx, 73856093) ^ Math.imul(vy, 19349663) ^ vz) >>> 0) % Math.max(1, count);
-}
+};
 /** The worker-side key of a renderer: unique across the `VectorTiles` sharing a pool */
-export function rendererKey(namespace, n) {
+export const rendererKey = (namespace, n) => {
     return `${namespace}:r${n}`;
-}
+};
 /**
  * @internal Workers drawing vector tiles, shared by the `VectorTiles` of a map: each vector tile always goes to the
  * same worker, which keeps it decoded for every style drawn from it. Requests are tracked one by one, with their
@@ -140,7 +173,7 @@ export class BasemapWorkers {
     constructor(count, url, create = (u) => new Worker(u, { type: 'module' })) {
         this.count = count;
         this.url = url;
-        this.workers = Array.from({ length: Math.max(1, count) }, () => {
+        const start = () => {
             const worker = create(url);
             worker.onmessage = ({ data }) => {
                 const p = this.pending.get(data.id);
@@ -162,10 +195,12 @@ export class BasemapWorkers {
             if (rules.length > 0)
                 worker.postMessage({ type: 'headers', rules });
             return worker;
-        });
+        };
+        this.workers = [start(), ...Array.from({ length: Math.max(1, count) - 1 }, start)];
         this.unfollow = onHeaderRules((rules) => {
-            for (const w of this.workers)
+            this.workers.forEach((w) => {
                 w.postMessage({ type: 'headers', rules });
+            });
         });
     }
     /** A prefix for the renderer keys of one `VectorTiles` */
@@ -179,12 +214,12 @@ export class BasemapWorkers {
     /** Rejects the requests of a failed worker */
     fail(worker, message) {
         const error = new Error(`isard: ${message}. If a bundler moves the worker, give its URL in the \`basemapWorkerUrl\` option (see "With a bundler" in the guide)`);
-        for (const [id, p] of this.pending) {
+        this.pending.forEach((p, id) => {
             if (p.worker !== worker)
-                continue;
+                return;
             this.pending.delete(id);
             p.reject(error);
-        }
+        });
     }
     /** The worker of a vector tile */
     worker(vz, vx, vy) {
@@ -197,8 +232,9 @@ export class BasemapWorkers {
         // A renderer tells the workers how many they are: they share the decoded tiles' budget
         const sent = message.type === 'init' ? { ...message, workers: this.workers.length } : message;
         // A sprite image is copied to each worker (structured clone)
-        for (const w of this.workers)
+        this.workers.forEach((w) => {
             w.postMessage(sent);
+        });
     }
     /** Asks a worker for a tile's image or labels, on behalf of `owner` */
     request(worker, work, owner, signal) {
@@ -247,13 +283,13 @@ export class BasemapWorkers {
     }
     /** Cancels the requests of an owner (the workers stop them) */
     cancel(owner) {
-        for (const [id, p] of this.pending) {
+        this.pending.forEach((p, id) => {
             if (p.owner !== owner)
-                continue;
+                return;
             this.pending.delete(id);
             p.worker.postMessage({ type: 'abort', id });
             p.reject(new DOMException('isard: vector tiles destroyed', 'AbortError'));
-        }
+        });
     }
     /** Stops the workers; their requests fail */
     terminate() {
@@ -261,18 +297,20 @@ export class BasemapWorkers {
             return;
         this.terminated = true;
         this.unfollow();
-        for (const w of this.workers)
+        this.workers.forEach((w) => {
             w.terminate();
+        });
         const pending = [...this.pending.values()];
         this.pending.clear();
-        for (const p of pending)
+        pending.forEach((p) => {
             p.reject(new DOMException('isard: vector tiles destroyed', 'AbortError'));
+        });
     }
 }
 /** A tile's label candidates as features, by style layer */
-export function tileLabels(candidates) {
+export const tileLabels = (candidates) => {
     const byLayer = new Map();
-    for (const p of candidates) {
+    candidates.forEach((p) => {
         const feature = {
             type: 'Feature',
             properties: p,
@@ -291,9 +329,9 @@ export function tileLabels(candidates) {
             list.push(feature);
         else
             byLayer.set(p.layer, [feature]);
-    }
+    });
     return [...byLayer].sort((a, b) => b[0] - a[0]);
-}
+};
 export class VectorTiles {
     map;
     pool;
@@ -334,16 +372,14 @@ export class VectorTiles {
         });
     }
     async load(input) {
-        const style = typeof input === 'string' ? await json(input) : input;
+        const style = typeof input === 'string' ? await fetchStyle(input) : input;
         const [name, source] = Object.entries(style.sources).find(([, s]) => s.type === 'vector') ?? [];
         if (!name || !source)
             throw new Error('the style has no vector source');
-        let { tiles, maxzoom } = await resolveSource(source);
-        if (!tiles && source.url) {
-            const tilejson = await json(source.url);
-            tiles = tilejson.tiles;
-            maxzoom ??= tilejson.maxzoom;
-        }
+        const resolved = await resolveSource(source);
+        const tilejson = !resolved.tiles && source.url ? await fetchTileJson(source.url) : undefined;
+        const tiles = tilejson === undefined ? resolved.tiles : tilejson.tiles;
+        const maxzoom = resolved.maxzoom ?? tilejson?.maxzoom;
         const template = tiles?.[0];
         if (!template)
             throw new Error(`source ${name} has no tiles`);
@@ -367,11 +403,11 @@ export class VectorTiles {
     /** The fonts of the style's labels, for its glyphs (the first of each `text-font`, as the workers take it) */
     static fonts(style) {
         const fonts = new Set();
-        for (const layer of style.layers) {
+        style.layers.forEach((layer) => {
             const font = layer.layout?.['text-font'];
             if (layer.type === 'symbol' && Array.isArray(font) && typeof font[0] === 'string')
                 fonts.add(labelFont(font[0]));
-        }
+        });
         return [...fonts];
     }
     /** The style's sprites (their JSON and their images), loaded once, for the fill patterns and the icons */
@@ -453,7 +489,7 @@ export class VectorTiles {
             color: (p) => p.color,
             haloColor: (p) => p.haloColor,
             haloWidth: (p) => p.haloWidth,
-            anchor: (p) => p.anchor,
+            anchor: (p) => anchor(p.anchor),
             offset: (p) => p.offset,
             maxWidth: (p) => p.maxWidth,
             lineHeight: (p) => p.lineHeight,
@@ -462,7 +498,7 @@ export class VectorTiles {
             textOptional: (p) => p.textOptional === true,
             icon: (p) => (p.icon ? this.iconPrefix + p.icon.image : ''),
             iconSize: (p) => size(p.icon?.size ?? 1, 1),
-            iconAnchor: (p) => (p.icon?.anchor ?? 'center'),
+            iconAnchor: (p) => anchor(p.icon?.anchor),
             iconOffset: (p) => p.icon?.offset ?? [0, 0],
             iconRotate: (p) => p.icon?.rotate ?? 0,
             iconRotationAlignment: (p) => p.icon?.alignment ?? 'viewport',
@@ -482,10 +518,10 @@ export class VectorTiles {
             // Its icons from its sprites, before the first labels
             const icons = style.layers.some((l) => l.type === 'symbol' && l.layout?.['icon-image'] !== undefined);
             if (icons && style.sprite) {
-                for (const sprite of await this.loadSprites(style.sprite)) {
+                (await this.loadSprites(style.sprite)).forEach((sprite) => {
                     if (!this.destroyed)
                         this.map.icons.addSprite(this.iconPrefix, sprite.icons, () => readPixels(sprite.image));
-                }
+                });
             }
             return this.renderer((l) => l.type === 'symbol' && layers(l), []);
         });
@@ -510,18 +546,22 @@ export class VectorTiles {
             if (ground.length > 0) {
                 // The ground's tiles, the nearest first: a tile so many levels coarser than the finest in view has its
                 // labels of a zoom as many under the view's, past the source's deepest level those of that level at the zoom
-                let top = 0;
-                for (let i = 0; i < ground.length; i += 3)
-                    top = Math.max(top, ground[i]);
-                for (let i = 0; i < ground.length && keys.length < maxTiles; i += 3) {
-                    const [z, x, y] = [ground[i], ground[i + 1], ground[i + 2]];
+                const groundTiles = Array.from({ length: Math.ceil(ground.length / 3) }, (_, k) => [
+                    ground[3 * k] ?? 0,
+                    ground[3 * k + 1] ?? 0,
+                    ground[3 * k + 2] ?? 0,
+                ]);
+                const top = groundTiles.reduce((t, [z]) => Math.max(t, z), 0);
+                groundTiles.forEach(([z, x, y]) => {
+                    if (keys.length >= maxTiles)
+                        return;
                     const at = Math.max(0, zoom - (top - z));
                     const tz = Math.min(at, maxzoom, z);
                     const shift = 2 ** (z - tz);
                     const key = `${tz}/${Math.floor(x / shift)}/${Math.floor(y / shift)}${at > tz ? `@${at}` : ''}`;
                     if (!keys.includes(key))
                         keys.push(key);
-                }
+                });
             }
             else {
                 const z = Math.min(zoom, maxzoom);
@@ -541,26 +581,22 @@ export class VectorTiles {
                     Math.max(0, ty(north), Math.floor(cy) - reach),
                     Math.min(n - 1, ty(south), Math.floor(cy) + reach),
                 ];
-                const wanted = [];
-                for (let y = y0; y <= y1; y += 1)
-                    for (let x = x0; x <= x1; x += 1)
-                        wanted.push([x, y]);
+                const wanted = Array.from({ length: y1 - y0 + 1 }, (_, j) => y0 + j).flatMap((y) => Array.from({ length: x1 - x0 + 1 }, (_, i) => [x0 + i, y]));
                 // Nearest to the center first, at most `maxTiles` (tilted views reach far)
                 wanted.sort((a, b) => Math.hypot(a[0] + 0.5 - cx, a[1] + 0.5 - cy) - Math.hypot(b[0] + 0.5 - cx, b[1] + 0.5 - cy));
                 // Past the source's deepest level, its tiles' labels at the zoom of the view (the layers of the deeper zooms)
-                for (const [x, y] of wanted.slice(0, maxTiles))
-                    keys.push(`${z}/${x}/${y}${zoom > z ? `@${zoom}` : ''}`);
+                keys.push(...wanted.slice(0, maxTiles).map(([x, y]) => `${z}/${x}/${y}${zoom > z ? `@${zoom}` : ''}`));
             }
             // The same tiles as the labels shown: nothing to do
             const set = keys.join(' ');
             if (set === shown)
                 return;
             const lists = await Promise.all(keys.map((k, index) => {
-                let p = tiles.get(k);
-                if (p)
-                    return p;
+                const cached = tiles.get(k);
+                if (cached)
+                    return cached;
                 const [tile, deeper] = k.split('@');
-                const [tz, x, y] = (tile ?? '').split('/').map(Number);
+                const [tz = 0, x = 0, y = 0] = (tile ?? '').split('/').map(Number);
                 // The nearest tiles first: the others wait for the raster tiles
                 const priority = index < 4 ? 'auto' : 'low';
                 const work = {
@@ -572,7 +608,7 @@ export class VectorTiles {
                     priority,
                     ...(deeper === undefined ? {} : { zoom: Number(deeper) }),
                 };
-                p = this.request(tz, x, y, work).then((r) => tileLabels('labels' in r ? r.labels : []), () => {
+                const p = this.request(tz, x, y, work).then((r) => tileLabels('labels' in r ? r.labels : []), () => {
                     // A network error is not kept: the tile is asked for again on the next update
                     tiles.delete(k);
                     return [];
@@ -594,14 +630,7 @@ export class VectorTiles {
             // The labels of the higher style layers first: they win the collisions; for each style layer, the tiles nearest
             // to the center first
             const layerIds = [...new Set(lists.flatMap((list) => list.map(([layer]) => layer)))].sort((a, b) => b - a);
-            const groups = [];
-            for (const layer of layerIds) {
-                for (const list of lists) {
-                    const group = list.find(([l]) => l === layer)?.[1];
-                    if (group)
-                        groups.push(group);
-                }
-            }
+            const groups = layerIds.flatMap((layer) => lists.map((list) => list.find(([l]) => l === layer)?.[1]).filter((group) => group !== undefined));
             symbol.setGroups(groups);
         };
         // The style failed to load: reported by `ready`
@@ -629,19 +658,22 @@ export class VectorTiles {
         if (this.destroyed)
             return;
         this.destroyed = true;
-        for (const off of this.cleanup)
+        this.cleanup.forEach((off) => {
             off();
+        });
         this.cleanup.length = 0;
-        for (const layer of this.layers)
+        this.layers.forEach((layer) => {
             if (this.map.hasLayer(layer))
                 layer.remove();
+        });
         this.layers.length = 0;
         this.map.dropVectorTiles(this);
         // The page's copy of the sprites (the workers have theirs), and their icons
         this.sprites
             ?.then((sprites) => {
-            for (const sprite of sprites)
+            sprites.forEach((sprite) => {
                 sprite.image.close();
+            });
             this.map.icons.remove(this.iconPrefix, true);
         })
             .catch(() => undefined);
@@ -651,8 +683,9 @@ export class VectorTiles {
         else {
             // Shared workers: only its requests stop and its renderers go
             this.pool.cancel(this);
-            for (const key of this.renderers)
+            this.renderers.forEach((key) => {
                 this.pool.broadcast({ type: 'drop', key });
+            });
         }
         this.renderers.length = 0;
     }
@@ -665,10 +698,10 @@ const BASIC_COLORS = ['#2f6fd1', '#d1495b', '#2a9d8f', '#e9a03b', '#7b5ea7', '#5
  * layer, the `name` of points as labels. `source` is the style's vector source (`url`: TileJSON or `pmtiles://…`, or
  * `tiles`)
  */
-export function basicStyle(source, layers) {
+export const basicStyle = (source, layers) => {
     const out = [];
     layers.forEach((name, i) => {
-        const color = BASIC_COLORS[i % BASIC_COLORS.length];
+        const color = BASIC_COLORS[i % BASIC_COLORS.length] ?? '#2f6fd1';
         const base = { source: 'data', 'source-layer': name };
         out.push({ id: `${name}-fill`, type: 'fill', ...base, paint: { 'fill-color': color, 'fill-opacity': 0.18 } }, { id: `${name}-line`, type: 'line', ...base, paint: { 'line-color': color, 'line-width': 1.2 } }, {
             id: `${name}-circle`,
@@ -689,21 +722,24 @@ export function basicStyle(source, layers) {
         });
     });
     return { version: 8, sources: { data: { type: 'vector', ...source } }, layers: out };
-}
+};
 /** HTML of a file reduced to its text, escaped: credits from an archive's metadata cannot run in the page */
-function plainText(html) {
+const plainText = (html) => {
     return html
         .replace(/<[^>]*>/g, '')
         .replace(/&(?!(amp|lt|gt|quot|copy|#\d+);)/g, '&amp;')
         .replace(/</g, '&lt;')
         .replace(/>/g, '&gt;');
-}
+};
 /** @internal `GeoMap.addPmtiles`: a raster layer of the archive's images, or vector tiles with their raster layer and
  * labels */
-export async function pmtilesLayer(map, url, options) {
-    const archiveUrl = pmtilesUrl(url.startsWith('pmtiles://') ? url : `pmtiles://${url}`);
+export const pmtilesLayer = async (map, url, options) => {
+    const archiveUrl = pmtilesUrl(url.startsWith('pmtiles://') ? url : `pmtiles://${url}`) ?? url;
     const archive = pmtiles(archiveUrl);
-    const [header, metadata] = await Promise.all([archive.header(), archive.metadata().catch(() => ({}))]);
+    const [header, metadata] = await Promise.all([
+        archive.header(),
+        archive.metadata().catch(() => ({})),
+    ]);
     const credit = metadata.attribution;
     const attribution = options.attribution ?? (typeof credit === 'string' && credit ? plainText(credit) : undefined);
     const kind = options.kind ?? (header.tileType === 'mvt' ? 'vector' : 'raster');
@@ -720,7 +756,9 @@ export async function pmtilesLayer(map, url, options) {
         });
     }
     const layers = metadata.vector_layers;
-    const names = Array.isArray(layers) ? layers.map((l) => l?.id).filter((id) => typeof id === 'string') : [];
+    const names = Array.isArray(layers)
+        ? layers.map((l) => (isRecord(l) ? l.id : undefined)).filter((id) => typeof id === 'string')
+        : [];
     const style = options.style ?? basicStyle({ url: `pmtiles://${archiveUrl}` }, names);
     const tiles = map.vectorTiles({ style, ...credits });
     tiles.raster({
@@ -729,10 +767,10 @@ export async function pmtilesLayer(map, url, options) {
     });
     tiles.labels();
     return tiles;
-}
+};
 /** A raster loader reading the tiles of a `pmtiles://` archive URL (images of any size, drawn at `size`); undefined
  * for another URL */
-export function pmtilesRasterLoader(url, size) {
+export const pmtilesRasterLoader = (url, size) => {
     const archiveUrl = pmtilesUrl(url);
     if (!archiveUrl)
         return undefined;
@@ -743,5 +781,5 @@ export function pmtilesRasterLoader(url, size) {
             return null;
         return createImageBitmap(new Blob([bytes]), { resizeWidth: size, resizeHeight: size });
     };
-}
+};
 //# sourceMappingURL=vectortiles.js.map