首页 / Leaflet / 使用示例
Popup 定位
把标记放在贴右边缘的位置,逐项切换气泡的平移、偏移与宽度选项。
源码与运行效果
说明
标记的经纬度由 containerPointToLatLng([宽 - 36, 高/2]) 反算,
保证气泡一打开就贴住右边缘。autoPan: true 时地图会自动向左平移,
把整个气泡让进视野;关掉后气泡右半部分被裁切。
所有选项在 openOn 时读取,因此每次切换都先
map.closePopup 再新建一个 L.popup。
直接修改已打开气泡的 options 不会触发布局重算。
| 选项 | 本例取值 | 效果 |
|---|---|---|
autoPan | true | 自动平移地图,让气泡完整可见 |
autoPanPadding | [20, 20] | 平移后气泡与容器边缘留白 |
keepInView | false | 为 true 时禁止把气泡拖出视野 |
offset | [0, -10] | 负值让气泡上移,避开图标 |
maxWidth / minWidth | 240 / 120 | 限制内容换行宽度,防止长文本铺满全屏 |
closeButton | true | 右上角关闭按钮 |
autoPan 会改变地图中心,用户点开气泡后视野会移动。
需要保持视野稳定的看板页面应关闭它,改为限制气泡宽度或把气泡放在固定侧栏。