Question

在深入研究了许多问题之后，在很多例子中我无法使其发挥作用。我尝试过任何一个例子。

我想在弹出标记内添加图像，而不是使用这个惊人的Leaflet.photo插件。

我的问题是，当我第一次打开它时，图像会远离弹出边界。关闭它并再次打开后，图像完全适合边界。

与此示例example

中的情况相同

我还尝试以下面的方式破解CSS类，而不是像示例源代码中那样编写自定义选项。

.leaflet-popup-content img { max-width:234px !important; height:auto; width:auto !important; }

虽然没有任何改变，但结果与所示示例相同。有什么建议吗？

非常感谢

Answer 1

可能发生的是图像需要一些时间才能下载，因此Leaflet不知道给弹出容器的正确大小。

然后在第二次打开时，从浏览器缓存中获取图像，Leaflet可以正确计算弹出窗口大小。

您可以尝试延迟myPopup._updateLayout()调用，以便在下载图像后让Leaflet重新评估弹出式容器大小。例如。将onload侦听器附加到image元素，并在弹出窗口中调用_updateLayout()方法。