如何使用 leaflet 1.7.1 禁用弹出提示上的事件

Question

我在 map 上显示一个标记，并弹出一个 window ，其中显示带有超链接的图像。
当鼠标放在尖端时，会显示一只手（为什么？），如果我单击，则弹出窗口关闭？？

我在我的 css 中添加了禁用提示上的事件，但这似乎不是解决方案。

var options = {
   'className': 'custom-popup'
}
popup = "<a href='" + (BASE_URL || '') + m.link + "'>" + "<img src='" +  (BASE_URL || '') + m.image + "' /></a>"; 
marker.bindPopup(popup,options).openPopup();

css 自定义弹出窗口取代了 leaflet.css：

.custom-popup div.leaflet-popup-content {
  min-Width: 300px;
  max-Width: 300px;
  max-Height: 500px;
}
.custom-popup .leaflet-popup-content-wrapper {
  background:#2c3e50;
  color:#fff;
  font-size:16px;
  line-height:24px;
}
.custom-popup .leaflet-popup-tip-container {
  width:40px;
  height:20px;
  pointer-events: none;
}
.custom-popup .leaflet-popup-tip {
  background:#2c3e50;
}   

Answer 1

当鼠标放在尖端时，会显示一只手（为什么？），如果我单击，则弹出窗口关闭？？

正是因为pointer-events: none是.leaflet-popup-tip-container的默认值。 提示不会触发事件，因此当用户点击提示时，点击会直接到达底层元素（Leaflet 映射），它会触发事件。 然后，单击 map 本身时的默认行为是关闭活动弹出窗口。

也相关： 没有“禁用”事件和Leaflet 弹出窗口的部分。

这里的方法是将 CSS 规则pointer-events: auto或pointer-events: initial应用于.leaflet-popup-tip 。 提示上的指针交互将触发不被监听的 DOM 事件，因此什么也不做。

Answer 2

不要将弹出窗口直接添加到标记，创建一个弹出“图层”并在单击标记时打开它：

// a global variable
var popup = L.popup({'className': 'custom-popup', closeOnClick: false, autoClose: false, closeButton: true});

function openPopup(e){
    var marker = e.target;
    popup.options.offset = marker.options.icon.options.popupAnchor;
    popup.setContent(marker._popupContentTemp).setLatLng(marker.getLatLng()).addTo(map)
}


//your marker creation with click event
marker = new L.marker(latlng).addTo(lmap);
marker.on('click',openPopup, this)
marker._popupContentTemp = "<a href='" + (BASE_URL || '') + m.link + "'>" + "<img src='" +  (BASE_URL || '') + m.image + "' /></a>"; 

现在弹出窗口使用自定义内容打开，无法通过单击标记关闭