¿Cómo actualizar un contenido emergente desde su marcador?


11

Creé una ventana emergente con Leaflet haciéndolo:

marker.bindPopup(content).openPopup();

¿Cómo puedo actualizar el contentvalor después?

Supongo que desde el marcador, algo como esto:

marker.updatePopup(newContent);

Respuestas:


9

Supongo que desea que el contenido cambie después de que ocurra algún evento, como mouseover, contextmenu o cualquier otra cosa.

Para hacerlo, puede usar el siguiente código:

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

Como puede ver, puede acceder a la ventana emergente para el marcador deseado usando el método marker._popup, y luego usar el método setContent para cambiar el texto dentro de él.

referencia del método popup.setContent

Aquí hay un código en Plunker que demuestra esto: http://plnkr.co/edit/vjS495QPXiJpKalrNpvo?p=preview


Descubrí que en el mouseover tenía que hacer: this.getPopup.setContent ('bla, bla, bla');
TheSteve0

15

_popuptiene un guión bajo delante para indicar que es una instancia privada / miembro, y no se debe acceder directamente. La API correcta es Layer.setPopupContent () . p.ej marker.setPopupContent(newContent);


3

Puede que sea tarde para responder, pero para otros, creo que la mejor manera es aquí

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

Sé que esto es antiguo, pero apareció en mis resultados de búsqueda de Google, lo que significa que también podría serlo para otros ... El problema con este método es que # 1 si la ventana emergente no está abierta actualmente, haga clic en ese botón (o lo que sea te unes a) no hace nada. En segundo lugar, si atenúa la ventana emergente y vuelve a hacer clic, obtendrá el contenido original, ¡no el nuevo contenido!
DR

1

Puede obtener el contenido emergente con:

marker.getPopup().getContent();

Establezca el contenido con:

marker.getPopup().setContent("123");
marker.getPopup().update();
Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.