Вызов функции вне листовки onEachFeature - PullRequest
Новая
       23

Вызов функции вне листовки onEachFeature

0 голосов
/ 05 мая 2020
• 1000 showflag как всплывающее окно с приятным предупреждением

Когда я объявляю и определяю его внутри onEachFunction, он отлично работает со следующим кодом 

$.getJSON("js/test/custom.geojson", function(data) {
    // Apply a popup event to each "Features" of the dataset
   L.geoJSON(data, {
        onEachFeature: function (feature, layer) {
            layer.on('click', function showFlag(){
                Swal.fire({
                    title: "You have selected",
                    icon: "info",
                    html: '<span class="flag-icon flag-icon-'+feature.properties.iso_a2.toLowerCase()+'"></span>'
                })
            });
        }
    }).addTo(map);
});

Но когда я определяю его вне кода, он работает не работает. Вместо этого он покажет предупреждение о первом появлении данных Geo JSON после загрузки скрипта и не будет реагировать на какие-либо события щелчка впоследствии. 

$.getJSON("js/test/custom.geojson", function(data) {
    // Apply a popup event to each "Features" of the dataset
   L.geoJSON(data, {
        onEachFeature: function (feature, layer) {
            layer.on('click', showFlag(feature.properties.iso_a2.toLowerCase()));
        }
    }).addTo(map);
});

function showFlag(flag) {
    Swal.fire({
        title: "You have selected",
        icon: "info",
        html: '<span class="flag-icon flag-icon-'+flag+'"></span>'
    })
}

Где я ошибся?

1 Ответ

1 голос
/ 05 мая 2020

измените свой код на: 

$.getJSON("js/test/custom.geojson", function(data) {
    // Apply a popup event to each "Features" of the dataset
   L.geoJSON(data, {
        onEachFeature: function (feature, layer) {
            layer.on('click', showFlag);
        }
    }).addTo(map);
});

function showFlag(e) {
    var layer = e.target;
    var flag = layer.feature.properties.iso_a2.toLowerCase();
    Swal.fire({
        title: "You have selected",
        icon: "info",
        html: '<span class="flag-icon flag-icon-'+flag+'"></span>'
    })
}
...