类:控件

ol/control/Control~控件


import Control from 'ol/control/Control.js';

控件是一个可见的组件,其DOM元素固定在屏幕上的特定位置。它们可以包含用户输入(如按钮),或仅用于显示信息;位置通过CSS确定。默认情况下,这些控件放置在CSS类名为ol-overlaycontainer-stopevent的容器中,但也可以使用任何外部DOM元素。

这是控件的基类。您可以通过创建带有事件监听器的元素并实例化,将其用于简单的自定义控件:

const myControl = new Control({element: myElement});

然后将其添加到地图。

将其作为控件而非简单的独立DOM元素的主要优势在于,它能自动处理事件传播的阻止。控件同时也是 Collection 中的对象,因此您可以调用其方法。

您还可以扩展此基类以创建自定义控件。有关实现示例,请参阅 examples/custom-controls 目录。

new Control(options)

Name Type 描述
element HTMLElement | undefined

该元素是控件的容器元素。仅当开发自定义控件时才需要指定。

render function | undefined

当控件需要重新渲染时调用的函数。这被称为在requestAnimationFrame回调。

target HTMLElement | string | undefined

若要将控件渲染在地图视口之外,请指定目标。

触发事件:

子类

继承

方法

递增修订计数器并触发更改事件。

dispatchEvent(event){boolean | undefined} inherited

派发事件并调用所有监听此类型事件的监听器。事件参数可以是字符串,也可以是包含 type 属性的对象。

Name Type 描述
event BaseEvent | string

事件对象。

返回:
false 如果事件对象上调用了 preventDefault 或任何侦听器返回 false。

获取值。

Name Type 描述
key string

键名。

返回:
值。

getKeys(){Array.<string>} inherited

获取对象属性名称列表

返回:
属性名称列表。

getMap(){Map | null}

获取与此控件关联的地图。

返回:
地图.

getProperties(){Object.<string, *>} inherited

获取包含所有属性名称和值的对象。

返回:
对象。

getRevision(){number} inherited

获取该对象的版本号。每当对象被修改时,其版本号将自动递增。

返回:
修订。

on(type, listener){EventsKey | Array<EventsKey>} inherited

监听特定类型的事件。

Name Type 描述
type string | Array.<string>

事件类型或事件类型数组。

listener function

监听器函数。

返回:
事件监听器的唯一键。若以事件类型数组作为首个参数调用,则返回结果将为键的数组。

once(type, listener){EventsKey | Array<EventsKey>} inherited

一次性监听特定事件类型。

Name Type 描述
type string | Array.<string>

事件类型或事件类型数组。

listener function

监听器函数

返回:
监听器的唯一键。若第一个参数为事件类型数组,则返回键的数组。

render(mapEvent)

渲染控件。

Name Type 描述
mapEvent MapEvent

地图事件。

set(key, value, silent) inherited

设置值。

Name Type 描述
key string

键名。

value *

值。

silent boolean | undefined

更新而不触发事件。

将控件从当前地图移除,并附加到新地图。 传递 null 以仅从当前地图中移除控件。 子类可以设置事件处理程序以接收地图更改的通知。

Name Type 描述
map Map | null

地图.

setProperties(values, silent) inherited

设置键值对集合。请注意,此操作将修改现有属性并添加新属性(不删除现有属性)。

Name Type 描述
values Object.<string, *>

值。

silent boolean | undefined

更新而不触发事件。

setTarget(target)

此函数用于设置控件的目标元素。如果在控件已添加到地图后调用此函数(即在控件上调用 setMap 之后),则无效。如果未在传递给控件构造函数的选项中设置 target,且未调用 setTarget,则控件会被添加到地图的覆盖层容器中。

Name Type 描述
target HTMLElement | string

目标。

un(type, listener) inherited

取消监听特定类型的事件。

Name Type 描述
type string | Array.<string>

事件类型或事件类型数组。

listener function

监听器函数。

unset(key, silent) inherited

清除属性。

Name Type 描述
key string

键名。

silent boolean | undefined

在不触发事件的情况下取消设置。