CODEWITHSUNDEEP
javascriptmapbox
Drax
Drax

Reputation: 169

How to getCurrentPosition and update MapBox center coordinates

I'm experimenting with MapBox and creating a small GPS application. I am retrieving the longitude og latitude coordinates with getCurrentPosition successfully. However when I passed them into MapBox center [ ], no map is being displayed...

//mapbox

var map = new mapboxgl.Map({
style: 'mapbox://styles/mapbox/satellite-streets-v11',
center: [ lat, long ],// if I enter long & lat numbers, the map displays fine. 
zoom: 10.5,
container: 'map',

});

//current position
navigator.geolocation.getCurrentPosition(position) => {
 const long = position.coord.longitude;  //logs my current long coords
 const lat = position.coord.latitude; //logs my current lat coords
}

Upvotes: 0

Views: 528

Answers (1)

Luis Estevez
Luis Estevez

Reputation: 1407

You're entering the coordinates in the wrong order.

Mapbox uses longitude, latitude coordinate order to match GeoJSON. So instead of center: [ lat, long ], it's center: [long, lat]

However, if you're trying to center your map after the map has been created, use map.setCenter([Lng, Lat]).

Upvotes: 1

Related Questions