Leaflet.Editable icon indicating copy to clipboard operation
Leaflet.Editable copied to clipboard

How to stop edit and remove marker/line/polygon?

Open robertd opened this issue 9 years ago • 11 comments

What's the best way to cancel out of current edit and remove any marker/line/polygon created? I've tried map.editTools.stopDrawing(); but that doesn't remove markers it just stops editing.

edit:

I guess my question is how to stop the workflow and clear uncommitted edits...

robertd avatar Aug 19 '15 22:08 robertd

Humm, you have more than one option. It depends how you use the API. Basically, I'd say calling cancelDrawing sounds good, then listening for editable:drawing:cancel, and doing someting like e.layer.remove() in the callback.

Does that help?

yohanboniface avatar Aug 23 '15 14:08 yohanboniface

I can't seem to find map.editTools.cancelDrawing()... would you mind providing a github gist?

Thanks

robertd avatar Aug 24 '15 20:08 robertd

Sorry, I meant stopDrawing just like you've done, and then listening for editable:drawing:cancel event.

yohanboniface avatar Aug 24 '15 20:08 yohanboniface

Hmm... I've tried that too, but e.layer.remove() doesn't exist.

robertd avatar Aug 24 '15 20:08 robertd

humm, yeah, sorry, it depends which version of Leaflet your are using, e.layer.remove is only on latest beta. On 0.7.3, you need to do something like e.layer.removeFrom(e.editTools.editLayer). Note that it's just pure Leaflet here, no Editable specifics.

yohanboniface avatar Aug 25 '15 05:08 yohanboniface

I'm having a similar issue. Your suggestion didn't work for me because e.layer doesn't have a removeFrom method. However, I changed it so that my editable:drawing:cancel handler calls map.removeLayer(e.layer). If the user is in the middle of drawing a new polygon this will allow the user to cancel the operation and remove their current edit.

However, this doesn't work if the user is drawing a new hole in a polygon. This method will remove the polygon that the new hole is a part of. Is there a way to cancel the drawing of a new polygon?

I am using Leaflet.Editable 0.6.2 and Leaflet 0.7.7.

etrochim avatar Dec 07 '15 15:12 etrochim

I was having a similar issue, and none of the suggestions worked for me. The solution from @etrochim got me close, but I was getting the editable:drawing:cancel event fired twice.

The solution for me was to listen for the editable:drawing:end event instead, as this is fired after editable:drawing:cancel.

This is because map.removeLayer(e.layer) in the callback for editable:drawing:cancel was firing off a remove event which in turn causes L.Editable.BaseEditor to call its disable function. This disable call will cancel the drawing and fire off editable:drawing:cancel for the same layer & will try and delete a layer that doesn't exist anymore.

Why does this fix work? At the point editable:drawing:cancel is called, Editable thinks it is drawing (this.drawing = true). It will wait for all event listeners to complete before stopping drawing. The problem is that calling map.removeLayer(e.layer) triggers another editable:drawing:cancel event (and therefore calls our listener again). During both calls, Editable still thinks it is drawing (this.drawing = true) and will try and clear layers that don't exist.

By listening to editable:drawing:end instead, after the first execution Editable knows it is not drawing anymore (this.drawing = false), so when it gets called a 2nd time it doesn't try and remove any layers as it knows they don't exits.

Note: I'm also using Leaflet.Editable 0.6.2 and Leaflet 0.7.7.

adamtomat avatar Jul 27 '16 10:07 adamtomat

from click event, for markers , "e.target.remove()" works

chocho11 avatar Oct 18 '17 12:10 chocho11

hai i am currently remove the polygons in the map but i cant able to remove the markers in the polygons

srinathS-tvsnext avatar Oct 14 '19 11:10 srinathS-tvsnext

hai i am currently remove the polygons in the map but i cant able to remove the markers in the polygons

how you do it? please help!

Nightwelf avatar Oct 30 '19 06:10 Nightwelf

Prob not the best way to do it, but using a global variable worked for me:

var ACTIVE_LAYER = null; LEAFLET_MAP.on('editable:drawing:commit', function (event) { ACTIVE_LAYER = event.layer; });

And then in a button:

function cancelDrawing() { ACTIVE_LAYER.remove(); }

ardicoetzee avatar Apr 26 '23 08:04 ardicoetzee