#3103 added showButton option to GeoLocate control.

CHANGELOG.md

@@ -1,7 +1,7 @@
 ## main
 
 ### ✨ Features and improvements
-
+- Add `showButton` option to `GeoLocateControl`. ([#3103](https://github.com/maplibre/maplibre-gl-js/issues/3103))
 - Add events to `GeolocateControl` to allow a more granular interaction ([#3847](https://github.com/maplibre/maplibre-gl-js/pull/3847))
 - _...Add new stuff here..._
 

src/css/maplibre-gl.css

@@ -354,6 +354,10 @@
     animation: maplibregl-spin 2s infinite linear;
 }
 
+.maplibregl-ctrl button.maplibregl-ctrl-geolocate.maplibregl-ctrl-geolocate-hidden {
+    display: none;
+}
+
 @media (-ms-high-contrast: active) {
     .maplibregl-ctrl button.maplibregl-ctrl-geolocate .maplibregl-ctrl-icon {
         background-image: svg-inline(ctrl-geolocate-white);

src/ui/control/geolocate_control.test.ts

@@ -583,4 +583,13 @@ describe('GeolocateControl with no options', () => {
         await zoomendPromise;
         expect(geolocate._circleElement.style.width).toBeTruthy();
     });
+
+    test('don\'t show button if showButton = false', async () => {
+        const geolocate = new GeolocateControl({
+            showButton: false
+        });
+        map.addControl(geolocate);
+        await sleep(0);
+        expect(geolocate._geolocateButton.classList.contains('maplibregl-ctrl-geolocate-hidden')).toBeTruthy();
+    });
 });

src/ui/control/geolocate_control.ts

@@ -38,6 +38,11 @@ type GeolocateControlOptions = {
      * @defaultValue true
      */
     showUserLocation?: boolean;
+    /**
+     * If `false` the Geolocate button will not be shown on the map.
+     * @defaultValue true
+     */
+    showButton?: boolean;
 };
 
 const defaultOptions: GeolocateControlOptions = {
@@ -51,7 +56,8 @@ const defaultOptions: GeolocateControlOptions = {
     },
     trackUserLocation: false,
     showAccuracyCircle: true,
-    showUserLocation: true
+    showUserLocation: true,
+    showButton: true
 };
 
 let numberOfWatches = 0;
@@ -532,6 +538,11 @@ export class GeolocateControl extends Evented implements IControl {
         DOM.create('span', 'maplibregl-ctrl-icon', this._geolocateButton).setAttribute('aria-hidden', 'true');
         this._geolocateButton.type = 'button';
 
+        // if showButton is false, don't add the button to the map
+        if (!this.options.showButton) {
+            this._geolocateButton.classList.add('maplibregl-ctrl-geolocate-hidden');
+        }
+
         if (supported === false) {
             warnOnce('Geolocation support is not available so the GeolocateControl will be disabled.');
             const title = this._map._getUIString('GeolocateControl.LocationNotAvailable');