首页 / Leaflet / 使用示例
GeoJSON 图层
一份包含点、线、面的 GeoJSON,按等级上色,可过滤要素、强调重点并随时恢复视野。
源码与运行效果
说明
样式由 style 回调按 level 返回,点要素则交给
pointToLayer 转成带 divIcon 的标记,
onEachFeature 里统一挂提示与气泡。三者的分工不能混:
style 返回的 color 不会影响点的外观。
过滤开关通过 filter 实现,切换后整个图层重建,
被排除的要素连图层都不会创建。setStyle 只作用于线与面,
所以「强调重点」改变线面虚线样式后,点的高亮用 setZIndexOffset 单独处理。
| 回调 | 只作用于 | 本例用途 |
|---|---|---|
style | 线、面 | 按等级取色、调线宽与填充 |
pointToLayer | 点 | 转成 divIcon 圆点,避免默认图钉 |
onEachFeature | 全部要素 | 绑 tooltip 与 popup,显示属性 |
filter | 全部要素 | 返回 false 即不创建图层 |
getBounds() | 整个图层 | 计算并集范围用于 fitBounds |
filter 改变后必须重建图层,直接在原图层上删除要素会残留引用。
要素数量上千时,把过滤条件提前放到接口查询里,比加载后丢弃更省流量。