Openlayers map三要素（view，target，layers），及其他参数属性方法介绍

淩亂°似流年 2024-03-17 12:11 62阅读 0赞

![在这里插入图片描述][62646e223c5341168d190dde2dffc9ba.png_pic_center]

### 版本说明 ###

Openlayers的实战教程 分为**图文版** 和 **视频版**， 这里的是图文版，包含基础知识介绍和*实战的源代码*，示例效果以gif动图的形式展现出来。**视频版** 正在录制中，很快会上线，敬请期待~， 如有问题，可以加vx咨询 **gis-dajianshi**

在OpenLayers开发中，map是 OpenLayers 的核心组件，用于初始化地图对象。 做地图项目的时候，必须要new map（\{\}）

![在这里插入图片描述][d6c09ffaf581482eaa16daf77f0eff3a.png_pic_center]

### map核心三要素 ###

**target** 地图的容器，元素本身或id元素的 。必须指定，不指定无法加载地图。  
**view** 视图。需要在构造时或通过方法（setView）指定，否则不会加载图层。  
**layers** 图层。没定义图层，也会加载，显示空白图层。图层是按顺序加载的，想要在最上层需要放在最后面。

### Map其他参数 ###

**controls** 添加到地图上的控件。默认加载 ol/control 下 defaults，默认控件组。  
**overlays** 覆盖物。默认情况下，不添加任何覆盖物。  
**pixelRatio** 设备上物理像素与设备无关像素（下降）之间的比率。  
**interactions** 添加到地图的交互事件。默认加载 ol/interaction 下 defaults，默认交互组。  
**keyboardEventTarget** 监听键盘事件的元素。这决定了KeyboardPan和 KeyboardZoom互动的触发时间。例如，如果将此选项设置为 document键盘，则交互将始终触发。如果未指定此选项，则库在其上侦听键盘事件的元素是地图目标（即，用户为地图提供的div）。如果不是 document，则需要重点关注目标元素以发出关键事件，这要求目标元素具有tabindex属性。  
**maxTilesLoading** 同时加载的最大瓦片数。**默认16**。  
**moveTolerance** 光标必须移动的最小距离（以像素为单位）才能被检测为地图移动事件，而不是单击。增大此值可以使单击地图更容易。  
**layerGroup** 地图中图层的图层组。  
**size** DOM 中地图的大小（以像素为单位）。

### Map的常用方法 ###

on(type, listener) 侦听某种类型的事件。  
addControl(control) 添加控件。  
addInteraction(interaction) 添加交互。  
addLayer(layer) 添加图层。  
removeLayer(layer) 删除图层。  
addOverlay(overlay) 添加覆盖物。  
dispatchEvent(event) 调度事件并调用所有侦听此类型事件的侦听器。  
getOverlays() 获取所有覆盖物。  
removeOverlay(overlay) 删除指定覆盖物

### 相应的API链接 ###

https://openlayers.org/en/latest/apidoc/module-ol\_Map-Map.html

[62646e223c5341168d190dde2dffc9ba.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/15/253fdf80d1e04441ae50c3c619b3d7cf.png
[d6c09ffaf581482eaa16daf77f0eff3a.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/15/6f4bb1fec0a641d293bc0d4774d29779.png