Added geoJSON source getBounds method

CHANGELOG.md

@@ -2,6 +2,7 @@
 
 ### ✨ Features and improvements
 
+- Added `getBounds()` method to `GeoJSONSource` ([#5403](https://github.com/maplibre/maplibre-gl-js/pull/5403))
 - _...Add new stuff here..._
 
 ### 🐞 Bug fixes

src/source/geojson_source.test.ts

@@ -12,6 +12,8 @@ import {SubdivisionGranularitySetting} from '../render/subdivision_granularity_s
 import {type ActorMessage, MessageType} from '../util/actor_messages';
 import {type Actor} from '../util/actor';
 import {MercatorTransform} from '../geo/projection/mercator_transform';
+/* import {LngLatBounds} from '../geo/lng_lat_bounds';
+import type {FeatureCollection} from 'geojson'; */
 
 const wrapDispatcher = (dispatcher) => {
     return {

src/source/geojson_source.ts

@@ -15,6 +15,8 @@
 import type {GeoJSONWorkerOptions, LoadGeoJSONParameters} from './geojson_worker_source';
 import {type WorkerTileParameters} from './worker_source';
 import {MessageType} from '../util/actor_messages';
+import {LngLatBounds} from '../geo/lng_lat_bounds';
+import type {Point, MultiPoint, LineString, MultiLineString, Polygon, MultiPolygon} from 'geojson';
 
 /**
  * Options object for GeoJSONSource.
@@ -249,6 +251,48 @@
         return this.actor.sendAsync({type: MessageType.getData, data: options});
     }
 
+    /**
+     * Allows to get the source's actual boundaries.
+     *
+     * @returns a promise which resolves to the source's actual boundaries
+     */
+
+    async getBounds(): Promise<LngLatBounds> {
+        type justGeometry = Point | MultiPoint | LineString | MultiLineString | Polygon | MultiPolygon;
+        const bounds: LngLatBounds = new LngLatBounds();
+        const data: GeoJSON.GeoJSON = await this.getData();
+        let coordinates: number[];
+        if (!!data) return bounds;
+        switch(data.type){
+            case 'Feature':
+                if (data.geometry.type === 'GeometryCollection') {
+                    coordinates = data.geometry.geometries.map((g: justGeometry) => g.coordinates).flat(Infinity) as number[];
+                }else{
+                    coordinates = data.geometry.coordinates.flat(Infinity) as number[];
+                }
+                break;
+            case 'FeatureCollection':
+                coordinates = data.features.map(f => {
+                    if (f.geometry.type === 'GeometryCollection') {
+                        return f.geometry.geometries.map((g: justGeometry) => g.coordinates);
+                    }else{
+                        return f.geometry.coordinates;
+                    }
+                }).flat(Infinity) as number[];
+                break;
+            case 'GeometryCollection':
+                coordinates = data.geometries.map((g: justGeometry) => g.coordinates).flat(Infinity) as number[];
+                break;
+            default:
+                coordinates = data.coordinates.flat(Infinity) as number[];
+        }
+        if(coordinates.length == 0) return bounds;
+        for(let i = 0; i < coordinates.length - 1; i += 2){
+            bounds.extend([coordinates[i], coordinates[i+1]]);
+        }
+        return bounds;
+    }
+
     /**
      * To disable/enable clustering on the source options
      * @param options - The options to set

test/build/min.test.ts

@@ -38,7 +38,7 @@ describe('test min build', () => {
         const decreaseQuota = 4096;
 
         // feel free to update this value after you've checked that it has changed on purpose :-)
-        const expectedBytes = 909795;
+        const expectedBytes = 909799;
 
         expect(actualBytes).toBeLessThan(expectedBytes + increaseQuota);
         expect(actualBytes).toBeGreaterThan(expectedBytes - decreaseQuota);

test/integration/browser/browser.test.ts

@@ -3,7 +3,7 @@ import puppeteer, {type Page, type Browser} from 'puppeteer';
 import st from 'st';
 import http, {type Server} from 'http';
 import type {AddressInfo} from 'net';
-import type {default as MapLibreGL, Map} from '../../../dist/maplibre-gl';
+import type {default as MapLibreGL, Map, LngLatBounds} from '../../../dist/maplibre-gl';
 import {sleep} from '../../../src/util/test/util';
 
 const testWidth = 800;
@@ -448,4 +448,214 @@ describe('Browser tests', () => {
         expect(center.lng).toBeCloseTo(11.39770);
         expect(center.lat).toBeCloseTo(47.29960);
     });
+
+    test('GeoJSONSource#getBounds: FeatureCollection', async () => {
+        let testbounds: LngLatBounds;
+        const bounds = await page.evaluate(async () => {
+            testbounds = new maplibregl.LngLatBounds([-122.493782, 37.828802, -122.483396, 37.833818]);
+            const map = new maplibregl.Map({
+                container: 'map',
+                style: 'https://demotiles.maplibre.org/style.json',
+                center: [10, 10],
+                zoom: 10
+            });
+            map.on('load', () => {
+                map.addSource('testid', {
+                    type: 'geojson',
+                    data: {
+                        'type': 'FeatureCollection',
+                        'features': [{
+                            'type': 'Feature',
+                            'properties': {},
+                            'geometry': {
+                                'type': 'LineString',
+                                'coordinates': [
+                                    [-122.483696, 37.833818],
+                                    [-122.483482, 37.833174],
+                                    [-122.483396, 37.832700],
+                                    [-122.483568, 37.832056],
+                                    [-122.484040, 37.831141],
+                                    [-122.484040, 37.830497],
+                                    [-122.483482, 37.829920],
+                                    [-122.483568, 37.829548],
+                                    [-122.485070, 37.829446],
+                                    [-122.486100, 37.828802],
+                                    [-122.486958, 37.829310],
+                                    [-122.487001, 37.830802],
+                                    [-122.487516, 37.831683],
+                                    [-122.488031, 37.832158],
+                                    [-122.488889, 37.832971],
+                                    [-122.489876, 37.832632],
+                                    [-122.490434, 37.832937],
+                                    [-122.491250, 37.832429],
+                                    [-122.491636, 37.832564],
+                                    [-122.492237, 37.833378],
+                                    [-122.493782, 37.833683]
+                                ]
+                            }
+                        }]
+                    }
+                });
+                const testsource: maplibregl.GeoJSONSource = map.getSource('testid');
+                return testsource.getBounds();
+            });
+        });
+        expect(bounds).toEqual(testbounds);
+    });
+
+    test('GeoJSONSource#getBounds: Feature', async () => {
+        let testbounds: LngLatBounds;
+        const bounds = await page.evaluate(async () => {
+            testbounds = new maplibregl.LngLatBounds([-122.493782, 37.828802, -122.483396, 37.833818]);
+            const map = new maplibregl.Map({
+                container: 'map',
+                style: 'https://demotiles.maplibre.org/style.json',
+                center: [10, 10],
+                zoom: 10
+            });
+            map.on('load', () => {
+                map.addSource('testid', {
+                    type: 'geojson',
+                    data: {
+                        'type': 'Feature',
+                        'properties': {},
+                        'geometry': {
+                            'type': 'LineString',
+                            'coordinates': [
+                                [-122.483696, 37.833818],
+                                [-122.483482, 37.833174],
+                                [-122.483396, 37.832700],
+                                [-122.483568, 37.832056],
+                                [-122.484040, 37.831141],
+                                [-122.484040, 37.830497],
+                                [-122.483482, 37.829920],
+                                [-122.483568, 37.829548],
+                                [-122.485070, 37.829446],
+                                [-122.486100, 37.828802],
+                                [-122.486958, 37.829310],
+                                [-122.487001, 37.830802],
+                                [-122.487516, 37.831683],
+                                [-122.488031, 37.832158],
+                                [-122.488889, 37.832971],
+                                [-122.489876, 37.832632],
+                                [-122.490434, 37.832937],
+                                [-122.491250, 37.832429],
+                                [-122.491636, 37.832564],
+                                [-122.492237, 37.833378],
+                                [-122.493782, 37.833683]
+                            ]
+                        }
+                    }
+                });
+                const testsource: maplibregl.GeoJSONSource = map.getSource('testid');
+                return testsource.getBounds();
+            });
+        });
+        expect(bounds).toEqual(testbounds);
+    });
+
+    test('GeoJSONSource#getBounds: Geometry', async () => {
+        let testbounds: LngLatBounds;
+        const bounds = await page.evaluate(async () => {
+            testbounds = new maplibregl.LngLatBounds([-122.493782, 37.828802, -122.483396, 37.833818]);
+            const map = new maplibregl.Map({
+                container: 'map',
+                style: 'https://demotiles.maplibre.org/style.json',
+                center: [10, 10],
+                zoom: 10
+            });
+            map.on('load', () => {
+                map.addSource('testid', {
+                    type: 'geojson',
+                    data: {
+                        'type': 'LineString',
+                        'coordinates': [
+                            [-122.483696, 37.833818],
+                            [-122.483482, 37.833174],
+                            [-122.483396, 37.832700],
+                            [-122.483568, 37.832056],
+                            [-122.484040, 37.831141],
+                            [-122.484040, 37.830497],
+                            [-122.483482, 37.829920],
+                            [-122.483568, 37.829548],
+                            [-122.485070, 37.829446],
+                            [-122.486100, 37.828802],
+                            [-122.486958, 37.829310],
+                            [-122.487001, 37.830802],
+                            [-122.487516, 37.831683],
+                            [-122.488031, 37.832158],
+                            [-122.488889, 37.832971],
+                            [-122.489876, 37.832632],
+                            [-122.490434, 37.832937],
+                            [-122.491250, 37.832429],
+                            [-122.491636, 37.832564],
+                            [-122.492237, 37.833378],
+                            [-122.493782, 37.833683]
+                        ]
+                    }
+                });
+                const testsource: maplibregl.GeoJSONSource = map.getSource('testid');
+                return testsource.getBounds();
+            });
+        });
+        expect(bounds).toEqual(testbounds);
+    });
+
+    test('GeoJSONSource#getBounds: GeometryCollection', async () => {
+        let testbounds: LngLatBounds;
+        const bounds = await page.evaluate(async () => {
+            testbounds = new maplibregl.LngLatBounds([-122.493782, 37.828802, -122.483396, 37.833818]);
+            const map = new maplibregl.Map({
+                container: 'map',
+                style: 'https://demotiles.maplibre.org/style.json',
+                center: [10, 10],
+                zoom: 10
+            });
+            map.on('load', () => {
+                map.addSource('testid', {
+                    type: 'geojson',
+                    data: {
+                        'type': 'GeometryCollection',
+                        'geometries': [
+                            {
+                                'type': 'LineString',
+                                'coordinates': [
+                                    [-122.483696, 37.833818],
+                                    [-122.483482, 37.833174],
+                                    [-122.483396, 37.832700],
+                                    [-122.483568, 37.832056],
+                                    [-122.484040, 37.831141],
+                                    [-122.484040, 37.830497],
+                                    [-122.483482, 37.829920],
+                                    [-122.483568, 37.829548],
+                                    [-122.485070, 37.829446],
+                                    [-122.486100, 37.828802]
+
+                                ]
+                            },
+                            {
+                                'type': 'LineString',
+                                'coordinates': [
+                                    [-122.486958, 37.829310],
+                                    [-122.487001, 37.830802],
+                                    [-122.487516, 37.831683],
+                                    [-122.488031, 37.832158],
+                                    [-122.488889, 37.832971],
+                                    [-122.489876, 37.832632],
+                                    [-122.490434, 37.832937],
+                                    [-122.491250, 37.832429],
+                                    [-122.491636, 37.832564],
+                                    [-122.492237, 37.833378],
+                                    [-122.493782, 37.833683]
+                                ]
+                            }
+                        ]}
+                });
+                const testsource: maplibregl.GeoJSONSource = map.getSource('testid');
+                return testsource.getBounds();
+            });
+        });
+        expect(bounds).toEqual(testbounds);
+    });
+
 });