turf.js: Буфер выполняется, но геоджон не добавляется на карту листовки - PullRequest
0 голосов
/ 03 октября 2018

div id называется буфером.когда пользователь нажимает на буфер, точки инцидентов буферизуются 1 милю

<div id="map2" class="col-md-4 well">
    <p>GeoDjango is da bomb</p>
    <button id="Highlands" class="form-control btn-primary">Highlands</button>
    <button id="buffer" class="form-control btn-warning">Buffer</button>
</div>

javascript

var incidences = new L.GeoJSON.AJAX("http://127.0.0.1:8000/incidence_data/", {
    onEachFeature: function (feature, layer) {
        //console.log(feature.properties);
        layer.bindPopup(feature.properties.name.toString())
    }
});
incidences.addTo(map);

var incidences2 = incidences.toGeoJSON();


$("#buffer").click(function () {
    if ($("#buffer").html() == 'Buffer') {
        var buff = turf.buffer(incidences2, 1, {'units': 'miles'});
        bufferLayer = L.geoJSON(buff).addTo(map);
        $("#buffer").html("Remove Buffer");
    } else {
        map.removeLayer(bufferLayer);
        $("#buffer").html("Buffer");
    }
});

Я не уверен, что буфер выполняется, потому что в консоли абсолютно ничего нет.

Я нашел этот вопрос, который очень похож на мой.https://gis.stackexchange.com/questions/285077/does-turf-js-work-with-geodjango

1 Ответ

0 голосов
/ 03 октября 2018

incidences2 должен быть создан только ПОСЛЕ incidences полностью загружен.

В качестве первой проверки попробуйте создать его чуть позже:

console.log("starting...");

const incidences = new L.GeoJSON.AJAX("http://127.0.0.1:8000/incidence_data/", {
    onEachFeature: function (feature, layer) {
        //console.log(feature.properties);
        layer.bindPopup(feature.properties.name.toString())
    }
});
incidences.addTo(map);

console.log("... not loaded yet!");

$("#buffer").click(function () {
    const incidences2 = incidences.toGeoJSON();
    console.log(incidences2);
    if ($("#buffer").html() == 'Buffer') {
        var buff = turf.buffer(incidences2, 1, {'units': 'miles'});
        console.log(buff);
        bufferLayer = L.geoJSON(buff).addTo(map);
        $("#buffer").html("Remove Buffer");
    } else {
        map.removeLayer(bufferLayer);
        $("#buffer").html("Buffer");
    }
});
...