首页 / Leaflet / 使用示例
惯性拖拽
切换四组惯性参数,甩动地图后量出松手到停下的滑行距离。
源码与运行效果
说明
滑行由两个参数决定:inertiaDeceleration 是减速度,单位 px/s²,
Leaflet 默认 3400,值越大停得越快;inertiaMaxSpeed 是松手时的速度上限,
单位 px/s,默认 Infinity,设小值能限制一次甩动能滑多远。
easeLinearity 控制动画的缓动曲线,默认 0.2。
测量方式是:dragend 时记下中心点,moveend 时
用 map.distance() 算两点距离。关闭惯性后两个事件几乎同时发生,
距离接近 0,可以直接对比出效果差异。
| 预设 | deceleration | maxSpeed | 手感 |
|---|---|---|---|
| 无惯性 | 3400 | 不设上限 | 松手即停,适合精细对位 |
| 默认 | 3400 | Infinity | 一次中等力度甩动滑半屏左右 |
| 强惯性 | 900 | 3200 | 滑得很远,适合浏览大范围 |
| 短滑行 | 6000 | 600 | 轻甩即停,兼顾流畅与稳定 |
惯性参数在松手那一刻从 map.options 读取。运行时修改
map.options.inertiaDeceleration 会立刻影响下一次拖拽,
不需要重建地图。正式项目直接在地图初始化时一次配好即可,示例提供按钮只是为了对比手感。
惯性开启后 moveend 会比松手晚几百毫秒,依赖「松手即取视野」的逻辑
应改用 dragend,否则拿到的是滑行前的中心点。