如何在OpenLayers中基于指定点创建与原选区尺寸一致的新选区？

我明白你的需求啦——你现在用OpenLayers的ol.interaction.Transform做了一个选区，然后通过Draw交互画了一个点，想要生成一个和原选区大小、角度完全一致，中心正好落在这个新绘制点上的新选区，对吧？

先说说你现有代码里的小问题：你用getDifference取了坐标的绝对值差，这样会丢失偏移的方向，导致选区平移的位置不对。其实我们只需要计算新中心与原中心的坐标偏移量，然后把原选区的所有点都加上这个偏移量，就能完美实现需求了。

下面是修正后的完整实现步骤和代码：

步骤拆解 #

1. 计算原选区的中心坐标：通过原选区几何的边界范围来计算中心，比直接取坐标点更准确；
2. 计算平移偏移量：用新绘制点的坐标减去原选区中心的坐标，得到x和y方向的偏移值；
3. 生成新选区坐标：遍历原选区的所有坐标点，每个点都加上偏移量，得到新的坐标数组；
4. 更新并选中新选区：把新坐标赋值给克隆的选区，再用Transform交互选中它。

完整代码 #

// 1. 获取原选区的几何对象与中心坐标
const originalGeom = originalSelection.getGeometry();
const originalExtent = originalGeom.getExtent();
const originalCenter = ol.extent.getCenter(originalExtent);

// 2. 获取新绘制点的中心坐标（假设coordinatePunto是你的点要素）
const newCenter = coordinatePunto.getGeometry().getCoordinates();

// 3. 计算平移偏移量：新中心 - 原中心
const dx = newCenter[0] - originalCenter[0];
const dy = newCenter[1] - originalCenter[1];

// 4. 克隆原选区并更新坐标
const newSelection = originalSelection.clone();
const newGeom = newSelection.getGeometry();

// 获取原选区的坐标环（多边形是闭合的，第一个数组是外环）
const originalCoords = originalGeom.getCoordinates()[0];
// 生成新坐标：每个点加上偏移量
const newCoordsArray = originalCoords.map(coord => [
  coord[0] + dx,
  coord[1] + dy
]);

// 设置新的几何坐标（保持闭合结构）
newGeom.setCoordinates([newCoordsArray]);

// 5. 用Transform交互选中新选区
transform.select(newSelection, true);

额外说明 #

这个方法不仅适用于矩形选区，哪怕你原选区是旋转过的矩形、甚至其他多边形，只要你想保持原形状和尺寸，平移到新中心位置，都可以用这个逻辑——本质就是对整个几何对象做平移变换，完全不会改变它的大小和角度。

备注：内容来源于stack exchange，提问作者user22259111