Search code examples
javascriptmapboxmapbox-gl-jsmapbox-marker

Grab coordinates of the centre of the map with Mapbox GL JS

Is it possible to have a Marker stays in the middle of the map and grab the coordinates, while the user moves around the map? Like the map in Uber and Deliveroo.

I saw this for mapbox-ios-sdk Moving Map Under the Marker in Mapbox iOS SDK, but I can't find anything on mapbox-gl-js

Solution

  • You can get the coordinates with map.getCenter().toArray();

    To have a static marker in the middle, the easiest way is to simply overlay a separate DOM element (like an img or div) that is not part of the map. Just position it so that it's exactly centered.