Leaflet.js fitBounds con relleno?

fitbounds leaflet

Question

Estoy tratando de establecer la opción fitBounds en un mapa de folleto como este:

var bounds = new L.LatLngBounds([[Math.max(lat, borneLat), Math.max(lng, borneLng)], [Math.min(lat, borneLat), Math.min(lng, borneLng)]]);
map.fitBounds(bounds, { padding: [20, 20] });

Sin embargo, esto no parece añadir ningún relleno? al menos el "nivel de zoom" del mapa no cambia, y siempre muestra los dos puntos en los bordes (es decir, uno está arriba a la derecha y el otro está abajo a la izquierda). Para algunos conjuntos de marcadores, funciona bien, el zoom está a un nivel decente de distancia y puedes ver todo muy bien. Sin embargo, cuando los elementos están muy cerca uno del otro, parece que se acerca demasiado a menos que pueda ajustarlo con algún "relleno".

Además, no estoy seguro de si los límites serían correctos así? Debería usar en su lugar sólo:

var bounds = [[Math.max(lat, borneLat), Math.max(lng, borneLng)], [Math.min(lat, borneLat), Math.min(lng, borneLng)]];

Answer 1

FWI, también puede establecer un nivel de zoom máximo para el mapa de la siguiente manera:

var map = L.mapbox.map(''map'', ''mapbox.emerald'', {
maxZoom: 16
});

De esta manera puede evitar que el mapa se acerque demasiado en caso de que los marcadores estén demasiado cerca entre sí.

Answer 2

Me encontré con este problema. Según entiendo, el relleno está controlado por el zoom. En mi ejemplo, todas las configuraciones de relleno menores de 10 no hacen ninguna diferencia. Tan pronto como el relleno llega a 10, el mapa se aleja un nivel y hay un relleno. Además, aumentar el valor de relleno no tiene influencia, hasta que es tan grande que se alcanza otro nivel de reducción.

Answer 3

map.fitBounds(bounds, {padding: []}) debería funcionar. Le sugiero que cambie el relleno a, por ejemplo. [50, 50] , tal vez sus valores de relleno son demasiado pequeños.

Echa un vistazo a este ejemplo JSFiddle .