刷新传单映射：映射容器已初始化 [英] refresh leaflet map: map container is already initialized

问题描述

我有一个页面，给用户选择他可以切换我显示的传单地图。

I have a page where given a select to the user he can switch the leaflet map I show.

在初始传单地图加载后，我的问题是当我想要刷新地图。

After a initial leaflet map load, my problem is when i want to refresh the map.

我总是得到地图容器已初始化：

I always get "Map container is already initialized":

问题在于：

var map = L.map('mapa').setView([lat, lon], 15);

最初它加载得很好，但是当我在表单中选择另一个参数并想要显示另一个参数时时间崩溃了。

Initially it loads well, but when I select another parameter in the form and want to display the map another time it crashes.

btw，我试图销毁并重新创建 $（'＃mapa'） jQuery在第二个 setView（）之前，但它显示相同的错误。

btw, I've tried to destroy and recreate $('#mapa') with jQuery before the second setView() but it shows the same error.

推荐答案

Html：

<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内容。

to reload content of div where render map.

这篇关于刷新传单映射：映射容器已初始化的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！