我正在尝试使用OpenLayers的removeLastPoint()
函数解决我的应用程序问题。问题在于,在移动设备上,removeLastPoint()
正在按错误的顺序去除点。在桌面模式下,一切正常。
Here是此问题的解释。
让我在图像上介绍一下这种“以错误的顺序消除点的问题”在实践中是如何工作的。
我们从画一些LineString
开始:
现在我们得到了一个LineString
,它是通过连接第5个点而创建的。
现在,我试图通过单击我的removeLatPoint()
来调用removeButton
函数,就像这样:
removeButton.on('click', () => {
draw.removeLastPoint(); // this function comes from ol.integration.Draw class
});
现在,我期望得到这样的结果:
但是我得到了什么?我得到这样的东西:
在下一步中,我将获得:
接下来:
最后,我只会得到第5点。
问题在于,在
OpenLayers
removeLastPoint()
函数中,不是删除最后一个点,而是删除它之前的一个点。这是来自
removeLastPoint()
的当前OpenLayers
功能代码:问题在于这行对我来说:
coordinates.splice(-2, 1);
,因为它的工作方式与我展示的一样。我迫不及待要解决这个问题,所以我写了我的临时解决方案。在我的解决方案上,我在
removeLastPoint()
之前调用自己的函数,该函数将删除最后一个坐标并复制此坐标之前的坐标。就像这样:曾经有一次区别。我正在使用
draw.extend(measureFeature);
函数在最后一次之前复制此坐标,因为我必须刷新保存在this.sketchCoords_
站点上的私有变量OpenLayers
中的信息。当我尝试以另一种方式进行操作时,this.sketchCoords_
仍会记住以前保存的绘制几何图形的状态,而不是为removeLastPoint()
调用myArray = ['1','2','3','4','4']
而不是myArray = ['1','2','3','4','5']
。因此,我必须使用draw.extend()
复制当前的最后一项并更新this.sketchCoords_
。这是我自己解决此问题的方法:
removeButton.on('click', () => {
if (this.isMobileDevice) {
this.removeLastPoint();
}
this.draw.removeLastPoint();
});
removeLastPoint() {
let measureFeature = this.sketch;
measureFeature = measureFeature.clone();
const geom = measureFeature.getGeometry();
if (geom instanceof ol.geom.LineString) {
const coords = geom.getCoordinates();
let preparedCoords: [number, number][] = new Array();
if (coords) {
preparedCoords = coords;
preparedCoords.splice(-1, 1);
geom.setCoordinates(preparedCoords);
measureFeature.setGeometry(geom);
if (preparedCoords.length > 0) {
this.draw.extend(measureFeature);
}
}
} else if (geom instanceof ol.geom.Polygon) {
}
}
我的修复程序正在按预期运行。通话后,
removeLastPoint()
删除了多余的项目,我得到了正确的集合。这开始了我真正的问题。多边形。在多边形上,
removeLastPoint()
函数也不能很好地工作,并且在删除错误点(不是最后一个,但在错误点之前)之前,我们也遇到了同样的问题。因此,我将编写一种类似的机制来修改多边形坐标,就像我为
LineString
几何编写的那样。但是,如果
this.sketchCoords_
仅适用于draw.extend()
几何,如何通过注入修改后的坐标集合来更新LineString
?我不知道该怎么办。
Draw
中的OpenLayers
类对于要更改或更新当前图形多边形的多边形没有任何有用的功能。Here充满了
Draw
类。您知道如何更新它并注入修改后的坐标集吗?
Here是我的小提琴,也许会有所帮助。我不知道为什么,但是我的小提琴草图上始终为null,因此该小提琴无法正常工作,但可以显示一些代码。
最佳答案
我再次解决了我自己放入StackOverflow的问题。太棒了!
因此,让我介绍解决方案。
我说过,在修改多边形后,我需要更新this.sketchCoords_
对象,因为如果没有它,来自removeLastPoint()
的OpenLayers
将在旧坐标集合上工作。
如果draw.extend()
仅适用于LineString
几何,则我必须找到另一种解决方案。
我找到了。
解决方案是:
编写自己的类以扩展来自OpenLayers的Draw类来自this.sketchCoords_
对象:
declare namespace ol {
namespace interaction {
class ExtendedDrawClass extends ol.interaction.Draw {
sketchCoords_?: ol.Coordinate | ol.Coordinate[] | ol.Coordinate[][];
}
}
}
然后只需用自己的代码修改此集合。例如,就像这样:
var myNewCoordinates = geometry.getCoordinates();
myNewCoordinates.split(-1,1);
(<ol.Coordinate[][]>(<ol.interaction.ExtendedDrawClass>this.draw).sketchCoords_) = [myNewCoordinates];
就这样。
当代码从
removeLastPoint()
调用OpenLayers
函数时,它在myNewCoordinates
对象中设置了this.sketchCoords_
集合。我将此解决方案留给有类似问题的人。也许会有所帮助。如果是,请支持我的提问和回答。