I have a mapbox map with a marker and I want to add a radius around it, say 10 miles.

Now I can add a circle to the map, even though I do not want to, but I cannot get it to fit the screen. I have tried bounds, etc

Any advice?

I init map like:

var userOnlineStatus = [];
L.mapbox.accessToken = 'token here';

var map = L.mapbox.map('map')
    .setView([52.462610, -1.588580], 12)
var userLayer = L.layerGroup().addTo(map);
var markerLayer = new L.MarkerClusterGroup().addTo(map);

Different things I have tried, not in any order.

var radius = 1500; // in meters.
var circle = L.circle([52.462610, -1.588580], radius).addTo(map);   
map.fitBounds(circle, {padding: [50, 50]});


var marker = L.marker([52.462610, -1.588580]).addTo(map);
var radius = 15000; // in meters.
var circle = L.circle([52.462610, -1.588580], radius).addTo(map);

var newbounds;

newbounds = map.getBounds(circle);

map.fitBounds(newbounds, {padding: [50, 50]});
map.fitBounds([marker, newbounds]));

Getbounds does not work or it can not load map tiles?

  • map.fitBounds(circle.getBounds()) works for me.
    – TomazicM
    Jan 12 at 16:43
  • wierd??? That didnt work at all??? Thanks
    – JulesUK
    Jan 12 at 17:19

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.