Как обновить всплывающий контент с его маркера?


11

Я создал всплывающее окно с Leaflet следующим образом:

marker.bindPopup(content).openPopup();

Как я могу обновить contentзначение после этого?

Я полагаю, сделать это из маркера, что-то вроде этого:

marker.updatePopup(newContent);

Ответы:


9

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

Для этого вы можете использовать следующий код:

//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перед ним подчеркивание, указывающее, что это экземпляр private / member, и к нему нельзя обращаться напрямую. Правильным 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, если всплывающее окно не открыто в данный момент, это нажатие кнопки (или любой другой Вы связываете с) ничего не делает. Во-вторых, если вы уменьшите размер всплывающего окна и снова щелкните по нему, вы получите оригинальный контент, а не новый контент!
DR

1

Вы можете получить всплывающее содержание с:

marker.getPopup().getContent();

Установите содержание с помощью:

marker.getPopup().setContent("123");
marker.getPopup().update();
Используя наш сайт, вы подтверждаете, что прочитали и поняли нашу Политику в отношении файлов cookie и Политику конфиденциальности.
Licensed under cc by-sa 3.0 with attribution required.