v3.7.0

3d-style/data/bucket/model_bucket.ts

@@ -169,10 +169,8 @@ class ModelBucket implements Bucket {
                 id: featureId,
                 sourceLayerIndex,
                 index,
-                // @ts-expect-error - TS2345 - Argument of type 'VectorTileFeature' is not assignable to parameter of type 'FeatureWithGeometry'.
                 geometry: needGeometry ? evaluationFeature.geometry : loadGeometry(feature, canonical, tileTransform),
                 properties: feature.properties,
-                // @ts-expect-error - TS2322 - Type '0 | 2 | 1 | 3' is not assignable to type '2 | 1 | 3'.
                 type: feature.type,
                 patterns: {}
             };

3d-style/data/model.ts

@@ -316,7 +316,7 @@ export default class Model {
 }
 
 export function uploadTexture(texture: ModelTexture, context: Context, useSingleChannelTexture: boolean = false) {
-    const textureFormat = useSingleChannelTexture ? context.gl.R8 : context.gl.RGBA;
+    const textureFormat = useSingleChannelTexture ? context.gl.R8 : context.gl.RGBA8;
     if (!texture.uploaded) {
         const useMipmap = texture.sampler.minFilter >= context.gl.NEAREST_MIPMAP_NEAREST;
         texture.gfxTexture = new Texture(context, texture.image, textureFormat, {useMipmap});

3d-style/render/draw_model.ts

@@ -110,7 +110,7 @@ function setupMeshDraw(definesValues: Array<string>, dynamicBuffers: Array<Verte
     setupTexture(emissionTexture, 'HAS_TEXTURE_u_emissionTexture', TextureSlots.Emission);
     if (lut) {
         if (!lut.texture) {
-            lut.texture = new Texture3D(painter.context, lut.image, [lut.image.height, lut.image.height, lut.image.height], context.gl.RGBA);
+            lut.texture = new Texture3D(painter.context, lut.image, [lut.image.height, lut.image.height, lut.image.height], context.gl.RGBA8);
         }
         context.activeTexture.set(context.gl.TEXTURE0 + TextureSlots.LUT);
         if (lut.texture) {
@@ -990,12 +990,10 @@ function drawBatchedModels(painter: Painter, source: SourceCache, layer: ModelSt
                     const dynamicBuffers = [];
                     setupMeshDraw((programOptions.defines as Array<string>), dynamicBuffers, mesh, painter, layer.lut);
                     if (!hasMapboxFeatures) {
-                        // @ts-expect-error
                         programOptions.defines.push('DIFFUSE_SHADED');
                     }
 
                     if (singleCascade) {
-                        // @ts-expect-error
                         programOptions.defines.push('SHADOWS_SINGLE_CASCADE');
                     }
 
@@ -1030,7 +1028,6 @@ function drawBatchedModels(painter: Painter, source: SourceCache, layer: ModelSt
                     // Handle Texture transform
                     if (material.occlusionTexture && material.occlusionTexture.offsetScale) {
                         occlusionTextureTransform = material.occlusionTexture.offsetScale;
-                        // @ts-expect-error
                         programOptions.defines.push('OCCLUSION_TEXTURE_TRANSFORM');
                     }
 

3d-style/render/program/model_program.ts

@@ -45,6 +45,8 @@ export type ModelUniformsType = {
     ['u_occlusionTextureTransform']: Uniform4f;
 };
 
+export type ModelDefinesType = 'DIFFUSE_SHADED' | 'SHADOWS_SINGLE_CASCADE' | 'OCCLUSION_TEXTURE_TRANSFORM';
+
 const modelUniforms = (context: Context): ModelUniformsType => ({
     'u_matrix': new UniformMatrix4f(context),
     'u_lighting_matrix': new UniformMatrix4f(context),

3d-style/render/shadow_renderer.ts

@@ -220,11 +220,11 @@ export class ShadowRenderer {
 
                 const gl = context.gl;
                 const fbo = context.createFramebuffer(width, height, useColor, 'texture');
-                const depthTexture = new Texture(context, {width, height, data: null}, gl.DEPTH_COMPONENT);
+                const depthTexture = new Texture(context, {width, height, data: null}, gl.DEPTH_COMPONENT16);
                 fbo.depthAttachment.set(depthTexture.texture);
 
                 if (useColor) {
-                    const colorTexture = new Texture(context, {width, height, data: null}, gl.RGBA);
+                    const colorTexture = new Texture(context, {width, height, data: null}, gl.RGBA8);
                     fbo.colorAttachment.set(colorTexture.texture);
                 }
 
@@ -357,7 +357,6 @@ export class ShadowRenderer {
                 const coords = sourceCache ? sourceCoords[sourceCache.id] : undefined;
                 if (layer.type !== 'model' && !(coords && coords.length)) continue;
 
-                // @ts-expect-error - TS2345 - Argument of type 'void | SourceCache' is not assignable to parameter of type 'SourceCache'.
                 painter.renderLayer(painter, sourceCache, layer, coords);
             }
         }

3d-style/style/lights.ts

@@ -47,8 +47,7 @@ class Lights<P extends LightProps> extends Evented {
     }
 
     get(): LightsSpecification {
-        // @ts-expect-error
-        this._options.properties = this._transitionable.serialize();
+        this._options.properties = this._transitionable.serialize() as LightsSpecification['properties'];
         return this._options;
     }
 

CHANGELOG.md

@@ -1,7 +1,10 @@
-## v3.7.0-beta.1
+## v3.7.0
 
 ### Features and improvements ✨
 
+- Add `background-pitch-alignment` property of the `background` layer, which is set to `map` by default but can now be set to `viewport`. Useful for highlighting individual features by dimming the rest of the map with a semitransparent background.
+- Add new control positions (`top`, `right`, `bottom`, and `left`) (h/t [@Ethan-Guttman](https://github.com/Ethan-Guttman)).
+- Add `retainPadding` option for camera movement methods, which can be set to `false` for pre-v3.4 padding behavior.
 - Add `config` expression support in layer filter.
 - Add symbol elevation properties: `symbol-z-offset` and `symbol-elevation-reference`.
 - Add the `fill-z-offset` property for fill layers.
@@ -13,6 +16,7 @@
 - Improve type checking for the `Map#setPaintProperty` and `Map#setLayoutProperty` methods.
 - Allow the `string` event type in Map event handlers.
 - Expose `RequestTransformFunction`, `ResourceType`, and `RequestParameters` types.
+- Improve texture memory footprint on some platforms.
 
 ### Bug fixes 🐞
 - Fix feature filtering when using 3D lights.
@@ -22,6 +26,9 @@
 - Fix the issue where `minzoom` and `maxzoom` properties were ignored by `clip` layers.
 - Fix handling previously hidden models in `clip` layers.
 - Fix directional light `cast-shadows` property type.
+- Fix an edge case that could produce `setStencilMode`-related error in the console with the dev build.
+- Fix an issue where some fill extrusions could temporarily disappear when zooming quickly in certain areas.
+- Fix an edge case that could cause flickering on a far plane on high zooms.
 
 ## 3.6.0
 

README.md

@@ -23,6 +23,7 @@ native SDKs. For code and issues specific to the native SDKs, see the
 - [Style documentation](https://docs.mapbox.com/mapbox-gl-js/style-spec/)
 - [Open source styles](https://github.com/mapbox/mapbox-gl-styles)
 - [Contributor documentation](./CONTRIBUTING.md)
+- [Browser Data Storage](./STORAGE.md)
 
 [<img width="600" alt="Mapbox GL JS gallery of map images" src="https://static-assets.mapbox.com/www/mapbox-gl-js-gallery.png">](https://www.mapbox.com/mapbox-gljs)
 
@@ -34,4 +35,4 @@ Mapbox Web SDK
 
 Copyright © 2021 - 2023 Mapbox, Inc. All rights reserved.
 
-The software and files in this repository (collectively, “Software”) are licensed under the Mapbox TOS for use only with the relevant Mapbox product(s) listed at www.mapbox.com/pricing. This license allows developers with a current active Mapbox account to use and modify the authorized portions of the Software as needed for use only with the relevant Mapbox product(s) through their Mapbox account in accordance with the Mapbox TOS.  This license terminates automatically if a developer no longer has a Mapbox account in good standing or breaches the Mapbox TOS. For the license terms, please see the Mapbox TOS at https://www.mapbox.com/legal/tos/ which incorporates the Mapbox Product Terms at www.mapbox.com/legal/service-terms.  If this Software is a SDK, modifications that change or interfere with marked portions of the code related to billing, accounting, or data collection are not authorized and the SDK sends limited de-identified location and usage data which is used in accordance with the Mapbox TOS. [Updated 2023-01]
+The software and files in this repository (collectively, “Software”) are licensed under the Mapbox TOS for use only with the relevant Mapbox product(s) listed at www.mapbox.com/pricing. This license allows developers with a current active Mapbox account to use and modify the authorized portions of the Software as needed for use only with the relevant Mapbox product(s) through their Mapbox account in accordance with the Mapbox TOS.  This license terminates automatically if a developer no longer has a Mapbox account in good standing or breaches the Mapbox TOS. For the license terms, please see the Mapbox TOS at https://www.mapbox.com/legal/tos/ which incorporates the Mapbox Product Terms at www.mapbox.com/legal/service-terms.  If this Software is a SDK, modifications that change or interfere with marked portions of the code related to billing, accounting, or data collection are not authorized and the SDK sends limited de-identified location and usage data which is used in accordance with the Mapbox TOS. [Updated 2023-01]

STORAGE.md

@@ -0,0 +1,2 @@
+# Browser Data Storage
+Mapbox GL JS SDK uses the browser [local storage](https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage) system and keys prefixed with `mapbox.eventData` to store telemetry-related data. This data includes a randomly-generated ID that is included in telemetry events that are sent to Mapbox in order to calculate aggregate usage statistics; as well as metadata about telemetry events that is only used locally. This data is not sold to third parties, nor does Mapbox use the data (either alone or in combination with any personal identifiers) for advertising, tracking end users, or creating profiles of individual end users.

debug/animate-point-along-route.html

@@ -8,6 +8,7 @@
     body { margin: 0; padding: 0; }
     #map { position: absolute; top: 0; bottom: 0; width: 100%; }
 </style>
+<link rel='stylesheet' href='../dist/mapbox-gl.css'/>
 </head>
 <body>
 <style>

debug/globe-with-video.html

@@ -41,7 +41,7 @@
     "sources": {
         "video": {
             "type": "video",
-            "urls": [ "ozone.mp4", "https://static-assets.mapbox.com/mapbox-gl-js/ozone2.mp4"],
+            "urls": [ "https://static-assets.mapbox.com/mapbox-gl-js/ozone2.mp4"],
             "coordinates": [
                 [-180.0, 85.0511287798066],
                 [180.0, 85.0511287798066],

debug/image-on-globe.html

@@ -16,6 +16,7 @@
             font-family: Arial, Helvetica, sans-serif;
         }
     </style>
+    <link rel='stylesheet' href='../dist/mapbox-gl.css' />
 </head>
 
 <body>

debug/projections.html

@@ -59,6 +59,7 @@
         <fieldset>
             <label>Select style</label>
             <select id="style" name="style">
+                <option value="standard">Standard</option>
                 <option value="streets-v11">Streets</option>
                 <option value="satellite-v9">Satellite</option>
             </select>

debug/walls.html

@@ -426,6 +426,16 @@
           }
         });
 
+        map.addLayer({
+            "type": "background",
+            "id": "dimming-background",
+            "paint": {
+              "background-pitch-alignment": "viewport",
+              "background-color": "black",
+              "background-opacity": 0.5
+            }
+        });
+
         map.addLayer({
             "type": "fill",
             "id": "floors",