leafletjs标记绑定弹出窗口（bindpopup()）及其选项

Question

传单文档显示您可以使用以下代码将弹出窗口添加到标记：

marker.bindPopup("<b>Hello world!</b><br>I am a popup.").openPopup();

或者创建一个独立的弹出窗口

var popup = L.popup()
    .setLatLng([51.5, -0.09])
    .setContent("I am a standalone popup.")
    .openOn(map);

有没有办法设置弹出选项并将其绑定到标记？我希望能够设置自己的popups最大宽度，并在单击标记时打开/关闭它们。

- nexus_6

Answer 1

你确定你正在阅读Leaflet参考文档吗？它指定可以通过创建弹出窗口并使用.bindPopup方法来将弹出窗口与选项绑定。例如，

var popup = L.popup()
    .setContent("I am a standalone popup.");

marker.bindPopup(popup).openPopup();

- tmcw

---

好的，这意味着您总是需要先创建弹出窗口，然后将其绑定到标记。 :-( - erik

这个一行代码可以实现：var mark1=L.marker([51.5, -0.09]).bindPopup(L.popup({maxWidth:500}).setContent("我是一个独立的弹出窗口。")).addTo(map); - erik

并且为了设置弹出窗口的固定宽度，请添加以下样式：.leaflet-popup-content { width:500px; } - erik

Answer 2

你可以将弹出窗口选项的对象作为bindPopup的第二个参数传递，就像这样：

marker.bindPopup("<strong>Hello world!</strong><br />I am a popup.", {maxWidth: 500});

我已在Leaflet 1.4中进行了测试，它似乎也可以在早期版本的bindPopup中使用。

- Richard Garside

---

我会说这就是原帖（以及我）所寻找的东西。 - betakilo

太棒了，Richard，发现得真好。 - alex351

Answer 3

对于maxWidth，您应该这样做：

var popup = L.popup({
    maxWidth:400
});
marker.bindPopup(popup).openPopup();

- Marko Letic