首页 / Leaflet / 使用示例
比例尺控件
切换公制、英制、双单位与窄版比例尺,并用 100 像素实测值核对显示是否合理。
源码与运行效果
说明
比例尺控件的宽度不会精确等于 maxWidth,而是取不超过该值的整齐刻度,
所以 100 像素对应的是约 100 像素长的标签。切换配置只能移除重建:
maxWidth 与 metric 只在 onAdd 时读取。
顶部的「100 像素 ≈」由 containerPointToLatLng 取两点后
map.distance 实算,和左下角控件的读数可以互相校验。
移动地图后两个数值都会刷新,纬度越高,同样像素代表的距离越短。
| 配置 | 参数 | 适用场景 |
|---|---|---|
| 只公制 | metric: true, imperial: false | 国内项目默认 |
| 只英制 | metric: false, imperial: true | 面向英制单位的成果 |
| 双单位 | 两项都为 true | 国际项目,控件高度翻倍 |
| 窄版 | maxWidth: 60 | 移动端,刻度会降到 25/50 米这类值 |
| 多控件 | 不同 position | 角上同时放公制与英制 |
Web 墨卡托的比例尺只在赤道严格成立。39.9°N 处 100 像素的地面距离约为赤道的
cos(39.9°) ≈ 0.77 倍,控件显示的数值本身已按当前纬度换算,
但拿它当「图上量距」的换算系数时,仍应使用实测值而不是直接用控件标签。