Leaflet 使用文件输入更改传单ImageLayer

我正在开发一个动态图像映射器，用户可以加载公寓的楼层平面图，然后在部分楼层上放置标记。所以我不想动态更改传单地图图像层的url

我第一次用ChangeMap函数加载map。它正确加载了我的图像

function ChangeMap(_url)
{
var map = L.map('map', {
    minZoom: 1,
    maxZoom: 5,
    center: [0, 0],
    zoom: 3,
    crs: L.CRS.Simple
}).setView([50.4333, 30.5167], 3);

// dimensions of the image
var w = 1526,
    h = 626,
    url = _url;

// calculate the edges of the image, in coordinate space
var southWest = map.unproject([0, h], map.getMaxZoom() - 1);
var northEast = map.unproject([w, 0], map.getMaxZoom() - 1);
var bounds = new L.LatLngBounds(southWest, northEast);

// add the image overlay,
// so that it covers the entire map
var overlay = L.imageOverlay(url, bounds);
overlay.addTo(map);
}

但是如果我在没有刷新页面的情况下再次尝试，我会得到一个错误“MapContainer总是初始化的”。在那个错误之后，我想我可以像这样动态地添加id='map'的div

var mapContainer = $("#mapContainer");
mapContainer.append("<div id='map' width='100%' height='400px'></div>");

var-mapContainer=$（“#mapContainer”）；
mapContainer.append（“”）；

---

我在ChangeMap（）函数的开头添加了append函数。但这次页面上并没有地图。我该怎么做

只初始化映射一次…因此，从

ChangeMap

中取出

var map=L.map（'map'，{…

），并在之前只运行一次。我还建议只初始化L.imageOverlay一次…并在需要时在

ChangeMap

中使用它进行动态交换