OpenLayers Api Doc

Map

ol/Map

import Map from 'ol/Map.js';

The map is the core component of OpenLayers. For a map to render, a view, one or more layers, and a target container are needed:

地图是OpenLayers的核心组件。为了渲染地图，需要一个视图、一个或多个图层和一个目标容器：

import Map from 'ol/Map.js';                //地图
import View from 'ol/View.js';              //视图
import TileLayer from 'ol/layer/Tile.js';   //图层
import OSM from 'ol/source/OSM.js';         //目标容器
​
const map = new Map({
  view: new View({
    center: [0, 0], // 中心点
    zoom: 1,        // 缩放比例
  }),
  layers: [         //图层
    new TileLayer({
      source: new OSM(),// OSM数据
    }),
  ],
  target: 'map',
});

The above snippet creates a map using a TileLayer to display OSM OSM data and render it to a DOM element with the id map.

上面的片段使用TileLayer创建了一个地图，以显示OSMOSM数据，并将其渲染为id为map的DOM元素。

The constructor places a viewport container (with CSS class name ol-viewport) in the target element (see getViewport()), and then two further elements within the viewport: one with CSS class name ol-overlaycontainer-stopevent for controls and some overlays, and one with CSS class name ol-overlaycontainer for other overlays (see the stopEvent option of Overlay for the difference). The map itself is placed in a further element within the viewport.

构造函数在目标元素中放置一个视口容器（CSS类名为ol-viewport）（见getViewport()），然后在视口中再放置两个元素：一个CSS类名为ol-overlaycontainer-stopevent，用于控件controls 和一些覆盖overlays，另一个CSS类名为ol-overlaycontainer，用于其他覆盖overlays（区别见Overlay 的stopEvent选项）。地图本身被放置在视口内的另一个元素中。

Layers are stored as a Collection in layerGroups. A top-level group is provided by the library. This is what is accessed by getLayerGroup and setLayerGroup. Layers entered in the options are added to this group, and addLayer and removeLayer change the layer collection in the group. getLayers is a convenience function for getLayerGroup().getLayers(). Note that LayerGroup is a subclass of BaseLayer, so layers entered in the options or added with addLayer can be groups, which can contain further groups, and so on.

图层以Collection的形式存储在layerGroups中。一个顶级的组由库提供。这是由getLayerGroup和setLayerGroup访问的。在选项中输入的图层被添加到这个组中，addLayer和removeLayer改变组中的图层集合。getLayers是getLayerGroup().getLayers()的一个便利函数。注意，LayerGroup是BaseLayer的子类，所以在选项中输入的图层或用addLayer添加的图层可以是组，组中可以包含进一步的组，以此类推。

实例化Map的options选项new Map(options)

controls

• Type

Collection< Control>

Array< Control>

undefined

• Description

Controls initially added to the map. If not specified, defaults is used.

最初添加到地图上的控件。如果没有指定，则使用默认值。

pixelRatio

• Type

number (defaults to window.devicePixelRatio)

数字（默认为window.devicePixelRatio）。

• Description

设备上的物理像素和与设备无关的像素（凹点）之间的比率。

interactions

• Type

Collection< Interaction >

Array (Interaction)

undefined

• Description

最初被添加到地图上的互动关系。如果没有指定，则使用默认值。

keyboardEventTarget

• Type

HTMLElement | Document | string | undefined

• Description

The element to listen to keyboard events on. This determines when the KeyboardPan and KeyboardZoom interactions trigger. For example, if this option is set to document the keyboard interactions will always trigger. If this option is not specified, the element the library listens to keyboard events on is the map target (i.e. the user-provided div for the map). If this is not document, the target element needs to be focused for key events to be emitted, requiring that the target element has a tabindex attribute.

聆听键盘事件的元素。这决定了KeyboardPan和KeyboardZoom交互的触发时间。例如，如果这个选项被设置为文档，那么键盘交互将总是被触发。如果没有指定这个选项，库监听键盘事件的元素是地图目标（即用户为地图提供的div）。如果这不是文档，目标元素需要被聚焦才能发出键盘事件，要求目标元素有一个tabindex属性。

layers

• Type

Array< BaseLayer > |

< BaseLayer > |

LayerGroup |

undefined

• Description

Layers. If this is not defined, a map with no layers will be rendered. Note that layers are rendered in the order supplied, so if you want, for example, a vector layer to appear on top of a tile layer, it must come after the tile layer.

图层。如果没有定义，就会渲染出一个没有图层的地图。请注意，图层是按照提供的顺序渲染的，所以如果你想让一个矢量图层出现在一个瓦片图层之上，它必须在瓦片图层之后出现。

maxTilesLoading

• Type

number (defaults to 16)

• Description

Maximum number tiles to load simultaneously.

同时加载的最大瓦片数。

moveTolerance

• Type

number (defaults to 1)

• Description

The minimum distance in pixels the cursor must move to be detected as a map move event instead of a click. Increasing this value can make it easier to click on the map.

