谷歌地图api v3:为编辑后的多边形添加自定义撤消/重做功能

Google map api v3: Adding custom undo/redo function for edited Polygon

本文关键字:自定义 添加 撤消 功能 重做 多边形 v3 api 编辑 谷歌地图      更新时间:2023-09-26

我有一个功能,用户可以在谷歌地图上绘制多边形。多边形完成后,他可以编辑相同的多边形,但不能添加新的多边形。此外,一旦用户单击任何顶点,就会删除该节点。通常,在编辑多边形或任何形状时,都会显示默认的撤消按钮。但在我的情况下,我已经禁用了相同的功能,因为我需要一个自定义的撤消和重做按钮来做同样的事情。但我不知道我该怎么做。有人能帮我吗?

我的理论:在多边形完成时,我设置事件insert_at、set_at和单击,在其中设置编辑数组,以便跟踪所有编辑。单击撤消按钮后,我将最后一个元素从编辑数组中弹出,并将其添加到重做数组中,并将多边形路径设置为弹出元素的路径。下面是代码:

google.maps.event.addListener(drawingManager, 'polygoncomplete', function(polygon) {
    drawingManager.setDrawingMode(null);
    myArea = polygon;
    myArea.setOptions({ editable: true});
    google.maps.event.addListener(polygon.getPath(), 'set_at', function(ind) {
        edits_arr.push(polygon);            
    });
    google.maps.event.addListener(polygon.getPath(), 'insert_at', function(ind) {
        edits_arr.push(polygon);    
    });
    google.maps.event.addListener(polygon, 'click', function(e) {
        polygon.getPath().removeAt(e.vertex);
        edits_arr.push(polygon);    
    });
});

撤消点击:

$('#undo').click(function(){
    if(edits_arr.length > 0){
        var temp = edits_arr.pop();
        redo_arr.push(temp);
        var pathArrayTemp = temp.getPath();
        myArea.setMap(null); 
        myArea.setPaths(pathArrayTemp);
        myArea.setMap(map);
    }   
});

但所有这些似乎都不起作用。我知道我在这里错过了什么,但不知道是什么…:(

有人能帮我做这个吗?

您必须克隆redo_arr 的路径

在您的redo_arr中,一个对象的多个链接