Leaflet: Dokumentation zum Auffüllen von Popup-Inhalten über Ajax

Wenn Sie ein Popup explizit erstellen, können Sie den Inhalt festlegen:

var popup = new L.Popup();
popup.setLatLng(latlng);
popup.setContent('seme content');
map.openPopup(popup);

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

Hören Sie sich also das 'click'-Ereignis auf Ihren Markern an (Sie können dies in der MarkerClusterGroup einstellen). Wenn es dann ausgelöst wird, erstellen Sie ein Popup mit einer Ladenachricht, laden den Inhalt über Ajax und setzen ihn dann hinein, wenn er zurückkommt.

var group = new L.MarkerClusterGroup();
group.on('click', showMarker);

function showMarker(marker) {
//use marker.layer for the marker IIRC
//Create popup here and fetch content
}

Ich hoffe, das hilft!

Danke, ich werde das studieren und umsetzen!

Dies wurde bei Google gut referenziert, also hier für Leute, die suchen:

• Sie müssen kein Popup manuell erstellen und map.openPopup aufrufen; Wenn Sie einen Marker haben, können Sie bindPopup() und getPopup() verwenden, wenn Sie möchten.
• Vergessen Sie nicht, popup.update() http://leafletjs.com/reference.html#popup -update aufzurufen

Hier ist ein funktionierendes Beispiel mit Merkblatt 0.7.3:

var marker = L.marker([48.859085, 2.347403]);
marker.bindPopup("Loading...")
marker.on('click', function(e) {
    var popup = e.target.getPopup();
    var url="DYNAMIC_CONTENT_URL";
    $.get(url).done(function(data) {
        popup.setContent(data);
        popup.update();
    });

Beachten Sie, dass Sie auch eine Funktion an bindPopup() . Es wird aufgerufen, wenn das Popup geöffnet wird und muss ein String oder HTMLElement . Also eine andere Version Ihres Codes (die nicht vorgibt, welcher Ereignistyp das Öffnen des Popups verursacht):

var marker = L.marker([48.859085, 2.347403]);
marker.bindPopup(function() {
    var el = $('<div/>');

    $.get("DYNAMIC_CONTENT_URL").done(function(data) {
        el.setContent(data);
        popup.update();
    });

    return el;
});

Hat jemand ein Live-Arbeitsbeispiel dafür, das er gerne teilen würde?

Hier ist ein Plunkr-

http://plnkr.co/edit/ps1MNhUMMO7vZCnQN7Cg?p=preview

@chriszrc das hat mir viel Ärger

@chriszrc Kann die JSON-Daten von einer API nicht verwenden.

Es wird kein Popup angezeigt.

Beispieldaten sehen so aus:
{"datapoint":[{"intensity":92,"latitud":"18.52","longitud":"82.4767"},{"intensity":68,"latitud":"17.7375","longitud":"82.8347"}]}

Ich versuche, die Intensität im Popup anzuzeigen.

Das habe ich versucht:

```
marker.bindPopup((popup)=>{
var el = document.createElement('div');
el.classList.add("meine-Klasse");
$.getJSON(" http://www.example.com/data ",function(datapoint){
el.innerHTML = '

' + Datenpunkt[i].Intensität + '

 return el;

@kunaldhariwal Sie müssen einen Plunkr oder so posten, was ohne Beispiel unmöglich zu sagen ist. Für den Anfang scheint die URL, die Sie das Code-Snippet laden ("http://www.example.com/data"), jedoch kein gültiges json- zurückzugeben.

@chriszrc Das ist jedoch eine Beispiel-URL. Aus einigen offensichtlichen Gründen kann ich die genaue URL nicht preisgeben.
Es tut mir leid, aber ich werde versuchen, etwas herauszufinden.