علامات النشرة لا تفتح النافذة المنبثقة عند النقر

Question

لقد بدأت للتو في استخدام Leaflet و مجموعة العلامات لتنظيم العلامات.

المشكلة رقم 1: عند النقر فوق علامة غير مجمعة، لا تظهر أي نافذة منبثقة.

المشكلة رقم 2: عند النقر فوق مجموعة عدة مرات، تظهر جميع العلامات الموجودة داخل تلك المجموعة، وعندما يتم النقر فوق إحدى هذه العلامة، تظهر النافذة المنبثقة الخاصة بها!ومع ذلك، بعد إغلاق النافذة المنبثقة من خلال النقر على الخريطة، فإن النقر على أي من هذه العلامات المجمعة لا يفتح أي نوافذ منبثقة!

إذا كان لدي فقط 3 علامات غير مجمعة، فإن النافذة المنبثقة تعمل بشكل جيد.ومع ذلك، مع إضافة المزيد من العلامات، بمجرد تشكيل مجموعة، فإن النقر على العلامة الموجودة داخل أي مجموعة لن يؤدي إلى فتح النافذة المنبثقة!

تهيئة مجموعة العلامات

markers = new L.MarkerClusterGroup();
map.addLayer(markers);

تمت إضافة جميع العلامات إلى مجموعة العلامات markers

حلقة تستدعي render وظيفة لإنشاء marker وإضافته إلى مجموعة Markclusterer markers. (تجاهل كود backbone.js)

ListingMarkerView = Backbone.View.extend({
    template: _.template( $('#tpl_ListingMarkerView').html() ),

    render: function() {

        // Create marker
        var content = this.template( this.model.toJSON() );
        var marker = new L.marker(
            [this.model.get('lat'), this.model.get('lng')],
            {content: content});
        marker.bindPopup(content);

        // Add to markerclusterer
        markers.addLayer(marker);
    }
});

بدون مجموعة علامات

إذا قمت بإضافة marker مباشرة الى map بدلاً من مصفوفة العلامات markers, ، النوافذ المنبثقة تعمل بشكل جيد، لذلك أعتقد أن المشكلة لها علاقة بـ Markclusterer.

هل فعلت شيئًا خاطئًا أدى إلى مثل هذا السلوك للنوافذ المنبثقة؟كل المساعدة موضع تقدير، وذلك بفضل!

Answer 1

من خلال القليل الذي أعرفه عن مجموعة علامات الكتلة، يجب عليك القيام بذلك:

var markerGroup = new L.MarkerClusterGroup();
markerGroup.on('click', function(ev) {
    // Current marker is ev.layer
    // Do stuff
});

لإضافة معالج حدث إلى طبقة المجموعة بدلاً من ذلك، قم بما يلي:

markerGroup.on('clusterclick', function(ev) {
    // Current cluster is ev.layer
    // Child markers for this cluster are a.layer.getAllChildMarkers()
    // Do stuff
});

أوه، وقراءة جيثب التمهيدي بعناية، كل شيء هناك.

Answer 2

تأكد من أن لديك الإصدارات الصحيحة من كل شيء في حزمة Leaflet + Clusterer (Js وCss).قارن مع الأمثلة الموجودة في Clusterer Github repo.