经纬志
首页 / OpenLayers / 使用示例

受限地图范围

给 View 设置 extent 后,平移与缩放都会被夹在范围内;切到自由模式再飞出范围,对比两种行为。

OpenLayers 10.3.1 · 对应官方 extent-constrained.html · 更新 2026-10-27
源码与运行效果
运行效果

说明

ol.View 的 extent 选项会把视图中心与分辨率夹在范围内: 平移到边界后不会再往外走,缩小到刚好覆盖范围时也停住。示例把范围设为北京周边 [115.7, 39.4, 117.2, 40.3]。

切换约束时必须重建 View,因为 extent 不能在运行中修改; rebuild() 先取出当前中心与缩放,再按新状态创建视图, 所以切换瞬间画面不会跳。

操作结果
保持「锁定范围」并向西拖拽视图停在边界,状态栏显示未越界
取消勾选后点击「飞向 [96, 28]」视图到达乌鲁木齐方向,状态栏标记已越界
重新勾选「锁定范围」视图被拉回允许范围内

extent 要和视图投影一致,示例先用 ol.proj.transformExtent() 把经纬度范围换成墨卡托。