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

Escape to cancel halfway through dragging a box?

Open tenznhok opened this issue 6 years ago • 1 comments

Is there a way I can escape/ cancel the drawing using the ESC key while I am half way dragging a rectangle/ circle?

tenznhok avatar Jan 26 '18 21:01 tenznhok

Yes there is

const cancelDrawing = (event) => {
	if (map.editTools.drawing()) {
		map.editTools.stopDrawing();

		// TODO Remove the component
		map.editTools._drawingEditor.feature.remove();

		if (event) {
			event.preventDefault();
		}
	}
};

document.addEventListener('keyup', (event) => {
	if (event.key === 'Escape') {
		cancelDrawing();
	}
});

Note map.editTools._drawingEditor.feature.remove(); is a little bit of a hack as it is accessing an "internal" object (starting with a _), so it may break. Calling the associate start edit function will return the feature being drawn, so you could store that in a variable to track what feature is being drawn.

feature = map.editTools.startPolyline();

const cancelDrawing = (event) => {
	if (map.editTools.drawing()) {
		map.editTools.stopDrawing();

		// TODO Remove the component
		feature.remove();
		feature = null;

		if (event) {
			event.preventDefault();
		}
	}
};

bytesnz avatar Sep 01 '22 00:09 bytesnz