首页 / OpenLayers / API 文档
Map
先看结论
地图容器对象。负责把图层渲染到画布,并把鼠标交互转换成地图事件。
new ol.Map(options)
构造参数
| 参数 | 说明 |
|---|---|
target | 容器元素或 id |
layers | 图层数组,或返回图层的函数 |
view | ol.View 实例,决定坐标系与视角 |
controls | 控件集合,默认含缩放、旋转、版权 |
interactions | 交互集合,默认含拖拽、滚轮、双击 |
pixelRatio | 像素比,高分屏可显式设 2 提升清晰度 |
maxTilesLoading | 并行瓦片请求上限,默认 16 |
图层管理
| 方法 | 说明 |
|---|---|
addLayer(layer) | 添加图层 |
removeLayer(layer) | 移除图层 |
getLayers() | 返回图层集合 |
forEachLayerAtPixel(pixel, cb) | 命中测试,判断点击处命中了哪些图层 |
视图与坐标
| 方法 | 说明 |
|---|---|
getView() | 取视图对象 |
setView(view) | 替换视图 |
getCoordinateFromPixel(pixel) | 屏幕像素转地图坐标(米) |
getPixelFromCoordinate(coord) | 地图坐标转屏幕像素 |
updateSize() | 容器尺寸变化后重算 |
setTarget(el) | 更换挂载容器,设为 null 可解绑 |
常用事件
| 事件 | 说明 | 回调参数 |
|---|---|---|
click | 单击 | evt.coordinate 为地图坐标 |
singleclick | 区分于双击的单次点击 | 同上 |
pointermove | 鼠标移动,高频 | evt.coordinate |
moveend | 视图移动结束 | — |
map.on('singleclick', function (evt) {
var lonlat = ol.proj.toLonLat(evt.coordinate);
console.log(lonlat[0], lonlat[1]);
});
evt.coordinate 是投影后的米制坐标。
要经纬度必须再调一次 ol.proj.toLonLat,直接当经纬度用会得到上万量级的数值。
经纬志(2026)。《Map》。https://www.jingweizhi.com/openlayers/api/map.html(访问日期 2026-11-03)。