Question

-5

How to edit loaded geoJson with Leaflet

rated 0 times [ 1] [ 6] / answers: 1 / hits: 5990 / 8 Years ago, sat, may 21, 2016, 12:00:00

I want to retrieve polygon data from a database, then edit it. I can retrieve the polygons (stored as geojson), but cannot make them editable. How can I do this?

    var drawnItems = new L.FeatureGroup();

    map.addLayer(drawnItems);



    var drawControl = new L.Control.Draw({

        edit: {

            featureGroup: drawnItems

        }

    });

    map.addControl(drawControl);



    map.on('draw:created',function(e) {

    e.layer.addTo(drawnItems);

    });



    L.control.layers(baseLayers).addTo(map);    



    var oldPolygon = null;

    function showOnMap(rowid){

    if(oldPolygon != null){

    map.removeLayer(oldPolygon);

    }



    $.get(testdbextract.php?show=+rowid,function(data){

        var newPolygon = L.geoJson(data);

        newPolygon.addTo(drawnItems); // or drawnItems.addLayer(newPolygon);

        oldPolygon = newPolygon;

        }); 

    }

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

korbindarrionh

Add To Favorites

Follow

Total Points: 598

Total Questions: 113

Total Answers: 104

Location: Burundi

Member since Wed, Nov 25, 2020

4 Years ago

answered 8 Years ago tayla · Accepted Answer

In your example, you need to parse the geojson data you receive, create layers and initialize drawnItems

To make it easier you can create a GeoJson layer like this:

// Create a GeoJson layer without adding it to the map

L.geoJson(geojsonFeatures, {

  onEachFeature: onEachFeature

});



// Take advantage of the onEachFeature callback to initialize drawnItems

function onEachFeature(feature, layer) {

  drawnItems.addLayer(layer);

}

Here is an example

In your code, it could be used like that

$.get(testdbextract.php?show=+rowid,function(data){

   L.geoJson(data, {

      onEachFeature: onEachFeature

   });

});