首页 / Leaflet / 使用示例
自定义控件
继承 L.Control，做一个带城市跳转、缩放级别和鼠标坐标的右上角面板。
源码与运行效果
说明
控件通过 L.Control.extend 定义，onAdd(map) 必须返回一个 DOM 节点，
Leaflet 会把它放进对应角落的容器。示例在 onAdd 里创建按钮与读数，
在 onRemove 里解绑 zoomend 和 mousemove。
| 处理 | 原因 |
|---|---|
disableClickPropagation | 点击按钮时不触发地图拖拽与地图 click |
disableScrollPropagation | 在面板上滚轮不会缩放地图 |
requestAnimationFrame | mousemove 每帧多次，合并成一次 DOM 写入 |
map.off | 控件移除后仍持有地图引用会持续触发回调 |
坐标读数用 toFixed(5)，约 1 米精度，足够交互展示。
城市跳转用 flyTo 的 duration 控制动画时长，
默认动画在长距离跳转时可能过快，显式给 1.2 秒观感更稳。
控件只负责展示与触发动作，不要把业务状态塞进控件实例。 需要多处共享的数据放在地图之外的模块里，控件只读取并渲染。