光标必须移动的最小距离（像素），以便被检测为地图移动事件而不是点击。增加这个值可以使地图上的点击更容易。

overlays

• Type

Collection< Overlay > | Array< Overlay > | undefined

• Description

Overlays initially added to the map. By default, no overlays are added.

最初添加到地图上的覆盖层。默认情况下，不添加覆盖物。

target

• Type

HTMLElement | string | undefined

• Description

地图的容器，可以是元素本身或元素的id。如果在构建时没有指定，必须调用setTarget来渲染地图。如果通过元素传递，容器可以是在一个二级文档中。注意：对目标元素的CSS变换支持只限于缩放。

view

• Type

View | Promise< ViewOptions > | undefined

• Description

The map's view. No layer sources will be fetched unless this is specified at construction time or through setView.

地图的视图。除非在构造时或通过setView指定，否则不会获取图层源。

Name	Type	Description
controls	Collection< Control>	Array< Control>	undefined	最初添加到地图上的控件。如果没有指定，则使用默认值。
pixelRatio	number（默认为window.devicePixelRatio）	设备上的物理像素和与设备无关的像素（凹点）之间的比率
interactions	Collection< Interaction >	Array (Interaction)	undefined	最初被添加到地图上的互动关系。如果没有指定，则使用默认值。
keyboardEventTarget	HTMLElement	Document	string	undefined	聆听键盘事件的元素。这决定了KeyboardPan和KeyboardZoom交互的触发时间。
layers	Array< BaseLayer >	Collection < BaseLayer >	LayerGroup	undefined	图层。如果没有定义，就会渲染出一个没有图层的地图。请注意，图层是按照提供的顺序渲染的，所以如果你想让一个矢量图层出现在一个瓦片图层之上，它必须在瓦片图层之后出现。
maxTilesLoading	number (defaults to 16)	同时加载的最大瓦片数。
moveTolerance	number (defaults to 1)	光标必须移动的最小距离（像素），以便被检测为地图移动事件而不是点击。增加这个值可以使地图上的点击更容易。
overlays	Collection< Overlay >	Array< Overlay >	undefined	最初添加到地图上的覆盖层。默认情况下，不添加覆盖物。
target	HTMLElement	string	undefined	地图的容器，可以是元素本身或元素的id。如果在构建时没有指定，必须调用setTarget来渲染地图。如果通过元素传递，容器可以是在一个二级文档中。注意：对目标元素的CSS变换支持只限于缩放。
view	View	Promise< ViewOptions >	undefined	地图的视图。除非在构造时或通过setView指定，否则不会获取图层源。

事件Fires

• change (BaseEvent) - Generic change event. Triggered when the revision counter is increased.通用的改变事件。当修订计数器增加时触发。
• change:layerGroup (ObjectEvent)
• change:size (ObjectEvent)
• change:target (ObjectEvent)
• change:view (ObjectEvent)
• click (MapBrowserEvent) - A click with no dragging. A double click will fire two of this.一个没有拖动的点击。双击会引发两个这样的事件。
• dblclick (MapBrowserEvent) - A true double click, with no dragging.一个真正的双击，没有拖动。
• error (BaseEvent) - Generic error event. Triggered when an error occurs.通用的错误事件。当一个错误发生时触发。
• loadend (MapEvent) - Triggered when loading of additional map data has completed.当加载额外的地图数据完成后触发的事件。
• loadstart (MapEvent) - Triggered when loading of additional map data (tiles, images, features) starts.当开始加载额外的地图数据（瓦片、图像、特征）时触发。
• moveend (MapEvent) - Triggered after the map is moved.在地图被移动后触发。
• movestart (MapEvent) - Triggered when the map starts moving.当地图开始移动时触发。
• pointerdrag (MapBrowserEvent) - Triggered when a pointer is dragged.指针被拖动时触发。
• pointermove (MapBrowserEvent) - Triggered when a pointer is moved. Note that on touch devices this is triggered when the map is panned, so is not the same as mousemove.指针被移动时触发。注意，在触摸设备上，当地图被平移时触发，所以与mousemove不一样。
• postcompose (RenderEvent) - Triggered after layers are composed. When dispatched by the map, the event object will not have a context set. When dispatched by a layer, the event object will have a context set. Only WebGL layers currently dispatch this event.在图层组成后被触发。当由地图派发时，事件对象将没有上下文设置。当由图层派发时，事件对象将有一个上下文设置。目前只有WebGL图层派发了这个事件。
• postrender (MapEvent) - Triggered after a map frame is rendered.在地图帧被渲染后触发。
• precompose (RenderEvent) - Triggered before layers are composed. When dispatched by the map, the event object will not have a context set. When dispatched by a layer, the event object will have a context set. Only WebGL layers currently dispatch this event.在图层组成之前被触发。当由地图派发时，事件对象将没有一个上下文设置。当由图层派发时，事件对象将有一个上下文设置。目前只有WebGL图层派发了这个事件。
• propertychange (ObjectEvent) - Triggered when a property is changed.当一个属性被改变时触发。
• rendercomplete (RenderEvent) - Triggered when rendering is complete, i.e. all sources and tiles have finished loading for the current viewport, and all tiles are faded in. The event object will not have a context set.渲染完成后触发，即当前视口的所有源和瓦片都加载完毕，所有瓦片都淡入。该事件对象将不会有一个上下文设置。
• singleclick (MapBrowserEvent) - A true single click with no dragging and no double click. Note that this event is delayed by 250 ms to ensure that it is not a double click.一个真正的单次点击，没有拖动，没有双击。请注意，这个事件被延迟了250毫秒，以确保它不是一个双击。

