Як оновити вміст спливаючого вікна з його маркера?


12

Я створив спливаюче вікно з Leaflet так:

marker.bindPopup(content).openPopup();

Як я можу потім оновити contentзначення?

Я гадаю, що робити це з маркера, приблизно так:

marker.updatePopup(newContent);

Відповіді:


10

Я припускаю, що ви хочете, щоб зміст було змінено після того, як відбулася якась подія, як-от миша, контекстування чи щось інше.

Для цього можна використовувати наступний код:

//marker creation
var marker = L.marker([44.63, 22.65]).bindPopup('something').addTo(map);
marker.openPopup();

//changing the content on mouseover
marker.on('mouseover', function(){
    marker._popup.setContent('something else')
});

Як бачите, ви можете отримати доступ до спливаючого вікна потрібного маркера за допомогою методу marker._popup, а потім скористатися методом setContent для зміни тексту всередині нього.

посилання на метод popup.setContent

Ось код Plunker, який демонструє це: http://plnkr.co/edit/vjS495QPXiJpKalrNpvo?p=preview


Я виявив, що в режимі миші мені потрібно було зробити: this.getPopup.setContent ('бла-бла-бла');
TheSteve0

15

_popupперед ним є підкреслення, що вказує на те, що це приватний / членський екземпляр, і до нього не можна звертатися безпосередньо. Правильний API - Layer.setPopupContent () . напр marker.setPopupContent(newContent);


3

Можливо, запізнитись відповісти, але для інших, я думаю, найкращі способи є тут

http://jsfiddle.net/cPTQF/

$('button').click(function() {
   // Update the contents of the popup
   $(popup._contentNode).html('The new content is much longer so the popup should update how it looks.');

   // Calling _updateLayout to the popup resizes to the new content
   popup._updateLayout();

   // Calling _updatePosition so the popup is centered.
   popup._updatePosition();
   return false;
});

Я знаю, що це давнє, але воно з’явилося в моїх результатах пошуку Google, а це означає, що це може бути і для інших ... Проблема з цим методом полягає в тому, що №1, якщо спливаюче вікно зараз не відкрите, натисніть цю кнопку (або будь-що інше ти прив’язуєшся) нічого не робить. По-друге, якщо зменшити розмір спливаючого вікна і натиснути його ще раз, ви отримаєте оригінальний вміст, а не новий вміст!
ДР

1

Ви можете отримати спливаючий вміст за допомогою:

marker.getPopup().getContent();

Встановіть вміст за допомогою:

marker.getPopup().setContent("123");
marker.getPopup().update();
Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.