首页 / OpenLayers / 使用示例
`r`n 独立窗口地图
把同一个地图实例的目标容器换到新窗口,主窗口与之共享视图状态。
`r`n
源码与运行效果
说明
map.setTarget() 可以把地图挂到任意 DOM 元素上。示例先打开一个空白窗口,
写入最小 HTML 骨架并引入 ol.css,再把地图实例的目标指向新窗口的容器。
地图对象没有重建,图层与视图状态原样保留;关闭子窗口时把目标设回主窗口, 地图会立刻重新渲染,不会丢失当前中心与缩放。
| 操作 | 结果 |
|---|---|
| 点「在新窗口打开」 | 弹出独立窗口,地图整体迁移过去 |
| 在子窗口平移缩放 | 视图状态保存在同一实例上 |
| 点「收回主窗口」 | 地图回到页面内,状态不变 |
弹出窗口可能被浏览器拦截,必须在点击事件里同步调用 window.open(),异步之后再开会失败。