OpenLayers解读——ol地图对象的参数设置

之前我们讲到了地图对象的创建，下面我们来细化一下，分析各项配置属性

之前的代码如下：

import Map from 'ol/Map';
import View from 'ol/View';

// 创建一个地图视图，设置初始中心点与缩放级别
const view = new View({
  center: [0, 0], // 地图中心点，以经纬度表示
  zoom: 2, // 初始缩放级别
  projection: 'EPSG:3857' // 默认的Web Mercator投影
});

// 创建地图对象，指向HTML DOM元素作为地图容器
const map = new Map({
  target: 'map-container', // 容器ID或者DOM元素
  view: view, // 关联的地图视图
  layers: [], // 图层数组，可以为空，后续添加
});

// 添加图层到地图
const layer = new TileLayer({
  source: new XYZSource({
    url: 'https://a.tile.openstreetmap.org/{z}/{x}/{y}.png',
  }),
});
map.addLayer(layer);

new Map(options)参数详解

这里的属性用于在“创建地图对象”里面进行属性配置。

controls: 初始添加到地图上的控件集合。如果未指定，则使用默认值。控件可以是用于导航、缩放地图等功能的小工具。

pixelRatio: 设备上物理像素与设备无关像素（dips）之间的比率。这影响地图的渲染质量，尤其是在高分辨率设备上。默认为window.devicePixelRatio。

interactions: 初始添加到地图上的交互集合。如果未指定，则使用默认值。交互可以包括平移、缩放、旋转等用户与地图交互的方式。

keyboardEventTarget: 监听键盘事件的元素。这决定了KeyboardPan和KeyboardZoom交互何时触发。如果设置为document，则键盘交互将始终触发。如果未指定，则库监听的键盘事件元素是地图目标（即用户提供的用于地图的div）。

layers: 图层。如果未定义，则将渲染没有图层的地图。注意，图层按提供的顺序渲染，因此，例如，如果您希望矢量图层显示在瓦片图层之上，则它必须位于瓦片图层之后。

maxTilesLoading: 同时加载的最大瓦片数。默认为16。

moveTolerance: 光标必须移动的最小像素距离，才能被检测为地图移动事件而不是点击。增加此值可以更容易地点击地图。

overlays: 初始添加到地图上的覆盖物集合。默认情况下，不添加覆盖物。

target: 地图的容器，可以是元素本身或其ID。如果按元素传递，则容器可以位于辅助文档中。如果在构造时未指定，则必须调用setTarget才能渲染地图。为了便于访问（地图导航的焦点和键盘事件），目标元素必须具有正确配置的tabindex属性。

view: 地图的视图。如果未在构造时指定或通过setView指定，则不会获取图层源。