Использование прототипа с созданием карты листовки: ошибка с функцией onEachFeature - PullRequest
Новая
       26

Использование прототипа с созданием карты листовки: ошибка с функцией onEachFeature

1 голос
/ 25 марта 2019

У меня есть следующий код, который я вызываю, чтобы создать объект копирования карты и инициализировать карту Leaflet.Это работает и загружается правильно.Однако функции onEachFeature и / или clickFeature работают неправильно. 

var map = {
    mapUrl: "",
    maxZoom: 18,
    minZoom: 2,
    map: L.map('worldMap').setView([51.505, -0.09], 2),
    create: function(values) {
        var instance = Object.create(this);
        Object.keys(values).forEach(function(key) {
        instance[key] = values[key];
        });
        return instance;
    },
    initLeafletMap: function() {
        L.tileLayer(this.mapUrl, {
            attribution: '',
            maxZoom: this.maxZoom,
            minZoom: this.minZoom,
            id: 'mapbox.streets'
        }).addTo(this.map);
        //add continents' outlines
        $.getJSON("/static/continents.json", 
           (function(style, onEachFeature, map) {
                return function(continents) {
                    console.log(typeof(continents));
                    L.geoJson(continents, {
                        style: style,
                        onEachFeature: onEachFeature
                    }).addTo(map);
                };
            }(this.style, this.onEachFeature, this.map))
       );
    },
    style: function() {
        return {
            weight: 2,
            opacity: 1,
            color: 'beige',
            dashArray: '3',
            fillOpacity: 0
        };
    },
    onEachFeature: function(feature, layer) {
        layer.on({
            click: this.clickFeature
        });
    },
    clickFeature: function(e) {
            do something here();
    },

Поэтому, когда я нажимаю на карту, я знаю, что вызывается функция onEachFeature, но она не вызывает clickFeature.Вместо этого я получаю эту ошибку в консоли: 

leaflet.js:5 Uncaught TypeError: Cannot read property 'call' of undefined
    at e.fire (leaflet.js:5)
    at e._fireDOMEvent (leaflet.js:5)
    at e._handleDOMEvent (leaflet.js:5)
    at HTMLDivElement.r (leaflet.js:5)

1 Ответ

0 голосов
/ 26 марта 2019

Скорее всего, просто необходимо связать контекст this, когда вы передаете свой метод onEachFeature в качестве аргумента вашего IIFE для построения обратного вызова к вашему вызову AJAX: 

this.onEachFeature.bind(this)

См. Также Событие щелчка маркером листовки работает нормально, но методы класса не определены в функции обратного вызова

Кстати, вы также можете прикрепить прослушиватель событий щелчка непосредственно к группе слоев Leaflet GeoJSON вместо того, чтобы делать это для каждого дочернего слоя.

...