openlayers.js加载geojson时绑定单击事件，点击空白处选中最接近的要素（比如一个线性图形下面有个多边形，在线性图形空白处点击时会选中多边形，而你想要选中线性图形）

迷茫的小猿

于 2020-05-13 11:23:11 发布

阅读量492

点赞数 2

CC 4.0 BY-SA版权

分类专栏： openlayer geoserver cad

本文链接：https://blog.youkuaiyun.com/weixin_43747076/article/details/106093576

本文介绍了如何使用OpenLayers.js官方API，通过遍历所有feature并利用定时器确保图层加载完成，结合getFeatures()、getGeometry()和getClosestPoint()方法，实现点击地图空白区域时选择最接近的线性图形或多边形。注意处理坐标系问题以确保正确计算距离。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

背景：之前我写过一篇文章解决这个问题的点击此处查看，所以就不在这里详细介绍问题了，但是呢不够官方，是我自己凭空想象而来的，下面我要介绍的就比较官方了，因为是比对官方文档api来获取的

第一步：首先咱们依旧需要遍历所有feature

这次参考官方apiol/source/Vector的getFeatures()方法去获取所有feature

直接获取是获取不到的，我也说不了这个是异步的还是说图层加载完成之后才能获取，所以我干脆就直接来个定时器

代码：

if(timer){
   
   
   clearInterval(timer)
}

var timer = setTimeout(function(){
   
   
    var fs = vectorsource.getFeatures()

    AllFeatures = fs

    console.log('fs',fs)

   	for (var m = 0; m <fs.length; m++) {
   
   

        console.log(fs[m])

         var prop = fs[m].getProperties()

         var geom = fs