Нажмите События с Leaflet и geoJSON

18

Как мне прикрепить событие click к geoJSON, который затем выполняет функцию Ajax при нажатии. Я посмотрел, onEachFeatureно он выполняется при загрузке geoJSON, а не при нажатии, таким образом, выполняя тонну вызовов ajax!

Бретт Каллен
источник

Ответы:

22

Вы были на правильном пути с onEachFeature.

Просто вам нужно привязать событие клика по каждому элементу.

Смотрите ниже (проверено)

function whenClicked(e) {
  // e = event
  console.log(e);
  // You can make your ajax call declaration here
  //$.ajax(... 
}

function onEachFeature(feature, layer) {
    //bind click
    layer.on({
        click: whenClicked
    });
}

geojson = L.geoJson(your_data, {
    style: style,
    onEachFeature: onEachFeature
}).addTo(map);
ThomasG77
источник
8

Вы можете сделать это с немного меньшим количеством кода, чем версия ThomasG77:

function onEachFeature(feature, layer) {
    //bind click
    layer.on('click', function (e) {
      // e = event
      console.log(e);
      // You can make your ajax call declaration here
      //$.ajax(... 
    });

}

geojson = L.geoJson(your_data, {
    style: style,
    onEachFeature: onEachFeature
}).addTo(map);
Стив Беннетт
источник
3

просто как встроенная функция

geojson = L.geoJson(your_data, {
style: style,
onEachFeature: function onEachFeature(feature, layer) {

layer.on('mouseover', function (e) {
  // e = event
  console.log(e);
  // You can make your ajax call declaration here
  //$.ajax(... 
  });}).addTo(map);
hoogw
источник