经纬志
首页 / OpenLayers / 使用示例

自定义命中检测

不依赖默认的几何命中,改用像素距离判定:移动鼠标时找最近的点,距离小于阈值就高亮,阈值用滑块调整。

OpenLayers 10.3.1 · 对应官方 custom-hit-detection-renderer.html · 更新 2026-10-27
源码与运行效果
运行效果

说明

默认的 map.forEachFeatureAtPixel() 走渲染器的几何命中,符号越小越难命中。 示例改成自己做:把每个要素换算成像素,与鼠标位置相减求距离,小于「符号半径 + 阈值」 就算命中。

命中结果用要素属性 active 记录,样式函数据此放大圆圈、改颜色, 并顺手把鼠标指针换成手型。阈值调大后可以明显感到「更容易点中」。

操作结果
把鼠标移到点附近命中时变大变橙,状态栏显示像素距离
调大「命中阈值」远处也能命中,容错范围变大
移开鼠标高亮恢复,指针样式复位

点数上万时逐个算像素距离会卡,应先按范围过滤,再用四叉树或图层索引缩小候选集。