Leaflet.js : Ouvrir toutes les bulles au chargement de la page

Question

J'essaie de comprendre, à partir de la documentation Leaflet.js, comment il serait possible d'ouvrir plus d'une fenêtre contextuelle lors de l'affichage de la page. Par exemple, si l'on a trois marqueurs (chacun représentant un bâtiment), la fenêtre contextuelle de chacun d'entre eux s'ouvrirait immédiatement.

http://leaflet.cloudmade.com/reference.html#popup

dit cryptiquement :

"Utilisez Map#openPopup pour ouvrir des fenêtres contextuelles tout en veillant à ce qu'une seule fenêtre contextuelle soit ouverte à la fois (recommandé pour la convivialité), ou utilisez Map#addLayer pour en ouvrir autant que vous le souhaitez."

mais

http://leaflet.cloudmade.com/reference.html#map-addlayer

ne donne aucune indication sur la manière d'y parvenir.

Quelqu'un peut-il préciser si cela est possible et donner des indications sur la manière de procéder ?

Answer 1

Vous devez ajouter les fenêtres contextuelles en tant que couche. Essayez avec ce code d'exemple :

var popupLocation1 = new L.LatLng(51.5, -0.09);
var popupLocation2 = new L.LatLng(51.51, -0.08);

var popupContent1 = '<p>Hello world!<br />This is a nice popup.</p>',
popup1 = new L.Popup();

popup1.setLatLng(popupLocation1);
popup1.setContent(popupContent1);

var popupContent2 = '<p>Hello world!<br />This is a nice popup.</p>',
popup2 = new L.Popup();

popup2.setLatLng(popupLocation2);
popup2.setContent(popupContent2);

map.addLayer(popup1).addLayer(popup2);

Answer 2

L.Map = L.Map.extend({
    openPopup: function(popup) {
        // this.closePopup(); 
        this._popup = popup;
        return this.addLayer(popup).fire('popupopen', {
            popup: this._popup
        });
    }
});

ejemplo: http://jsfiddle.net/paulovieira/yVLJf/

l'a trouvé ici : https://groups.google.com/forum/#!msg/leaflet-js/qXVBcD3juL4/4pZXHTv1baIJ

Answer 3

marker.addTo(myMap).bindPopup('Hello popup', {autoClose:false}).openPopup();

utiliser l'option autoClose

Answer 4

La solution la plus simple consiste à supprimer le lien popup de l'objet carte à l'ouverture :

map.on('popupopen', function (e) {
    delete map._popup;
});

Answer 5

Dans la dernière version, il existe une option de fermeture automatique.

Pour que le marqueur et la fenêtre contextuelle soient ouverts en même temps, sans ajouter de calques de manière explicite :

var popup1 = new L.Popup({'autoClose':false});
popup1.setLatLng([53.55375, 9.96871]);
popup1.setContent('First popup');

var popup2 = new L.Popup({'autoClose':false});
popup2.setLatLng([53.552046, 9.9132]);
popup2.setContent('Second popup');

L.marker([53.55375, 9.96871]).addTo(myMap)
    .bindPopup(popup1).openPopup();

L.marker([53.552046, 9.9132]).addTo(myMap)
    .bindPopup(popup2).openPopup();