OpenLayers v3.5.0 does not easily support the feature you're looking for, but there is a feature currently in development that you can use.
On ol.interaction.Draw, you can specify an ol.interaction.DrawGeometryFunctionType function to handle updates to the current geometry.
An example I've written up is shown below:
var geometryFunction = function (c, g) {
if (goog.isDef(g)) {
g.setCoordinates(c);
} else {
g = new ol.geom.Polygon(c);
}
if (c[0].length > ct) {
console.log('mouse click coord : ' + c[0][c[0].length - 1]);
ct = c[0].length;
} else {
console.log('mouse move coord : ' + c[0][c[0].length - 1]);
}
return g;
}
This is pretty much what the default geometryFunction function does, without the new point identification and console logging.
A fully functional example is here: http://jsfiddle.net/1a948faa/2/
Note the following caveats:
- You will have to implement a separate function, or case for different geometry types.
- The code is currently still in development and is thus not stable. In addition it is subject to change at any time.
Since OpenLayers 3.9.0, this is as simple as using the removeLastPoint method of the DrawInteraction. So you can do something like this:
document.addEventListener('keydown', function(e) {
if (e.which == 27)
draw_interaction.removeLastPoint()
});
Best Answer
You can use something like this -
Note that you need to
vectorSource.getFeatures()every time you want to remove the last feature or use it in a function.