OpenLayers 3 removeLayer 失败？

Question

我一直在将 OpenLayers 2 地图应用程序转换为 OpenLayers 3。该地图由 Javascript 代码中定义的两个图层组（基础地图和叠加层）组成。但是，当页面加载（或自动刷新）时，它会从 XML 文件中读取并动态地将要素图层加载到地图中。

那部分工作正常。我遇到的问题是例程，作为页面 auto-refresh 功能的一部分，应该删除所有 dynamically-added 层。

我的原码：

function erase_and_reload(){
  console.log("erase_and_reload has fired!");
  map.getLayers().forEach(function(layer){
   console.log("Existing layer that needs to be removed ?:");
   console.log(layer);
   
     var name = layer.get('name');
     var title = layer.get('title');
     console.log("layer name = " + name  + "   layer title = " + title);
          
     if (name){
      console.log("Found layer named = " + name);
      console.log("Removing layer named: " + name);
      map.removeLayer(layer);
     }
     
     
    });

// reload
 read_WW_xml();
}

（是的，我在这里有一个 console.log 条目的日志来尝试解决问题。）

所以，如果我运行这个 as-is... "Existing layer that needs to be removed?" 的日志条目被写入 10 次，这表明有 10 层。当我查看图层 objects 时，我看到了基础地图、叠加层和其他一些图层。但实际上确实具有 "name" 属性的某些其他层完全缺失。

但是如果我运行这行 "map.removeLayer(layer)" 注释掉了，现在 "Existing layer" 行被写了 17 次！还有七层objects出现！

(仅供参考：短语 "title" 仍然存在，因为起初我认为问题与 'name' 属性有关，所以我暂时尝试匹配'title' 属性而不是...“如果标题不是 'Base maps' 或 'Overlays'，则 removeLayer。但其行为方式完全相同。）

即使 .removeLayer 无法删除层，我想我不确定为什么这一切都会以某种方式中止循环 7 次迭代......到它甚至不写前两个的地步console.logs ??

谢谢！

-=戴夫=-

Answer 1

你可以试试

function erase_and_reload(){
   map.getOverlays().clear();
   map.getLayers().clear();

   // reload
   read_WW_xml();
}

Answer 2

它实际上并没有中止这 7 次迭代，它只是跳过了那些数组项。

在您的 forEach 循环中有一组对地图图层的引用。如果您获取该数组的一个元素（引用为 "layer"）并按原样将其从地图中删除，则删除该引用，因此它既不在地图中也不在您的数组中，并且不小心还有另一个引用在该索引上。

所以如果你有数组：

0: layer0, 名称 "layer0"

1:layer1,名称"layer1"

2: 层 2

在这个 forEach 之后将保留

0: layer1, 名称 "layer1"

1: 层 2

因为在移除 layer0 之后，在索引 0 上有 layer1 并且在 forEach 移动之后（到索引 1），它已经找到没有名称的层。

要解决这个问题，只需使用函数 getArray() 和 slice()（复制引用数组），例如：

var refArray = map.getLayers().getArray().slice();
ref.forEach(function(layer)
{
  //your stuff
}

OpenLayers 3 removeLayer 失败？

OpenLayers 3 removeLayer failure?

javascript

openlayers-3