如何查找Folium地图指定范围内点位并条件显示圆圈
实现步骤
- 先留存两类点位的原始坐标数据
不要只把点位存在Folium的Marker对象里,单独整理两个列表存原始经纬度:points_a存所有绿色标记的A公司点位(格式为(纬度, 经度)元组),points_b存所有红色标记的B公司点位。 - 提前筛选符合距离要求的点位对
经纬度是球面坐标,用geopy库的great_circle方法计算两点的球面距离,单位直接指定为英里。双重遍历所有A、B点位的两两组合,把间距≤500英里的点位对存入valid_pairs列表,同时把所有出现在valid_pairs里的A、B点位单独去重存成valid_points_a、valid_points_b两个集合,避免同一个点位重复渲染圆圈。 - 仅对符合条件的点位渲染圆圈
你之前直接给所有点位加Folium.Circle才会出现全量渲染的问题,现在只遍历valid_points_a、valid_points_b里的点位生成Circle图层即可。注意Folium.Circle的半径单位是米,500英里换算为米约是804672,你可以根据展示需求调整圆圈的填充透明度、边框颜色,比如A公司点位的圆圈用淡绿色填充,B公司用淡红色填充,和标记颜色对应。 - (可选)如果需要交互时动态显隐圆圈
上述静态预渲染的方案可以满足页面加载时只展示符合距离条件圆圈的需求,如果需要支持缩放、拖动地图时实时判断点位距离、动态显隐圆圈,可以在Folium地图中注入自定义JS代码:把所有A、B点位的坐标存入前端JS全局变量,给地图绑定
moveend、zoomend事件监听,每次交互触发时重新计算当前视野内跨类点位的间距,通过修改对应Circle图层的visible属性控制显隐即可。
核心逻辑注意:距离判断的筛选逻辑要放在Circle渲染之前执行,只给符合条件的点位生成Circle图层,不要先生成所有圆圈再尝试控制显隐,能大幅降低实现复杂度
内容的提问来源于stack exchange,提问作者Bhavya Budhia
相关产品推荐
相关产品推荐

