Openlayers - 避免和调整重叠的多边形
Openlayers - Avoid and adjust overlapping polygons
我有一个项目使用 Openlayers 来绘制、编辑和显示多个多边形。我想添加到项目中的功能之一是自动避免重叠功能。
当用户绘制新特征时。应用程序应检查是否有任何现有功能与新功能重叠。由于 Turf.js 库,这已经可用:
我想添加的下一步是自动切断和删除新功能中与现有功能重叠的多余区域的功能。我已经搜索了 Turf.js 文档,但我找不到执行此操作的函数。
在 Mike 的帮助下,我创建了一个有效的解决方案。我遍历 VectorLayer 中存在的所有功能。我首先检查该特征是否确实是多边形。然后我将特征转换为 Turf Polygon 对象并检查它们是否相交。如果它们相交,我使用 Turf 的差异函数并将特征的坐标设置为生成的多边形。
const removeOverlappingAreasWithExistingFeatures = (feature) => {
const format = new GeoJSON();
store.state.layers.drawingLayer.getFeatures().forEach((existingFeature) => {
if (
existingFeature.getGeometry().getType() !== 'Polygon' ||
!existingFeature.get('description') ||
existingFeature.get('description') === feature.get('description')
)
return;
var featurePoly = format.writeFeatureObject(feature);
var existingFeaturePoly = format.writeFeatureObject(existingFeature);
const intersection = turf.intersect(featurePoly, existingFeaturePoly);
if (intersection) {
var difference = turf.difference(featurePoly, intersection);
difference.geometry.coordinates =
difference.geometry.coordinates.filter(
(coordinate) => coordinate.length > 0
);
feature.setGeometry(format.readFeature(difference).getGeometry());
}
});
return feature;
};
我有一个项目使用 Openlayers 来绘制、编辑和显示多个多边形。我想添加到项目中的功能之一是自动避免重叠功能。
当用户绘制新特征时。应用程序应检查是否有任何现有功能与新功能重叠。由于 Turf.js 库,这已经可用:
我想添加的下一步是自动切断和删除新功能中与现有功能重叠的多余区域的功能。我已经搜索了 Turf.js 文档,但我找不到执行此操作的函数。
在 Mike 的帮助下,我创建了一个有效的解决方案。我遍历 VectorLayer 中存在的所有功能。我首先检查该特征是否确实是多边形。然后我将特征转换为 Turf Polygon 对象并检查它们是否相交。如果它们相交,我使用 Turf 的差异函数并将特征的坐标设置为生成的多边形。
const removeOverlappingAreasWithExistingFeatures = (feature) => {
const format = new GeoJSON();
store.state.layers.drawingLayer.getFeatures().forEach((existingFeature) => {
if (
existingFeature.getGeometry().getType() !== 'Polygon' ||
!existingFeature.get('description') ||
existingFeature.get('description') === feature.get('description')
)
return;
var featurePoly = format.writeFeatureObject(feature);
var existingFeaturePoly = format.writeFeatureObject(existingFeature);
const intersection = turf.intersect(featurePoly, existingFeaturePoly);
if (intersection) {
var difference = turf.difference(featurePoly, intersection);
difference.geometry.coordinates =
difference.geometry.coordinates.filter(
(coordinate) => coordinate.length > 0
);
feature.setGeometry(format.readFeature(difference).getGeometry());
}
});
return feature;
};