首页 / Leaflet / API 文档
Point
先看结论
屏幕坐标系里的一个点:x 向右、y 向下,单位是像素,不携带任何地理含义。
L.point(x, y, round?) → Point
等价写法是 new L.Point(x, y, round)。round 为真时构造阶段就把坐标取整,适合像素对齐的场景。
属性
| 属性 | 类型 | 说明 |
|---|---|---|
x | number | 横向像素坐标 |
y | number | 纵向像素坐标,向下为正 |
方法
| 方法 | 返回 | 说明 |
|---|---|---|
clone() | Point | 复制一份 |
add(point) | Point | 逐分量相加,新对象 |
subtract(point) | Point | 逐分量相减 |
multiplyBy(num) | Point | 统一乘一个标量 |
divideBy(num) | Point | 统一除一个标量 |
scaleBy(point) | Point | 按分量相乘 |
unscaleBy(point) | Point | 按分量相除 |
round() / floor() / ceil() / trunc() | Point | 四种取整方式,均返回新对象 |
distanceTo(point) | number | 两点间的平面距离(像素) |
equals(point) | boolean | 严格比较两个分量 |
contains(point) | boolean | 分量绝对值是否都不大于对方,用于尺寸包含判断 |
toString() | string | 形如 Point(12, 34) |
所有运算方法都不修改原对象,链式调用是安全的:p.add(q).round() 不会动到 p。
在地图上算偏移
把地理坐标换算成图层像素坐标后,偏移就是普通的加减法。 下面把标注放到点位右上方 16 像素处:
var latlng = L.latLng(39.907359, 116.391263);
/* 图层像素坐标,随缩放变化 */
var p = map.latLngToLayerPoint(latlng);
var labelPos = p.add(L.point(16, -16));
var label = L.marker(map.layerPointToLatLng(labelPos), {
icon: L.divIcon({ className: 'poi-label', html: '站点 A' })
}).addTo(map);
latLngToLayerPoint 的结果依赖当前缩放级别与地图视图,
缩放后必须重新计算;把它缓存下来会在拖动或缩放时错位。
三种坐标不要混用
| 坐标 | 来源 | 单位 | 用途 |
|---|---|---|---|
LatLng | 经纬度 | 度 | 数据存储、接口交互 |
Point(图层) | latLngToLayerPoint | 像素 | 同一缩放下的标注定位 |
Point(容器) | latLngToContainerPoint | 像素 | 鼠标位置、覆盖层命中 |
图层坐标与容器坐标只差地图左上角的偏移,两者都随视图变化。 跨缩放级别保存像素坐标没有意义,保存经纬度才有。
contains 不是「点是否在矩形内」的通用判断。
它按分量比较绝对值,L.point(5, 5).contains(L.point(-10, 3)) 返回 false,
但坐标轴方向与边界规则都不适合当作矩形包含测试。
判断点是否落在 LatLngBounds 里,用 bounds.contains(latlng)。
经纬志(2026)。《Point》。https://www.jingweizhi.com/leaflet/api/point.html(访问日期 2026-11-03)。