Закрыть всплывающее окно в листовке

#javascript #leaflet

#javascript #листовка

Вопрос:

У меня есть код, который отображает всплывающее окно с использованием маркера leaflet , и это выглядит следующим образом.

 const lat = e.latlng.lat;
   if ($('#lmap').css("cursor") === 'crosshair') {
      const note = `<div>popup<div>`;
      const newMarker = new L.marker(e.latlng,{draggable:true}).addTo(lmap);
      if (!(note === "")) {
         newMarker.bindPopup(note, {closeOnClick: false, autoClose: false, closeButton: true}).openPopup();
      }
   }
  

Здесь

 closeButton: true 
  

используется для отображения кнопки закрытия в моем всплывающем окне. Но проблема в том, что всплывающее окно закрывается, когда я также нажимаю на маркер. Как я могу предотвратить закрытие всплывающего окна при нажатии на маркер и просто закрыть его при нажатии на кнопку закрытия во всплывающем окне.

Ответ №1:

Не добавляйте всплывающее окно непосредственно в маркер, создайте всплывающий «слой» и откройте его при нажатии на маркер:

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


//your function from above
const newMarker = new L.marker(e.latlng,{draggable:true}).addTo(lmap);
newMarker.on('click',(e)=>{
    popup.options.offset = e.target.options.icon.options.popupAnchor;
    popup.setContent('TEST').setLatLng(e.target.getLatLng()).addTo(map)
})