Leaflet modal中的单张图

我在

index.html

中有这个模式：

&时代；

是传单地图

然后我有一个函数，它应该将传单映射加载到modal中。参数图像是我想在传单地图上显示的图像

function modalImage（模态、图像、模态、文本、关闭）{
//获取模态
var modal=document.getElementById（modal）；
var img=document.getElementById（图像）；
var modalDiv=document.getElementById（modalDiv）；
控制台日志（modalDiv）；
var captionText=document.getElementById（文本）；
img.onclick=函数（）{
modal.style.display=“块”；
初始图像（modalDiv，img）；
captionText.innerHTML=this.alt；
}
//获取关闭模态的元素
var span=document.getElementsByClassName（关闭）[0]；
//当用户单击（x）时，关闭模式对话框
span.onclick=函数（）{
modal.style.display=“无”；
}
}

地图本身由以下代码生成：

函数图像（地图、图像）{
console.log（image.src）
var imgDimensions={width:300，height:300}//这是图像的高度和宽度。它尚未加载。
var map=L.map（map{
maxZoom:24，
minZoom:-24，
crs:L.crs.Simple
}).setView（[imgDimensions.height/2，imgDimensions.width/2]，0）；
var imageUrl=image.src；
变量imageBounds=[
[imgDimensions.width，0]，
[0，imgDimensions.高度]
];
L.imageOverlay（imageUrl，imageBounds）.addTo（map）；
}
modalImage（'myModal'，'left'，'mapImage1'，'caption'，'close1'）；

地图甚至没有显示在模态中

---

我错过了什么

不幸的是，正如@ghybs指出的，我没有定义地图的高度和宽度

div

。这就是为什么没有地图存在的原因。使用此

css

它可以完美地工作：

#mapImage1{
身高：100%；
宽度：100%；
位置：固定；
}

你如何调用你的

modalImage

函数？很抱歉我错过了，请看下面的代码行你如何定义你的

的

高度？哇，真是个错误。我得说我忘了。无论如何，谢谢你的快速帮助。请将您的发现写在您自己的答案中并接受它。