在OpenLayers 3中将功能从一个位置移动到另一位置

Single Entity 发表于 Dev

单实体

如何将矢量要素从地图上的一个位置移动到另一位置？

我有以下代码会在（0.0，0.0）处生成一个图标：

var iconFeature = new ol.Feature({
   geometry: new ol.geom.Point([0.0,0.0])
});

var iconStyle = new ol.style.Style({
  image: new ol.style.Icon(({
    anchor: [0.5, 46],
    anchorXUnits: 'fraction',
    anchorYUnits: 'pixels',
    opacity: 0.75,
    src: 'marker-icon.png'
  }))
});

iconFeature.setStyle(iconStyle);

这可以正常工作，但是现在如何将其移动到另一个位置？

我试过了：

iconFeature.move(x,y);

我也尝试过

iconFeature.geometry.move(x,y);

后者说iconFeature.geometry是未定义的，第一个说icon.move（）不是函数。

之前关于SO的答案提出了这些解决方案，但它们似乎不适用于我。

约翰·鲍威尔

实际上，您可以使用新ol.coordinate.add方法执行此操作，请参阅文档。

我添加了一个jsFiddle来演示这一点，红色点是原始点，绿色点是移动了随机距离的那些点。

要获取点，请forEachFeature在向量源上使用，并getGeometry().getCoordinates()获取实际坐标，然后使用setGeometry，例如

vectorSource.forEachFeature(function(feature){
     var coordinate = feature.getGeometry().getCoordinates();
     //move coordinates some distance
     ol.coordinate.add(coordinate, 10, 10);
     //use setGeometry to move it   
     feature.setGeometry(new ol.coordinate);
    }
);

在这个小提琴中，我创建了一个新的几何图形，而不是移动现有的几何图形。显然，对于除点之外的其他东西，您将不得不遍历坐标数组。要仅移动特定的几何图形，可以使用getFeatureByIdol.Feature方法获取特定的图形，然后可以如上所述移动其几何图形并进行更新。

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。