Versuchen, mehr über LeafLet zu lernen. Da es sich nicht um Kacheln und CSS handelt, denke ich nicht, dass es sich um eine ähnliche Frage handelt. Das ist ziemlich neu, also könnte ich abhauen.Leaflet Karte von geoJSON geht außerhalb div
folgenden Waren grundlegende Anweisungen, etwas zu bekommen gehen:
var myCustomStyle = {
stroke: false,
fill: true,
fillColor: '#fff',
fillOpacity: 1
}
$.getJSON(myGeoJSONPath, function(data) {
var map = L.map('map', {
zoomControl: false,
attributionControl: false
}).setView([39.74739, -10], 2);
L.geoJson(data, {
clickable: false,
style: myCustomStyle,
}).addTo(map);
})
Und alles in Ordnung sah, wenn es in dem Behälter aufgestellt wurde. Als ich jedoch stroke auf "true" änderte, stellte ich fest, dass die Map tatsächlich über den Rand des div-Containers hinausreichte (https://jsfiddle.net/ef6otu1w/1/).
Ich versuchte, mit map.getSize() zu überprüfen, die die Containerbreite & Höhe korrekt zeigte. In ähnlicher Weise wurde durch die Umwandlung von .getBound() in Punkte nur bestätigt, dass die Länge den Containerabmessungen entspricht. Auch wenn ich das div größer als die Karte mache, wenn ich die Karte über den Rand des Containers hinaus ziehe, wird es in dem Whitespace angezeigt.
Ich fragte mich, was könnte die Ursache dafür sein, und was zu tun, um die Karte im Container zu halten.