OpenLayers 3 – Draw Interaction Vertex Add Event in OpenLayers

javascriptopenlayers

I am trying to implement an undo/redo functionality during drawing a fetaure using the draw interaction. For the modify interaction I was able to to do it using the 'modifyend' event. like so:

modifyInteraction.on('modifyend',function(e){ 
}

while for the draw interaction no such events exist.
'drawend' event fires when finishing my drawing. But I need to trace all the vertices drawn in the meantime.
For the time being I came up with this:

myapp.Editor.editDraw = new ol.interaction.Draw({
    source: myapp.Editor.PseudoEditLyr.getSource(),
    type: type,/** @type {ol.geom.GeometryType} */ 
    style: drawStyle,
    condition : function(e){
        //fires the mousedown event while drawing
        console.log("e.browserEvent.type",e.browserEvent.type);
        if (myapp.Editor.editSketch ){
        myapp.Editor.checkAndPushUndo(myapp.Editor.editSketch);
        }
        return true;//always return true but need to listen for the mousedown event
    }
    });

Which does the job but this is not elegant, as it trace the 'mousedown' event and not the 'vertexadd'.

Do any of you have any idea?

Best Answer

Using some code out of Openlayers drawing interaction geometryFunction and with a little bit of imagination I ended up with the following, which is not perfect but it is more elegant than the one I allready have.

var coords_length = 0;
myapp.Editor.editDraw = new ol.interaction.Draw({
    source: myapp.Editor.PseudoEditLyr.getSource(),
    type: type,/** @type {ol.geom.GeometryType} */ 
    style: drawStyle,
    geometryFunction: function(coords, geom) {
    if (type === "Polygon"){
        if (!geom) {
            geom = new ol.geom.Polygon(null);
        }        
        geom.setCoordinates(coords);
        //if coords is changing
        if(coords[0].length !== coords_length){
            //set the new length
            coords_length = coords[0].length;
            console.log("polyogn geom changing. You may fire the undo action here!!!!   "+coords_length);
            if (myapp.Editor.editSketch ){
            myapp.Editor.checkAndPushUndo(myapp.Editor.editSketch);
            }
        }
    }
    if (type === "LineString"){
        if (!geom) {
            geom = new ol.geom.LineString(null);
        }        
        geom.setCoordinates(coords);
        if(coords.length !== coords_length){
            //set the new length
            coords_length = coords.length;
            console.log("line geom changing. You may fire the undo action here!!!!   "+coords_length);
            if (myapp.Editor.editSketch ){
            myapp.Editor.checkAndPushUndo(myapp.Editor.editSketch);
            }
        }
    }
    return geom;
    }

    });
Related Question