我有一个页面，其中给了用户一个选择，他可以切换我显示的传单地图。
在初始传单地图加载后，我的问题是我想刷新地图。
我总是得到“地图容器已经初始化”：
问题线是：
var map = L.map('mapa').setView([lat, lon], 15);
最初它加载得很好，但是当我在表单中选择另一个参数并希望再次显示地图时它崩溃了。
顺便说一句，我试图$('#mapa')在第二次之前用 jQuery销毁和重新创建，setView()但它显示了相同的错误。
刷新传单地图：地图容器已经初始化
IT技术
javascript
leaflet
2021-02-09 08:28:02
6个回答
试着map.remove();尝试重新加载地图前。这将使用 Leaflet 的库（而不是 jquery 的）删除先前的地图元素。
网址：
<div id="weathermap"></div>
JavaScript：
function buildMap(lat,lon) {
document.getElementById('weathermap').innerHTML = "<div id='map' style='width: 100%; height: 100%;'></div>";
var osmUrl = 'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
osmAttribution = 'Map data © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors,' +
' <a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>',
osmLayer = new L.TileLayer(osmUrl, {maxZoom: 18, attribution: osmAttribution});
var map = new L.Map('map');
map.setView(new L.LatLng(lat,lon), 9 );
map.addLayer(osmLayer);
var validatorsLayer = new OsmJs.Weather.LeafletLayer({lang: 'en'});
map.addLayer(validatorsLayer);
}
我用这个：
document.getElementById('weathermap').innerHTML = "<div id='map' style='width: 100%; height: 100%;'></div>";
重新加载渲染地图的 div 内容。
最好的方法
map.off();
map.remove();
您应该添加 map.off()，它的运行速度也更快，并且不会导致事件出现问题
在初始化地图之前检查地图是否已经启动
var container = L.DomUtil.get('map');
if(container != null){
container._leaflet_id = null;
}