OpenLayers 中要素属性的深度克隆

Question

我需要在 OpenLayers 中克隆一个功能（我使用的是最新的 6.3.1 版本，但我想我的问题不是特定于版本的）。

该功能本身有一个方法 .clone()。不幸的是，我为特征定义的 attributes/properties 是对象和数组，而 .clone 方法只做特征的浅拷贝。因此，如果我更改克隆对象中的某些值，原始对象也会更改。

那么，如何在 OpenLayers 中对某个功能进行深度复制？

Answer 1

作为 Anatoly suggested in comments, it can be done by .setProperties() 方法。

编辑 2020 年 4 月 18 日：由于特征的几何形状包含在 .getProperties() 中并且无法使用 JSON.parse()/JSON.stringify() 正确复制，我不得不再添加一行原代码，设置geometry 属性 of clonedProperties.

我的代码（没有任何外部库）如下：

const clonedFeature = feature.clone();
const clonedProperties = JSON.parse(JSON.stringify(feature.getProperties()));
clonedProperties.geometry = clonedFeature.getGeometry(); // see EDIT
// Maybe do something with clonedProperties as I do.
clonedFeature.setProperties(clonedProperties, true);

Answer 2

我在ol@6.5.0 遇到了同样的问题。在我的例子中，我使用 feature.clone 方法克隆一个动画特征，当我改变克隆特征的比例、不透明度、旋转属性时，原始特征也发生了变化。

我去ol的github问题找不到答案，我猜feature.clone api没有深度克隆属性。于是看了ol的feature.clone源码，发现feature的style没有clone，所以重写clone api clone the style就解决了

/**
   * Clone this feature. If the original feature has a geometry it
   * is also cloned. The feature id is not set in the clone.
   * @return {Feature} The clone.
   * @api
   */
  clone() {
    const clone = new Feature(
      this.hasProperties() ? this.getProperties() : null
    );
    clone.setGeometryName(this.getGeometryName());
    const geometry = this.getGeometry();
    if (geometry) {
      clone.setGeometry(geometry.clone());
    }
    const style = this.getStyle();
    if (style) {
      // clone.setStyle(style);
      // just setStyle the clone style
      clone.setStyle(style.clone());
      
    }
    return clone;
  }

OpenLayers 中要素属性的深度克隆

Deep cloning of feature attributes in OpenLayers

javascript

openlayers