Openlayers实现长度测量的方法
概述
在 Openlayers 中,计算两点之间的距离,通常会用到ol/sphere
模块。ol/sphere
模块主要用于处理与球体(特别是地球球体)相关的数学和几何计算。而长度测量主要用到ol/sphere
中的getDistance
函数。
getDistance
函数用于计算地球表面两点之间的距离,通常用于经纬度坐标。计算的是球面上两点之间的大圆距离(即通过球体表面两个点的最短路径距离)。其返回值的单位是米 (m)
实践
效果展示
绘制
结果
实现思路
绘制曲线可以采用 Openlayers 中的ol/interaction
模块的Draw
类
实例化 Draw
this.draw = new Draw({ source: this.vectorLayer?.getSource(), type: "LineString", style: this.lineStyle, }); this.map.addInteraction(this.draw);
监听 this.draw 的 drawstart 方法
this.draw.on("drawstart", this.handleMeasureLineStart.bind(this));
在handleMeasureLineStart
回调方法中,接受一个evt对象,该对象包含绘制的feature
以及坐标coordinate
。效果图一中,在选择第一个点后,拖动鼠标,会实时显示当前鼠标表示的点与起点之间的距离,这个逻辑就是在该回调中实现的。
监听绘制的 feature 的 change 事件
this.listenGeometryChange = feature.getGeometry().on("change", (evt) => { /*..处理逻辑..*/ });
通过evt.target获取当前几何对象geometry,通过该几何对象的getFirstCoordinate()
方法获取第一个点标记为起点,getLastCoordinate()
方法获取最后一个点标记为终点。而绘制路线的转折点可以通过几何对象的getCoordinates()
方法获取,这个方法包含首尾两端的点。
计算坐标距离
最前面提到通过ol/sphere的getDistance()
方法计算两点之间的距离,而在上一步中可以得到所有折线段的坐标,循环调用getDistance
方法,(需要注意的是如果当前坐标系不是经纬度的话,就需要转换)。就可以得到每段折线的距离。相加就是总长。但实际上例子中的总长是调用sphere.getLength(geometry)
方法获取的,参数是几何对象。
sphere.getLength()
方法是用于计算球体表面上沿大圆弧的距离。其参数可以是ol/geom/LineString | ol/geom/Polygon | ol/geom/MultiLineString | ol/geom/MultiPolygon的实例。- geometry 是一个表示线(如 LineString)或面(如 Polygon)的几何对象。该几何对象可以是包含多个点的路径,或者是一个闭合的面。
- 对于一个 LineString(线),getLength 计算的是从第一个点到最后一个点之间的球面大圆距离。
- 对于 Polygon(面),getLength 计算的是边界线的球面长度。如果是多边形,则计算其外环的长度。
总结
Openlayers 中提供了内置模块ol/sphere用于计算距离,绘制几何对象时,可以通过监听获取当前几何对象的关键值。
到此这篇关于Openlayers实现长度测量的文章就介绍到这了,更多相关Openlayers长度测量内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!
相关文章
解决layui的使用以及针对select、radio等表单组件不显示的问题
今天小编就为大家分享一篇解决layui的使用以及针对select、radio等表单组件不显示的问题,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧2019-09-09
最新评论