Edit a shapefile with Leaflet.pm

Question

I am new to Leaflet but so far so good. I managed to add the plugins I needed and they work. Except the shapefile editing.

I am using leaflet.pm to draw, snap, cut polygons (only polygons). I also use the Leaflet.shapefile to upload a shapefile in my map and convert it as a GeoJson. All of this works. My shapefile uploads perfectly and I can see my polygons. However, the editing does not. I tried to follow this post and comments associated without success.

I also followed this post but I am clearly stucked. I turned this in every directions I could tink off.

I saw in leaflet.pm page the part about editing but I am not sure how to use it / adapt it to my uploaded file.

This is my code: https://codepen.io/mscfourn/pen/YRZebJ

Can someone put me in the right direction using the edit mode of leaflet.pm?

PS: I checked the similar questions, they concern the plugin leaflet.draw, so I apologize in advance if you consider this as a duplicate.

Answer 1

map.on('pm:edit', function (e) {

should be drawnItems.on('pm:edit', function (e) {

e is not very helpful without a lot of work. It does not contain the ID of the shape being edited nor does it contain the selected vertex. You would have to compare the e._layers to an earlier copy to get meaningful data.

Answer 2

what you have to do is ; First you will need to activate the edit mode.

{ map.pm.toggleGlobalEditMode();}

Then do the following to get the next layer after editing

map.on('pm:create', e => {
   var type = e.shape,
    layer = e.layer;
    
  layer.on('pm:edit', e=>{
      console.log(e.layer)
  })

})