小册子 - 刷新地图

我明白这个问题已经被问到，并且之前已经回答，但是我还没有能够成功地实现这些例子。小册子 - 刷新地图

我试图通过zoomedIn()加载地图（正常工作），然后按下按钮加载具有zoomedOut()

地图在zoomedOut()不过，我var map = new L.Map('map');

我不得不抛出后Map container is already initialized认为前行if (map != undefined) { map.remove(); }会照顾到这一点。

发生了什么 - 我该如何重绘地图？

<body onLoad="javascript:zoomedIn();"> 
<form method = "post"> 
<button type="button" onclick="return zoomedOut()">Zoom Out</button> 
<div id="map"</div> 
</form> 

<script language="javascript"> 
    function zoomedIn() { 
    var map = new L.Map('map'); 
    L.tileLayer('https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token=pk.eyJ1IjoibWFwYm94IiwiYSI6ImNpejY4NXVycTA2emYycXBndHRqcmZ3N3gifQ.rJcFIG214AriISLbB6B5aw', { 
     id: 'mapbox.streets' 
    }).addTo(map); 
     var devon = new L.LatLng(50.900958,-3.370846); 
     map.setView(devon, 7); 
     } 
</script> 

<script language="javascript"> 
    function zoomedOut() { 
    if (map != undefined) { map.remove(); } 
    var map = new L.Map('map'); 
    L.tileLayer('https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token=pk.eyJ1IjoibWFwYm94IiwiYSI6ImNpejY4NXVycTA2emYycXBndHRqcmZ3N3gifQ.rJcFIG214AriISLbB6B5aw', { 
     id: 'mapbox.streets' 
    }).addTo(map); 
     var devon = new L.LatLng(50.900958,-3.370846); 
     map.setView(devon, 1); 
     }

来源

2017-06-25 Ben Mayo

我不明白你想达到的目标。你为什么要将地图移除然后再次添加？ –

我在地图上有一堆标记 - 我试图重绘这些标记。这当然不在上面的代码中，但据我了解，我需要重绘它。 –

在这里：https://stackoverflow.com/questions/19186428/refresh-leaflet-map-map-container-is-alreay-initialized –

您可以使用

map.invalidateSize()

它为我

来源

2017-11-23 11:43:22

小册子 - 刷新地图

回答

相关问题