maplibre-gl 2.3.1-pre.2 → 2.4.0

package/src/ui/handler/map_event.ts

@@ -104,6 +104,7 @@ export class MapEventHandler implements Handler {
 export class BlockableMapEventHandler {
     _map: Map;
     _delayContextMenu: boolean;
+    _ignoreContextMenu: boolean;
     _contextMenuEvent: MouseEvent;
 
     constructor(map: Map) {
@@ -112,6 +113,7 @@ export class BlockableMapEventHandler {
 
     reset() {
         this._delayContextMenu = false;
+        this._ignoreContextMenu = true;
         delete this._contextMenuEvent;
     }
 
@@ -122,6 +124,7 @@ export class BlockableMapEventHandler {
 
     mousedown() {
         this._delayContextMenu = true;
+        this._ignoreContextMenu = false;
     }
 
     mouseup() {
@@ -135,7 +138,7 @@ export class BlockableMapEventHandler {
         if (this._delayContextMenu) {
             // Mac: contextmenu fired on mousedown; we save it until mouseup for consistency's sake
             this._contextMenuEvent = e;
-        } else {
+        } else if (!this._ignoreContextMenu) {
             // Windows: contextmenu fired on mouseup, so fire event now
             this._map.fire(new MapMouseEvent(e.type, this._map, e));
         }

package/src/ui/map.test.ts

@@ -13,6 +13,9 @@ import {LngLatBoundsLike} from '../geo/lng_lat_bounds';
 import {IControl} from './control/control';
 import EvaluationParameters from '../style/evaluation_parameters';
 import {fakeServer, FakeServer} from 'nise';
+import {CameraOptions} from './camera';
+import Terrain, {} from '../render/terrain';
+import {mercatorZfromAltitude} from '../geo/mercator_coordinate';
 
 function createStyleSource() {
     return {
@@ -2132,6 +2135,108 @@ describe('Map', () => {
         map.fire(new Event('dataabort'));
     });
 
+    describe('#calculateCameraOptionsFromTo', () => {
+        // Choose initial zoom to avoid center being constrained by mercator latitude limits.
+        test('pitch 90 with terrain', () => {
+            const map = createMap();
+
+            const mockedGetElevation = jest.fn((_tileID: OverscaledTileID, _x: number, _y: number, _extent?: number) => 111200);
+
+            const terrainStub = {} as Terrain;
+            terrainStub.getElevation = mockedGetElevation;
+            map.style.terrain = terrainStub;
+
+            // distance between lng x and lng x+1 is 111.2km at same lat
+            // altitude same as center elevation => 90° pitch
+            const cameraOptions: CameraOptions = map.calculateCameraOptionsFromTo(new LngLat(1, 0), 111200, new LngLat(0, 0));
+            expect(cameraOptions).toBeDefined();
+            expect(cameraOptions.pitch).toBeCloseTo(90);
+            expect(mockedGetElevation.mock.calls).toHaveLength(1);
+        });
+
+        test('pitch 153.435 with terrain', () => {
+            const map = createMap();
+
+            const mockedGetElevation = jest.fn((_tileID: OverscaledTileID, _x: number, _y: number, _extent?: number) => 111200 * 3);
+
+            const terrainStub = {} as Terrain;
+            terrainStub.getElevation = mockedGetElevation;
+            map.style.terrain = terrainStub;
+            // distance between lng x and lng x+1 is 111.2km at same lat
+            // (elevation difference of cam and center) / 2 = grounddistance =>
+            // acos(111.2 / sqrt(111.2² + (111.2 * 2)²)) = acos(1/sqrt(5)) => 63.435 + 90 = 153.435
+            const cameraOptions: CameraOptions = map.calculateCameraOptionsFromTo(new LngLat(1, 0), 111200, new LngLat(0, 0));
+            expect(cameraOptions).toBeDefined();
+            expect(cameraOptions.pitch).toBeCloseTo(153.435);
+            expect(mockedGetElevation.mock.calls).toHaveLength(1);
+        });
+
+        test('pitch 63 with terrain', () => {
+            const map = createMap();
+
+            const mockedGetElevation = jest.fn((_tileID: OverscaledTileID, _x: number, _y: number, _extent?: number) => 111200 / 2);
+
+            const terrainStub = {} as Terrain;
+            terrainStub.getElevation = mockedGetElevation;
+            map.style.terrain = terrainStub;
+
+            // distance between lng x and lng x+1 is 111.2km at same lat
+            // (elevation difference of cam and center) * 2 = grounddistance =>
+            // acos(111.2 / sqrt(111.2² + (111.2 * 0.5)²)) = acos(1/sqrt(1.25)) => 90 (looking down) - 26.565 = 63.435
+            const cameraOptions: CameraOptions = map.calculateCameraOptionsFromTo(new LngLat(0, 0), 111200, new LngLat(1, 0));
+            expect(cameraOptions).toBeDefined();
+            expect(cameraOptions.pitch).toBeCloseTo(63.435);
+            expect(mockedGetElevation.mock.calls).toHaveLength(1);
+        });
+
+        test('zoom distance 1000', () => {
+            const map = createMap();
+
+            const mockedGetElevation = jest.fn((_tileID: OverscaledTileID, _x: number, _y: number, _extent?: number) => 1000);
+
+            const terrainStub = {} as Terrain;
+            terrainStub.getElevation = mockedGetElevation;
+            map.style.terrain = terrainStub;
+
+            const expectedZoom = Math.log2(map.transform.cameraToCenterDistance / mercatorZfromAltitude(1000, 0) / map.transform.tileSize);
+            const cameraOptions = map.calculateCameraOptionsFromTo(new LngLat(0, 0), 0, new LngLat(0, 0));
+
+            expect(cameraOptions).toBeDefined();
+            expect(cameraOptions.zoom).toBeCloseTo(expectedZoom);
+            expect(mockedGetElevation.mock.calls).toHaveLength(1);
+        });
+
+        test('don\'t call getElevation when altitude supplied', () => {
+            const map = createMap();
+
+            const mockedGetElevation = jest.fn((_tileID: OverscaledTileID, _x: number, _y: number, _extent?: number) => 0);
+
+            const terrainStub = {} as Terrain;
+            terrainStub.getElevation = mockedGetElevation;
+            map.style.terrain = terrainStub;
+
+            const cameraOptions = map.calculateCameraOptionsFromTo(new LngLat(0, 0), 0, new LngLat(0, 0), 1000);
+
+            expect(cameraOptions).toBeDefined();
+            expect(mockedGetElevation.mock.calls).toHaveLength(0);
+        });
+
+        test('don\'t call getElevation when altitude 0 supplied', () => {
+            const map = createMap();
+
+            const mockedGetElevation = jest.fn((_tileID: OverscaledTileID, _x: number, _y: number, _extent?: number) => 0);
+
+            const terrainStub = {} as Terrain;
+            terrainStub.getElevation = mockedGetElevation;
+            map.style.terrain = terrainStub;
+
+            const cameraOptions = map.calculateCameraOptionsFromTo(new LngLat(0, 0), 0, new LngLat(1, 0), 0);
+
+            expect(cameraOptions).toBeDefined();
+            expect(mockedGetElevation.mock.calls).toHaveLength(0);
+        });
+    });
+
 });
 
 function createStyle() {

package/src/ui/map.ts

@@ -10,7 +10,7 @@ import Painter from '../render/painter';
 import Transform from '../geo/transform';
 import Hash from './hash';
 import HandlerManager from './handler_manager';
-import Camera from './camera';
+import Camera, {CameraOptions} from './camera';
 import LngLat from '../geo/lng_lat';
 import LngLatBounds from '../geo/lng_lat_bounds';
 import Point from '@mapbox/point-geometry';
@@ -603,6 +603,13 @@ class Map extends Camera {
         return this._controls.indexOf(control) > -1;
     }
 
+    calculateCameraOptionsFromTo(from: LngLat, altitudeFrom: number, to: LngLat, altitudeTo?: number) : CameraOptions {
+        if (altitudeTo == null && this.style.terrain) {
+            altitudeTo = this.transform.getElevation(to, this.style.terrain);
+        }
+        return super.calculateCameraOptionsFromTo(from, altitudeFrom, to, altitudeTo);
+    }
+
     /**
      * Resizes the map according to the dimensions of its
      * `container` element.