Wie aktualisiere ich einen Popup-Inhalt von seinem Marker?


11

Ich habe ein Popup mit Leaflet erstellt:

marker.bindPopup(content).openPopup();

Wie kann ich den contentWert anschließend aktualisieren ?

Ich nehme an, es vom Marker aus zu tun, so etwas:

marker.updatePopup(newContent);

Antworten:


9

Ich nehme an, Sie möchten, dass der Inhalt nach einem Ereignis geändert wird, z. B. Mouseover, Kontextmenü oder etwas anderes.

Dazu können Sie den folgenden Code verwenden:

//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')
});

Wie Sie sehen können, können Sie mit der Methode marker._popup auf das Popup für den gewünschten Marker zugreifen und dann den darin enthaltenen Text mit der Methode setContent ändern.

popup.setContent Methodenreferenz

Hier ist ein Code auf Plunker, der dies demonstriert: http://plnkr.co/edit/vjS495QPXiJpKalrNpvo?p=preview


Ich fand, dass ich im Mouseover Folgendes tun musste: this.getPopup.setContent ('bla bla bla');
TheSteve0

15

_popupVor ihm befindet sich ein Unterstrich, der angibt, dass es sich um eine private / Mitgliedsinstanz handelt, auf die nicht direkt zugegriffen werden sollte. Die richtige API ist Layer.setPopupContent () . z.B marker.setPopupContent(newContent);


3

Es könnte zu spät sein, um zu antworten, aber für andere denke ich, dass der beste Weg hier ist

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;
});

Ich weiß, dass dies alt ist, aber es wurde in meinen Google-Suchergebnissen angezeigt, sodass dies möglicherweise auch für andere gilt. Das Problem bei dieser Methode ist, dass # 1, wenn das Popup derzeit nicht geöffnet ist, auf diese Schaltfläche klickt (oder was auch immer) Sie binden an) tut nichts. Zweitens, wenn Sie das Popup verkleinern und erneut darauf klicken, erhalten Sie den ursprünglichen Inhalt, nicht den neuen Inhalt!
DR

1

Sie können den Popup-Inhalt erhalten mit:

marker.getPopup().getContent();

Stellen Sie den Inhalt ein mit:

marker.getPopup().setContent("123");
marker.getPopup().update();
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.