Skip to content

Conversation

yuiseki
Copy link

@yuiseki yuiseki commented Sep 7, 2025

What

maplibre-gl-js has officially added GlobeControl:
https://maplibre.org/maplibre-gl-js/docs/API/classes/GlobeControl/

This pull request enables the use of GlobeControl in react-map-gl as well.

Intended behavior

  • When you click GlobeControl button, the projection of map should be change to "globe".
  • When you click GlobeControl button once again, the projection of map should be change to "mercator".

Screen record

e35f3d83a562206ac3f2aa09f55300da.mp4

Why

I love using react-map-gl when developing interactive map applications by combining React and maplibre-gl-js.
Since GlobeControl does not exist on react-map-gl, I am implementing it myself:
https://github.com/yuiseki/TRIDENT/blob/main/src/components/GlobeControl/index.ts

This implementation is a custom extension that follows the existing GeolocateControl and NavigationControl on react-map-gl.
I am submitting a pull request because I would very much like to use this as an official component of react-map-gl.

How

The following files have been added:

  • modules/react-maplibre/src/components/globe-control.ts
  • docs/api-reference/maplibre/globe-control.md

The following files have been modified:

  • modules/react-maplibre/src/types/lib.ts

PR Checklist

  • Tests
  • yarn test must be successful.
    • New code should be covered by unit tests whenever possible.
  • Documentation
    • If public APIs are added/modified, update component documentation in docs/api-reference.
    • Breaking changes and deprecations must be added to docs/upgrade-guide.md.
    • Noteworthy new features should be added to docs/whats-new.md.
  • Description on GitHub
    • Link to relevant issue.
    • Label with a milestone (latest release or vNext).
    • If public APIs are added/modified, describe the intended behavior.
    • If visual/interaction is affected, consider attaching a screenshot/GIF.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant