我最近在用OpenLayers开发多边形绘制功能时，碰到了几个关于点删除的坑，先给大家贴一下我的基础配置和相关代码：

基础地图与图层配置：

source = new ol.source.Vector({ wrapX: false, });
raster = new ol.layer.Tile({ source: new ol.source.OSM() });
vector = new ol.layer.Vector({ 
  source: source, 
  style: new ol.style.Style(/* 自定义样式配置 */) 
});
view = new ol.View({ center: defaultLonLatFormat, zoom: 12 });
mapx = new ol.Map({ layers: [raster, vector], target: 'target', view: view });

启动多边形绘制的代码：

draw = new ol.interaction.Draw({ source: source, type: 'Polygon', });
mapx.addInteraction(draw);

删除最后一个点的代码：

draw.removeLastPoint();
draw.changed();

在多边形处于开放状态时，删除点一切正常；但闭合多边形（把最后一点和第一点连接）后，调用draw.removeLastPoint()完全没效果。另外用alt+点击虽然能删除点，但删到只剩构成最小闭合多边形的3个点（三角形）时，alt+点击也失效了。我在官方示例里也验证了这个行为，现在来逐个解答这些问题：

1. 多边形闭合后，为何无法通过draw.removeLastPoint()删除点？ #

这是因为OpenLayers的Draw交互有明确的状态区分：当你闭合多边形时，Draw交互就认为当前要素的绘制已经完成了，会自动结束绘制流程，此时它不再维护绘制过程中的临时点集合。而removeLastPoint()方法仅在绘制进行中（要素未闭合、Draw处于活跃绘制状态）生效，一旦要素闭合，这个方法就找不到可操作的临时点数据了，自然没有效果。

2. 为何无法删除多边形的最后3个点？ #

这是OpenLayers对几何有效性的底层限制：多边形作为闭合图形，必须至少由3个不重复的顶点构成（也就是最小的三角形），如果少于3个点，就不再符合多边形的几何定义了。不管是默认的alt+点击删除，还是其他内置的编辑逻辑，都会遵守这个规则，防止生成无效的几何要素。

3. 有哪些方法可以实现完整的逐点删除功能？ #

要实现从开放到闭合状态都能自由删点，甚至删到只剩单个点，你可以试试以下两种方案：

方案一：切换到Modify交互处理已闭合的多边形 #

当多边形闭合后，移除Draw交互，改用Modify交互来编辑已完成的要素，它支持对已闭合多边形的顶点进行删除操作，还能自定义删除触发条件（比如点击、按Delete键）。如果需要支持删除到少于3个点，可以在编辑结束后自动把多边形转为线要素（甚至点要素）：

// 监听Draw的绘制结束事件，切换到Modify交互
draw.on('drawend', function(e) {
  mapx.removeInteraction(draw);
  
  // 创建Modify交互，配置删除条件
  const modify = new ol.interaction.Modify({
    source: source,
    deleteCondition: function(event) {
      // 支持单击或按Delete键删除顶点
      return ol.events.condition.singleClick(event) || ol.events.condition.deleteKeyOnly(event);
    }
  });
  mapx.addInteraction(modify);
  
  // 监听Modify编辑结束，处理顶点不足的情况
  modify.on('modifyend', function(evt) {
    evt.features.forEach(function(feature) {
      const geom = feature.getGeometry();
      if (geom.getType() === 'Polygon') {
        // 多边形的坐标数组最后一个点和第一个点重复，所以实际顶点数是length-1
        const vertexCount = geom.getCoordinates()[0].length - 1;
        if (vertexCount < 3) {
          // 转为线要素（如果只剩1个点，可以转为Point）
          const newGeom = vertexCount === 1 
            ? new ol.geom.Point(geom.getCoordinates()[0][0])
            : new ol.geom.LineString(geom.getCoordinates()[0].slice(0, -1));
          feature.setGeometry(newGeom);
        }
      }
    });
  });
});

方案二：自定义绘制逻辑，保持Draw交互的活跃状态 #

如果你想在闭合后依然用Draw交互的removeLastPoint()方法，可以不让Draw自动结束绘制流程，而是自己判断用户是否点击了起点，手动控制绘制状态。这种方式需要自定义更多逻辑，但能保持交互的一致性：

draw.on('drawstart', function(e) {
  const sketch = e.feature;
  // 监听草图几何的变化，自定义闭合判断
  sketch.getGeometry().on('change', function(evt) {
    const geom = evt.target;
    const coordinates = geom.getCoordinates()[0];
    if (coordinates.length > 1) {
      const lastCoord = coordinates[coordinates.length - 1];
      const firstCoord = coordinates[0];
      // 判断当前点是否接近起点（比如距离小于5像素）
      if (ol.coordinate.distance(lastCoord, firstCoord) < 5) {
        // 不要调用Draw的finishDrawing()，保持绘制状态
        // 此时依然可以调用draw.removeLastPoint()删除点
        // 如果需要完成绘制，再手动添加到source并结束交互
        // source.addFeature(sketch);
        // mapx.removeInteraction(draw);
      }
    }
  });
});

这两种方案里，方案一更符合OpenLayers的设计逻辑，实现起来也更稳妥，推荐优先尝试。

内容的提问来源于stack exchange，提问作者bigwolk