需要在OL3中克隆图层

Question

如何在 OL3 中克隆图层？

目前我尝试这样做，但它给了我一个不同的对象，具有真实 ol.layer 的不同方面。就像您在内部控制台日志中看到的那样，我丢失了该层的实例，保留它对我来说很重要。

<!DOCTYPE html>
<html>
  <head>
    <link rel="stylesheet" href="https://openlayers.org/en/v3.20.1/css/ol.css" type="text/css">
    <!-- The line below is only needed for old environments like Internet Explorer and Android 4.x -->
    <script src="https://cdn.polyfill.io/v2/polyfill.min.js?features=requestAnimationFrame,Element.prototype.classList,URL"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <script src="https://openlayers.org/en/v3.20.1/build/ol.js"></script>
   
  </head>
  <body>
    <div id="map" class="map" tabindex="0"></div>
    <script>
      var map = new ol.Map({
        layers: [
          new ol.layer.Tile({
            source: new ol.source.OSM()
          })
        ],
        target: 'map',
        view: new ol.View({
          center: [0, 0],
          zoom: 2
        })
      });
      console.log("map layer is an instanceof ol.layer.tile? ", map.getLayers().getArray()[0] instanceof ol.layer.Tile)
      
      function cloneLayer() {
         map.getLayers().getArray().forEach(function(layer) {
            var copyLayer = jQuery.extend(true, {}, layer);
            console.log("CopyLayer is an instanceof ol.layer.tile? ", copyLayer instanceof ol.layer.Tile)
            console.log("CopyLayer is equal to mapLayer? ", map.getLayers().getArray()[0] == copyLayer)
         });
      }
      
      cloneLayer()

    </script>
  </body>
</html>

Answer 1

我对 OL3 不熟悉，但也许你可以尝试使用你原来的对象作为新对象的原型

var copyLayer = Object.create(layer.prototype)

Answer 2

我正在寻找一种情况，您需要克隆一个图层，但我没有找到。

ol3 中的许多其他类有他们的方法 clone 可以做到这一点。克隆图层涉及复制您的源，它具有功能和许多其他对象。

jQuery.extend 适用于 DOM 元素，适用于 DOM 个对象，see docs 适用于作为自定义实例的复杂对象类, prototyped 类, 就像所有的 ol 类一样，克隆一个对象比迭代它的属性并复制每个对象要复杂得多。

所以，如果您需要另一个具有相同特征的图层，我建议您创建一个新图层并复制他们的选项。

或者，如果你能解释一下你需要克隆一个层的情况，也许我们可以有一个替代方案。

需要在OL3中克隆图层

Need to clone layer in OL3

javascript

clone

openlayers-3