Comment insérer un nouveau texte de ligne dans une popup


9

J'utilise Leaflet Marker Cluster et j'ai besoin d'afficher cinq lignes différentes dans une fenêtre contextuelle. Mais quand j'écris ceci, ils sont tous dans la même ligne. Quelqu'un peut-il m'aider à être l'un sous l'autre?

var a = addressPoints[i];
            var title = a[2];
            var univ = a[3];
            var direct = a[4];
            var city = a[5];
            var state = a[6];
            var marker = new L.Marker(new L.LatLng(a[0], a[1]), { title: title } );
            marker.bindPopup("Student: " + title + "University: " + univ + "Direction: " + direct + "City: " + city + "State: " + state);
            markers.addLayer(marker);
        }

    map.addLayer(markers);

Réponses:


17

Comme l'indique la documentation Leaflet , Marker#bindPopupprend une chaîne HTML comme premier paramètre.

Si vous souhaitez que vos lignes apparaissent sur des lignes différentes, vous devez ajouter le balisage HTML approprié. Dans votre cas, une liste de définitions semble la plus pertinente.

Par conséquent:

var list = "<dl><dt>Student</dt>"
           + "<dd>" + title + "</dd>"
           + "<dt>University</dt>"
           + "<dd>" + univ + "</dd>"
           + 

marker.bindPopup(list);
En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.