maplibre-gl 3.3.1 → 3.4.0

package/dist/maplibre-gl-dev.js

@@ -1,4 +1,4 @@
-/* MapLibre GL JS is licensed under the 3-Clause BSD License. Full text of license: https://github.com/maplibre/maplibre-gl-js/blob/v3.3.1/LICENSE.txt */
+/* MapLibre GL JS is licensed under the 3-Clause BSD License. Full text of license: https://github.com/maplibre/maplibre-gl-js/blob/v3.4.0/LICENSE.txt */
 (function (global, factory) {
 typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
 typeof define === 'function' && define.amd ? define(factory) :
@@ -1577,10 +1577,28 @@ var source_raster_dem = {
 			terrarium: {
 			},
 			mapbox: {
+			},
+			custom: {
 			}
 		},
 		"default": "mapbox"
 	},
+	redFactor: {
+		type: "number",
+		"default": 1
+	},
+	blueFactor: {
+		type: "number",
+		"default": 1
+	},
+	greenFactor: {
+		type: "number",
+		"default": 1
+	},
+	baseShift: {
+		type: "number",
+		"default": 0
+	},
 	volatile: {
 		type: "boolean",
 		"default": false
@@ -8878,6 +8896,9 @@ class ZoomDependentExpression {
         }
     }
 }
