我希望有机会在 OpenLayers 中修改我的功能。到目前为止，我只能将它们拖动到地图上，但在绘制时根本无法改变它们的形状。

在上图中，您可以看到蓝点，它只是沿着形状边框移动，但无法修改它。

我尝试使用此示例修改我的代码：

https://openlayers.org/en/latest/examples/draw-and-modify-geodesic.html

我的代码如下所示这个:

var modifyInteraction = new ol.interaction.Modify({
 features: selectInteraction.getFeatures({
   if (modifyPoint[0] === center[0] && modifyPoint[1] === center[1]) {
    first = transform(polygon[0], projection, 'EPSG:4326');
    last = transform(
      polygon[(polygon.length - 1) / 2],
      projection,
      'EPSG:4326'
    );
     radius = getDistance(first, last) / 2;
   } else {
     first = transform(center, projection, 'EPSG:4326');
     last = transform(modifyPoint, projection, 'EPSG:4326');
     radius = getDistance(first, last);
   }
   const circle = circular(
    transform(center, projection, 'EPSG:4326'),
    radius,
    128
   );
   circle.transform('EPSG:4326', projection);
   geometries[0].setCoordinates(circle.getCoordinates());
   // save changes to be applied at the end of the interaction
   modifyGeometry.setGeometries(geometries);
  ),
});
var translateInteraction = new ol.interaction.Translate({
 features: selectInteraction.getFeatures()
});

var setActiveEditing = function(active) {
    selectInteraction.getFeatures().clear();
    selectInteraction.setActive(active);
    modifyInteraction.setActive(active);
    translateInteraction.setActive(active);
};
setActiveEditing(true);

完整的小提琴在这里可用:

https://jsfiddle.net/2yj1ae04/

如何在 OpenLayers Map 中绘制这些特征后使其可编辑？

更新:

https://jsfiddle.net/bsqzc31j/

这是我最近使用的代码，效果完全相同，但没有错误:

https://jsfiddle.net/bsqzc31j/

var modifyInteraction = new ol.interaction.Modify({
  features: selectInteraction.getFeatures()
});

完整情况：

http://test.mkrgeo-blog.com/

更新：

我最近尝试了这个代码：

    var modifyInteraction = new ol.interaction.Modify({
    features: selectInteraction.getFeatures(),
    deleteCondition: function(event) {
    return ol.events.condition.shiftKeyOnly(event) &&
    ol.events.condition.singleClick(event);
    }
   });

适用于此地图：

http://www.scgis.net/api/ol/v3.6.0/examples/draw-and-modify-features.html

但就我而言，情况仍然相同。

当我完全移除/关闭新的 ol.interaction.Translate({ 时，它确实有效。但是在这种情况下，我无法拖动我的功能。

更新 III：

在应用答案 1 中的代码后，我遇到了这样的情况： 该功能仍然无法修改，因此我的 ol.interaction.Modify() 中定义的代码不起作用：

 var modifyInteraction = new ol.interaction.Modify({
 features: selectInteraction.getFeatures(),
 deleteCondition: function(event) {
 return ol.events.condition.shiftKeyOnly(event) &&
    ol.events.condition.singleClick(event);
 }

});
 map.addInteraction(modifyInteraction);

其中我定义了通过按住 Shift 按钮添加新节点和删除现有节点。

在这种情况下，当我有 ol.interaction.Translate 定义：

 var translateInteraction = new ol.interaction.Translate({
   condition: function (event) {
   return (
    ol.events.condition.primaryAction(event) &&
    ol.events.condition.platformModifierKeyOnly(event)
   );
   },
 features: selectInteraction.getFeatures(),

}); map.addInteraction(translateInteraction);

我的特征的版本被阻止了。我可以拖动它们，但无法编辑它们。由于我按住 Alt 按钮，我可以将蓝点拖离对象，但什么也没发生。有什么方法可以结合使用 ol.interaction.Modify({ 和 new ol.interaction.Translate({ ，使下面列出的所有这些选项都起作用>

• 拖动对象
• 创建新节点
• 删除现有节点

我尝试通过按住 Shift 按钮来执行此操作：

 var dragFeature = function(evt){
   if(evt.keyCode == 16){
    var translateInteraction = new ol.interaction.Translate({
     features: selectInteraction.getFeatures(),
    });
  };

但是我收到一个错误：

未捕获的 ReferenceError：translateInteraction 未定义

这意味着 TranslationInteraction 变量不再是全局的，因为它已在另一个变量内创建。