乡镇地行政区划界线,百度地怎么看乡镇行政区划

背景

在物联网行业，用户、决策者通常需要直观地看到不同区域、地点处的设备部署情况，便于了解整体分布。通过在数字地图上动态划分各区、县的边界，同时显示每个区域的设备数量，可实现这一需求。其实，这种技术已经很成熟，并在各大找房网站中得到广泛应用。

这里列出几个参考网站，随便感受下：

kkdxg找房链家网爱屋吉屋安居客巴乐兔

基本上就是根据地图（高德、百度）的不同放大级别，分别显示不同的覆盖物；

项目需求

在百度地图上，分级，按行政区、县划分轮廓界限；

一开始拿到这一需求后，先查阅了相关资料，结果基本都指向了kkdxg找房，果然不错，随即确认了眼神。向各大找房网站学习~~

效果展示

总结

(1) 自定义覆盖物
主要解决了以下几个问题：

标注位置、样式；根据放大级别显示不同的标注覆盖物；

(2) 调用百度API获取指定区域边界数据；

官方Demo

var plys = [];var bdary = new BMap.Boundary();bdary.get(省区县名, function (rs) { var count = rs.boundaries.length; //建立多边形覆盖物 for (var i = 0; i < count; i++) { var ply = new BMap.Polygon(rs.boundaries[i], { strokeWeight: 2, strokeOpacity: 0.8, StrokeStyle: "solid", strokeColor: "#1abc9c", fillColor: "#16a085", fillOpacity: 0.2 }); plys.push(ply); map.addOverlay(ply); //添加覆盖物 }});

(3) 显示、隐藏轮廓边界；

为避免重复调用接口，并多次渲染地图边界，对边界点调用show(), hide()方法，实现轮廓边界的显示与隐藏。

// 显示轮廓for (var i = 0; i < plys.length; i++) { plys[i].show();}// 隐藏轮廓for (var i = 0; i < plys.length; i++) { plys[i].hide();}

(4) mouseover和mouseout在鼠标悬浮时多次触发；

问题的根源在子元素，一句话说明 mouseover与mouseenter 的区别：

无论鼠标穿过被选元素或其子元素，都会触发 `mouseover` 事件。仅当鼠标穿过被选元素时，才会触发 `mouseenter` 事件。

所以将 mouseover改为mouseenter，mouseout改为mouseleave，即可达到目的。

Reference Source Code: Github

If you have any questions or any bugs are found, please feel free to contact me.

Your comments and suggestions are welcome!

k8s部署Rancher什么是跨域问题?跨域解决问题