javascript - 传单路由机器的撤消/重做

Question

我正在尝试为使用传单和传单路由机的工具实现简单的撤消/重做功能。这是我的功能：

var activityBuffer = [];
var undoFlag = false;

Routing.on('routeselected', function(){
  if (undoFlag) {
     undoFlag = false;
  }
  else {
    var newWaypoints = Routing.getWaypoints();
    activityBuffer.push(newWaypoints);
    console.log(activityBuffer);
  }
});

function undoActivity(){
  var lastStateIndex = activityBuffer.length - 2
     if (lastStateIndex >= 0) {
        var oldState = activityBuffer[lastStateIndex];
        Routing.setWaypoints(oldState);
        activityBuffer.splice( activityBuffer.length -  1, 1);
        undoFlag = true;
        console.log(activityBuffer);
     }
}

如果我只添加更多点并触发 routeselected 事件，它工作正常，但问题是当我移动我的航点并且相同点的坐标发生更改时，该航点的 activityBuffer 中的条目也会自行更新，添加另一个一系列新的航点也被推送。为什么这样？

例如：

我希望我解释了我的问题。寻求帮助！

Answer 1

我认为问题在于 Leaflet Routing Machine 在某些情况下会改变（更改）现有的航点实例，而不是总是创建新的航点实例。例如，当拖动一个航点时，该航点的坐标在同一个实例中被覆盖。

由于您activityBuffer保存了对现有航点的引用，因此这些航点也会在 LRM 更新它们时更新。相反，存储航点的副本应该可以解决您的问题。

另请注意，严格来说，您应该存储传递给事件处理程序 ( routeselected) 的路径中的路点，而不是获取控件的路点 - 例如，当网络延迟较高时，这可能很重要。