+function isZoomExpression(expression) {
+    return expression._styleExpression !== undefined;
+}
 function createPropertyExpression(expressionInput, propertySpec) {
     const expression = createExpression(expressionInput, propertySpec);
     if (expression.result === 'error') {
@@ -10392,6 +10413,9 @@ function validateLayer(options) {
             else if (sourceType === 'vector' && type === 'raster') {
                 errors.push(new ValidationError(key, layer.source, `layer "${layer.id}" requires a raster source`));
             }
+            else if (sourceType !== 'raster-dem' && type === 'hillshade') {
+                errors.push(new ValidationError(key, layer.source, `layer "${layer.id}" requires a raster-dem source`));
+            }
             else if (sourceType === 'raster' && type !== 'raster') {
                 errors.push(new ValidationError(key, layer.source, `layer "${layer.id}" requires a vector source`));
             }
@@ -10478,6 +10502,47 @@ function validateString(options) {
     return [];
 }
 
+function validateRasterDEMSource(options) {
+    var _a;
+    const sourceName = (_a = options.sourceName) !== null && _a !== void 0 ? _a : '';
+    const rasterDEM = options.value;
+    const styleSpec = options.styleSpec;
+    const rasterDEMSpec = styleSpec.source_raster_dem;
+    const style = options.style;
+    let errors = [];
+    const rootType = getType(rasterDEM);
+    if (rasterDEM === undefined) {
+        return errors;
+    }
+    else if (rootType !== 'object') {
+        errors.push(new ValidationError('source_raster_dem', rasterDEM, `object expected, ${rootType} found`));
+        return errors;
+    }
+    const encoding = unbundle(rasterDEM.encoding);
+    const isCustomEncoding = encoding === 'custom';
+    const customEncodingKeys = ['redFactor', 'greenFactor', 'blueFactor', 'baseShift'];
+    const encodingName = options.value.encoding ? `"${options.value.encoding}"` : 'Default';
+    for (const key in rasterDEM) {
+        if (!isCustomEncoding && customEncodingKeys.includes(key)) {
+            errors.push(new ValidationError(key, rasterDEM[key], `In "${sourceName}": "${key}" is only valid when "encoding" is set to "custom". ${encodingName} encoding found`));
+        }
+        else if (rasterDEMSpec[key]) {
+            errors = errors.concat(options.validateSpec({
+                key,
+                value: rasterDEM[key],
+                valueSpec: rasterDEMSpec[key],
+                validateSpec: options.validateSpec,
+                style,
+                styleSpec
+            }));
+        }
+        else {
+            errors.push(new ValidationError(key, rasterDEM[key], `unknown property "${key}"`));
+        }
+    }
+    return errors;
+}
+
 const objectElementValidators = {
     promoteId: validatePromoteId
 };
@@ -10495,7 +10560,6 @@ function validateSource$1(options) {
     switch (type) {
         case 'vector':
         case 'raster':
-        case 'raster-dem':
             errors = validateObject({
                 key,
                 value,
@@ -10506,6 +10570,15 @@ function validateSource$1(options) {
                 validateSpec,
             });
             return errors;
+        case 'raster-dem':
+            errors = validateRasterDEMSource({
+                sourceName: key,
+                value,
+                style: options.style,
+                styleSpec,
+                validateSpec,
+            });
+            return errors;
         case 'geojson':
             errors = validateObject({
                 key,
@@ -10922,6 +10995,7 @@ const expression = {
     createPropertyExpression,
     isExpression,
     isExpressionFilter,
+    isZoomExpression,
     normalizePropertyExpression,
 };
 const styleFunction = {
@@ -25473,8 +25547,13 @@ class LineStyleLayer extends StyleLayer {
     }
     _handleSpecialPaintPropertyUpdate(name) {
         if (name === 'line-gradient') {
-            const expression = this._transitionablePaint._values['line-gradient'].value.expression;
-            this.stepInterpolant = expression._styleExpression.expression instanceof Step;
+            const expression = this.gradientExpression();
+            if (isZoomExpression(expression)) {
+                this.stepInterpolant = expression._styleExpression.expression instanceof Step;
+            }
+            else {
+                this.stepInterpolant = false;
+            }
             this.gradientVersion = (this.gradientVersion + 1) % Number.MAX_SAFE_INTEGER;
         }
     }
@@ -29150,29 +29229,45 @@ function getQuadkey(z, x, y) {
 register('CanonicalTileID', CanonicalTileID);
 register('OverscaledTileID', OverscaledTileID, { omit: ['posMatrix'] });
 
-// DEMData is a data structure for decoding, backfilling, and storing elevation data for processing in the hillshade shaders
-// data can be populated either from a pngraw image tile or from serliazed data sent back from a worker. When data is initially
-// loaded from a image tile, we decode the pixel values using the appropriate decoding formula, but we store the
-// elevation data as an Int32 value. we add 65536 (2^16) to eliminate negative values and enable the use of
-// integer overflow when creating the texture used in the hillshadePrepare step.
-// DEMData also handles the backfilling of data from a tile's neighboring tiles. This is necessary because we use a pixel's 8
-// surrounding pixel values to compute the slope at that pixel, and we cannot accurately calculate the slope at pixels on a
-// tile's edge without backfilling from neighboring tiles.
 class DEMData {
     // RGBAImage data has uniform 1px padding on all sides: square tile edge size defines stride
     // and dim is calculated as stride - 2.
-    constructor(uid, data, encoding) {
+    constructor(uid, data, encoding, redFactor = 1.0, greenFactor = 1.0, blueFactor = 1.0, baseShift = 0.0) {
         this.uid = uid;
         if (data.height !== data.width)
             throw new RangeError('DEM tiles must be square');
-        if (encoding && encoding !== 'mapbox' && encoding !== 'terrarium') {
-            warnOnce(`"${encoding}" is not a valid encoding type. Valid types include "mapbox" and "terrarium".`);
+        if (encoding && !['mapbox', 'terrarium', 'custom'].includes(encoding)) {
+            warnOnce(`"${encoding}" is not a valid encoding type. Valid types include "mapbox", "terrarium" and "custom".`);
             return;
         }
         this.stride = data.height;
         const dim = this.dim = data.height - 2;
         this.data = new Uint32Array(data.data.buffer);
-        this.encoding = encoding || 'mapbox';
+        switch (encoding) {
+            case 'terrarium':
+                // unpacking formula for mapzen terrarium:
+                // https://aws.amazon.com/public-datasets/terrain/
+                this.redFactor = 256.0;
+                this.greenFactor = 1.0;
+                this.blueFactor = 1.0 / 256.0;
+                this.baseShift = 32768.0;
+                break;
+            case 'custom':
+                this.redFactor = redFactor;
+                this.greenFactor = greenFactor;
+                this.blueFactor = blueFactor;
+                this.baseShift = baseShift;
+                break;
+            case 'mapbox':
+            default:
+                // unpacking formula for mapbox.terrain-rgb:
+                // https://www.mapbox.com/help/access-elevation-data/#mapbox-terrain-rgb
+                this.redFactor = 6553.6;
+                this.greenFactor = 25.6;
+                this.blueFactor = 0.1;
+                this.baseShift = 10000.0;
+                break;
+        }
         // in order to avoid flashing seams between tiles, here we are initially populating a 1px border of pixels around the image
         // with the data of the nearest pixel from the image. this data is eventually replaced when the tile's neighboring
         // tiles are loaded and the accurate data can be backfilled using DEMData#backfillBorder
@@ -29207,26 +29302,18 @@ class DEMData {
     get(x, y) {
         const pixels = new Uint8Array(this.data.buffer);
         const index = this._idx(x, y) * 4;
-        const unpack = this.encoding === 'terrarium' ? this._unpackTerrarium : this._unpackMapbox;
-        return unpack(pixels[index], pixels[index + 1], pixels[index + 2]);
+        return this.unpack(pixels[index], pixels[index + 1], pixels[index + 2]);
     }
     getUnpackVector() {
-        return this.encoding === 'terrarium' ? [256.0, 1.0, 1.0 / 256.0, 32768.0] : [6553.6, 25.6, 0.1, 10000.0];
+        return [this.redFactor, this.greenFactor, this.blueFactor, this.baseShift];
     }
     _idx(x, y) {
         if (x < -1 || x >= this.dim + 1 || y < -1 || y >= this.dim + 1)
             throw new RangeError('out of range source coordinates for DEM data');
         return (y + 1) * this.stride + (x + 1);
     }
-    _unpackMapbox(r, g, b) {
-        // unpacking formula for mapbox.terrain-rgb:
-        // https://www.mapbox.com/help/access-elevation-data/#mapbox-terrain-rgb
-        return ((r * 256 * 256 + g * 256.0 + b) / 10.0 - 10000.0);
-    }
-    _unpackTerrarium(r, g, b) {
-        // unpacking formula for mapzen terrarium:
-        // https://aws.amazon.com/public-datasets/terrain/
-        return ((r * 256 + g + b / 256) - 32768.0);
+    unpack(r, g, b) {
+        return (r * this.redFactor + g * this.greenFactor + b * this.blueFactor - this.baseShift);
     }
     getPixels() {
         return new RGBAImage({ width: this.stride, height: this.stride }, new Uint8Array(this.data.buffer));
@@ -31667,12 +31754,27 @@ function loadVectorTile(params, callback) {
             callback(err);
         }
         else if (data) {
-            callback(null, {
-                vectorTile: new performance.vectorTile.VectorTile(new performance.Protobuf(data)),
-                rawData: data,
-                cacheControl,
-                expires
-            });
+            try {
+                const vectorTile = new performance.vectorTile.VectorTile(new performance.Protobuf(data));
+                callback(null, {
+                    vectorTile,
+                    rawData: data,
+                    cacheControl,
+                    expires
+                });
+            }
+            catch (ex) {
+                const bytes = new Uint8Array(data);
+                const isGzipped = bytes[0] === 0x1f && bytes[1] === 0x8b;
+                let errorMessage = `Unable to parse the tile at ${params.request.url}, `;
+                if (isGzipped) {
+                    errorMessage += 'please make sure the data is not gzipped and that you have configured the relevant header in the server';
+                }
+                else {
+                    errorMessage += `got error: ${ex.messge}`;
+                }
+                callback(new Error(errorMessage));
+            }
         }
     });
     return () => {
@@ -31821,10 +31923,10 @@ class RasterDEMTileWorkerSource {
         this.loaded = {};
     }
     loadTile(params, callback) {
-        const { uid, encoding, rawImageData } = params;
+        const { uid, encoding, rawImageData, redFactor, greenFactor, blueFactor, baseShift } = params;
         // Main thread will transfer ImageBitmap if offscreen decode with OffscreenCanvas is supported, else it will transfer an already decoded image.
         const imagePixels = performance.isImageBitmap(rawImageData) ? this.getImageData(rawImageData) : rawImageData;
-        const dem = new performance.DEMData(uid, imagePixels, encoding);
+        const dem = new performance.DEMData(uid, imagePixels, encoding, redFactor, greenFactor, blueFactor, baseShift);
         this.loaded = this.loaded || {};
         this.loaded[uid] = dem;
         callback(null, dem);
@@ -34029,7 +34131,7 @@ define(['./shared'], (function (performance) { 'use strict';
 
 var name = "maplibre-gl";
 var description = "BSD licensed community fork of mapbox-gl, a WebGL interactive maps library";
-var version$2 = "3.3.1";
+var version$2 = "3.4.0";
 var main = "dist/maplibre-gl.js";
 var style = "dist/maplibre-gl.css";
 var license = "BSD-3-Clause";
@@ -34048,12 +34150,12 @@ var dependencies = {
 	"@mapbox/unitbezier": "^0.0.1",
 	"@mapbox/vector-tile": "^1.3.1",
 	"@mapbox/whoots-js": "^3.1.0",
-	"@maplibre/maplibre-gl-style-spec": "^19.3.0",
-	"@types/geojson": "^7946.0.10",
+	"@maplibre/maplibre-gl-style-spec": "^19.3.2",
+	"@types/geojson": "^7946.0.11",
 	"@types/mapbox__point-geometry": "^0.1.2",
-	"@types/mapbox__vector-tile": "^1.3.0",
-	"@types/pbf": "^3.0.2",
-	"@types/supercluster": "^7.1.0",
+	"@types/mapbox__vector-tile": "^1.3.1",
+	"@types/pbf": "^3.0.3",
+	"@types/supercluster": "^7.1.1",
 	earcut: "^2.2.4",
 	"geojson-vt": "^3.2.1",
 	"gl-matrix": "^3.4.3",
@@ -34070,56 +34172,56 @@ var dependencies = {
 var devDependencies = {
 	"@mapbox/mapbox-gl-rtl-text": "^0.2.3",
 	"@mapbox/mvt-fixtures": "^3.10.0",
-	"@rollup/plugin-commonjs": "^25.0.4",
-	"@rollup/plugin-json": "^6.0.0",
-	"@rollup/plugin-node-resolve": "^15.2.1",
-	"@rollup/plugin-replace": "^5.0.2",
-	"@rollup/plugin-strip": "^3.0.2",
-	"@rollup/plugin-terser": "^0.4.3",
-	"@rollup/plugin-typescript": "^11.1.3",
-	"@types/benchmark": "^2.1.2",
+	"@rollup/plugin-commonjs": "^25.0.5",
+	"@rollup/plugin-json": "^6.0.1",
+	"@rollup/plugin-node-resolve": "^15.2.2",
+	"@rollup/plugin-replace": "^5.0.3",
+	"@rollup/plugin-strip": "^3.0.3",
+	"@rollup/plugin-terser": "^0.4.4",
+	"@rollup/plugin-typescript": "^11.1.5",
+	"@types/benchmark": "^2.1.3",
 	"@types/cssnano": "^5.0.0",
-	"@types/d3": "^7.4.0",
-	"@types/diff": "^5.0.3",
-	"@types/earcut": "^2.1.1",
-	"@types/eslint": "^8.44.2",
-	"@types/gl": "^6.0.2",
+	"@types/d3": "^7.4.1",
+	"@types/diff": "^5.0.5",
+	"@types/earcut": "^2.1.2",
+	"@types/eslint": "^8.44.3",
+	"@types/gl": "^6.0.3",
 	"@types/glob": "^8.1.0",
 	"@types/jest": "^29.5.3",
-	"@types/jsdom": "^21.1.2",
-	"@types/minimist": "^1.2.2",
+	"@types/jsdom": "^21.1.3",
+	"@types/minimist": "^1.2.3",
 	"@types/murmurhash-js": "^1.0.4",
-	"@types/nise": "^1.4.1",
-	"@types/node": "^20.5.7",
-	"@types/offscreencanvas": "^2019.7.0",
+	"@types/nise": "^1.4.2",
+	"@types/node": "^20.8.2",
+	"@types/offscreencanvas": "^2019.7.1",
 	"@types/pixelmatch": "^5.2.4",
-	"@types/pngjs": "^6.0.1",
-	"@types/react": "^18.2.21",
-	"@types/react-dom": "^18.2.7",
-	"@types/request": "^2.48.8",
+	"@types/pngjs": "^6.0.2",
+	"@types/react": "^18.2.25",
+	"@types/react-dom": "^18.2.10",
+	"@types/request": "^2.48.9",
 	"@types/shuffle-seed": "^1.1.0",
 	"@types/window-or-global": "^1.0.4",
-	"@typescript-eslint/eslint-plugin": "^6.4.1",
-	"@typescript-eslint/parser": "^6.4.1",
-	address: "^1.2.2",
+	"@typescript-eslint/eslint-plugin": "^6.7.4",
+	"@typescript-eslint/parser": "^6.7.4",
+	address: "^2.0.1",
 	benchmark: "^2.1.4",
 	canvas: "^2.11.2",
 	cssnano: "^6.0.1",
 	d3: "^7.8.5",
 	"d3-queue": "^3.0.7",
-	"devtools-protocol": "^0.0.1188743",
+	"devtools-protocol": "^0.0.1205644",
 	diff: "^5.1.0",
 	"dts-bundle-generator": "^8.0.1",
-	eslint: "^8.48.0",
+	eslint: "^8.50.0",
 	"eslint-config-mourner": "^3.0.0",
 	"eslint-plugin-html": "^7.1.0",
 	"eslint-plugin-import": "^2.28.1",
-	"eslint-plugin-jest": "^27.2.3",
+	"eslint-plugin-jest": "^27.4.2",
 	"eslint-plugin-react": "^7.33.2",
 	"eslint-plugin-tsdoc": "0.2.17",
-	expect: "^29.6.4",
+	expect: "^29.7.0",
 	gl: "^6.0.2",
-	glob: "^10.3.3",
+	glob: "^10.3.10",
 	"is-builtin-module": "^3.2.1",
 	jest: "^29.6.2",
 	"jest-canvas-mock": "^2.5.2",
@@ -34135,14 +34237,14 @@ var devDependencies = {
 	"pdf-merger-js": "^4.3.0",
 	pixelmatch: "^5.3.0",
 	pngjs: "^7.0.0",
-	postcss: "^8.4.28",
+	postcss: "^8.4.31",
 	"postcss-cli": "^10.1.0",
 	"postcss-inline-svg": "^6.0.0",
 	"pretty-bytes": "^6.1.1",
-	puppeteer: "^21.1.0",
+	puppeteer: "^21.3.6",
 	react: "^18.2.0",
 	"react-dom": "^18.2.0",
-	rollup: "^3.28.1",
+	rollup: "^3.29.4",
 	"rollup-plugin-sourcemaps": "^0.6.3",
 	rw: "^1.3.3",
 	semver: "^7.5.4",
@@ -34154,10 +34256,10 @@ var devDependencies = {
 	"ts-jest": "^29.1.1",
 	"ts-node": "^10.9.1",
 	tslib: "^2.6.2",
-	typedoc: "^0.24.8",
+	typedoc: "^0.25.1",
 	"typedoc-plugin-markdown": "^3.16.0",
 	"typedoc-plugin-missing-exports": "^2.1.0",
-	typescript: "^5.1.6"
+	typescript: "^5.2.2"
 };
 var overrides = {
 	"postcss-inline-svg": {
@@ -36229,7 +36331,7 @@ class VectorTileSource extends performance.Evented {
  * ```ts
  * map.addSource('raster-source', {
  *     'type': 'raster',
- *     'tiles': ['https://stamen-tiles.a.ssl.fastly.net/watercolor/{z}/{x}/{y}.jpg'],
+ *     'tiles': ['https://tiles.stadiamaps.com/tiles/stamen_watercolor/{z}/{x}/{y}.jpg'],
  *     'tileSize': 256,
  * });
  * ```
@@ -36388,6 +36490,10 @@ class RasterDEMTileSource extends RasterTileSource {
         this.maxzoom = 22;
         this._options = performance.extend({ type: 'raster-dem' }, options);
         this.encoding = options.encoding || 'mapbox';
+        this.redFactor = options.redFactor;
+        this.greenFactor = options.greenFactor;
+        this.blueFactor = options.blueFactor;
+        this.baseShift = options.baseShift;
     }
     loadTile(tile, callback) {
         const url = tile.tileID.canonical.url(this.tiles, this.map.getPixelRatio(), this.scheme);
@@ -36415,7 +36521,11 @@ class RasterDEMTileSource extends RasterTileSource {
                     coord: tile.tileID,
                     source: this.id,
                     rawImageData,
-                    encoding: this.encoding
+                    encoding: this.encoding,
+                    redFactor: this.redFactor,
+                    greenFactor: this.greenFactor,
+                    blueFactor: this.blueFactor,
+                    baseShift: this.baseShift
                 };
                 if (!tile.actor || tile.state === 'expired') {
                     tile.actor = this.dispatcher.getActor();
@@ -49369,6 +49479,12 @@ class ScrollZoomHandler {
     }
     reset() {
         this._active = false;
+        this._zooming = false;
+        delete this._targetZoom;
+        if (this._finishTimeout) {
+            clearTimeout(this._finishTimeout);
+            delete this._finishTimeout;
+        }
     }
 }
 
@@ -50148,7 +50264,7 @@ class HandlerManager {
             this._updatingCamera = true;
             const inertialEase = this._inertia._onMoveEnd(this._map.dragPan._inertiaOptions);
             const shouldSnapToNorth = bearing => bearing !== 0 && -this._bearingSnap < bearing && bearing < this._bearingSnap;
-            if (inertialEase) {
+            if (inertialEase && (inertialEase.essential || !performance.browser.prefersReducedMotion)) {
                 if (shouldSnapToNorth(inertialEase.bearing || this._map.getBearing())) {
                     inertialEase.bearing = 0;
                 }
@@ -53974,6 +54090,7 @@ let Map$1 = class Map extends Camera {
      * @param name - The name of the paint property to set.
      * @param value - The value of the paint property to set.
      * Must be of a type appropriate for the property, as defined in the [MapLibre Style Specification](https://maplibre.org/maplibre-style-spec/).
+     * Pass `null` to unset the existing value.
      * @param options - Options object.
      * @returns `this`
      * @example
@@ -55131,6 +55248,10 @@ class Marker extends performance.Evented {
         this._update = (e) => {
             if (!this._map)
                 return;
+            const isFullyLoaded = this._map.loaded() && !this._map.isMoving();
+            if ((e === null || e === void 0 ? void 0 : e.type) === 'terrain' || ((e === null || e === void 0 ? void 0 : e.type) === 'render' && !isFullyLoaded)) {
+                this._map.once('render', this._update);
+            }
             if (this._map.transform.renderWorldCopies) {
                 this._lngLat = smartWrap(this._lngLat, this._pos, this._map.transform);
             }
@@ -55354,6 +55475,7 @@ class Marker extends performance.Evented {
         map.getCanvasContainer().appendChild(this._element);
         map.on('move', this._update);
         map.on('moveend', this._update);
+        map.on('terrain', this._update);
         this.setDraggable(this._draggable);
         this._update();
         // If we attached the `click` listener to the marker element, the popup