Leaflet: توثيق كيفية تعبئة محتويات النوافذ المنبثقة عبر ajax

إذا قمت بإنشاء نافذة منبثقة بشكل صريح ، فيمكنك تعيين المحتوى:

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

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

لذا استمع إلى حدث "النقر" على علاماتك (يمكنك ضبط هذا على MarkerClusterGroup). ثم عندما يتم إطلاقه ، تقوم بإنشاء نافذة منبثقة تحتوي على رسالة تحميل ، وتحميل المحتوى عبر ajax ، ثم ضبط المحتوى بالداخل عندما يعود.

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
}

امل ان يساعد!

شكرًا ، سأدرس هذا وأنفذ!

تمت الإشارة إلى هذا جيدًا على Google ، لذا إليك ما يبحث عنه الأشخاص:

• ليس عليك إنشاء نافذة منبثقة يدويًا واستدعاء map.openPopup ؛ إذا كان لديك علامة ، يمكنك استخدام bindPopup () و getPopup () إذا كنت تريد.
• لا تنسى استدعاء popup.update () http://leafletjs.com/reference.html#popup -update

إليك مثال عملي مع النشرة 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();
    });

لاحظ أنه يمكنك أيضًا تمرير دالة إلى bindPopup() . سيتم استدعاؤه عند فتح النافذة المنبثقة ويجب إعادة String أو HTMLElement . إذن ، إصدار آخر من التعليمات البرمجية (لا يحدد نوع الحدث الذي يتسبب في فتح النافذة المنبثقة):

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

هل لدى أي شخص مثال عملي حي على هذا يرغب في مشاركته؟

ها هو plunkr-

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

chriszrc أنقذني الكثير من المتاعب. شكرا يا رجل

chriszrc غير قادر على القيام بذلك باستخدام بيانات JSON من واجهة برمجة التطبيقات.

لا تظهر نافذة منبثقة.

تبدو البيانات النموذجية على النحو التالي:
{"datapoint":[{"intensity":92,"latitud":"18.52","longitud":"82.4767"},{"intensity":68,"latitud":"17.7375","longitud":"82.8347"}]}

أحاول عرض الكثافة في النافذة المنبثقة.

هذا ما جربته:

""
marker.bindPopup ((منبثقة) => {
var el = document.createElement ('div') ؛
el.classList.add ("صفي") ؛
$ .getJSON (" http://www.example.com/data " ، وظيفة (نقطة بيانات) {
el.innerHTML = '

"+ نقطة بيانات [i]. كثافة +"

 return el;

kunaldhariwal ، ستحتاج إلى نشر plunkr أو شيء من هذا القبيل ، من المستحيل قول ذلك بدون مثال. بالنسبة للمبتدئين ، لا يبدو أن عنوان url الذي تقوم بتحميل مقتطف الشفرة ("http://www.example.com/data") يعرض json- صالحًا

chriszrc هذا مثال على URL بالرغم من ذلك. لبعض الأسباب الواضحة لا يمكنني الكشف عن عنوان url الدقيق.
أنا آسف ولكني سأحاول اكتشاف شيء ما.