拓展Extends

• BaseObject 基本对象

可观察的属性Observable Properties

Name	Type	Settable可结算	ObjectEvent type对象事件类型	Description描述	翻译
layerGroup	LayerGroup	yes	change:layergroup	A layer group containing the layers in this map.	一个包含该地图中各层的图层组。
size	Size	undefined	yes	change:size	The size in pixels of the map in the DOM.	DOM中地图的尺寸，以像素为单位。
target	HTMLElement	string	undefined	yes	change:target	The Element or id of the Element that the map is rendered in.	渲染地图的元素或元素的id。
view	View	yes	change:view	The view that controls this map.	控制该地图的视图。

方法Methods

addControl(control)

将给定的控件添加到地图上。

参数

Name	Type	Description
control	Control	Control.

addInteraction(interaction)

Add the given interaction to the map. If you want to add an interaction at another point of the collection use getInteractions() and the methods available on Collection. This can be used to stop the event propagation from the handleEvent function. The interactions get to handle the events in the reverse order of this collection.

将给定的交互添加到地图上。如果你想在集合的另一点添加一个交互，请使用getInteractions()和Collection上可用的方法。这可以用来停止来自handleEvent函数的事件传播。交互以这个集合的相反顺序得到处理事件。

参数

Name	Type	Description
interaction	Interaction	Interaction to add.

addLayer(layer)

Adds the given layer to the top of this map. If you want to add a layer elsewhere in the stack, use getLayers() and the methods available on Collection.

将给定的图层添加到该地图的顶部。如果你想在堆栈的其他地方添加一个图层，可以使用getLayers()和Collection上的方法。

参数

Name	Type	Description
layer	BaseLayer	Layer

addOverlay(overlay)

Add the given overlay to the map.

在地图上添加给定的覆盖层。

参数

Name	Type	Description
overlay	Overlay	Overlay.

changed() inherited

Increases the revision counter and dispatches a 'change' event.

增加修订计数器，并发送一个 "更改 "事件。

dispatchEvent

dispatchEvent(event){boolean | undefined} inherited

Dispatches an event and calls all listeners listening for events of this type. The event parameter can either be a string or an Object with a type property.

派遣一个事件并调用所有监听此类型事件的监听器。事件参数可以是一个字符串，也可以是一个带有类型属性的对象。

参数

Name	Type	Description
event	BaseEvent	string	Event object.

返回值 Returns:

false if anyone called preventDefault on the event object or if any of the listeners returned false.

如果有人在事件对象上调用preventDefault，或者有任何监听器返回错误，则为 "false"。

forEachFeatureAtPixel

forEachFeatureAtPixel(pixel, callback, options){T | undefined}

Dispatches an event and calls all listeners listening for events of this type. The event parameter can either be a string or an Object with a type property.

派遣一个事件并调用所有监听此类型事件的监听器。事件参数可以是一个字符串，也可以是一个带有类型属性的对象。

参数

Name	Type	Description
pixel	Pixel	像素。
callback	function	特征回调。该回调将被调用，有两个参数。第一个参数是像素处的一个feature或render feature，第二个参数是该特征的layer，对于未管理的层，将为空。为了停止检测，回调函数可以返回一个真值。
options	Optional options.	见下表

Optional options.

Name	Type	Description
layerFilter	undefined	function	层过滤功能。过滤函数将收到一个参数，即layer-candidate，它应该返回一个布尔值。只有可见且该函数返回 "true "的图层才会被测试出特征。默认情况下，所有可见图层都将被测试。
hitTolerance	number (defaults to 0)	以css像素为单位的命中检测公差。在给定位置周围半径内的像素将被检查出特征。
checkWrapped	boolean (defaults to true)	Check-Wrapped 将检查+/-1世界宽度范围内的包裹的几何图形。只有在使用可以被包裹的投影时才会起作用。

返回值 Returns:

false if anyone called preventDefault on the event object or if any of the listeners returned false.

回调结果，即最后一次回调执行的返回值，或第一个真实的回调返回值。

get(key)

get(key){*} inherited

Gets a value.

获取一个值。

Name	Type	Description
key	string	关键名称。

• Returns:

Value.