Leaflet Map ImageOverlay—覆盖图 - 北京炫码科技有限公司

Used to load and display a single image over specific bounds of the map. Extends Layer.

用于在地图的特定边界上加载和显示单个图像。扩展图层。

Usage example

var imageUrl = 'https://maps.lib.utexas.edu/maps/historical/newark_nj_1922.jpg',
    imageBounds = [[40.712216, -74.22655], [40.773941, -74.12544]];
L.imageOverlay(imageUrl, imageBounds).addTo(map);

Creation

Factory	Description
`L.imageOverlay(<String> imageUrl, <LatLngBounds>` `bounds, <ImageOverlay options> options?)`	Instantiates an image overlay object given the URL of the image and the geographical bounds it is tied to. 实例化一个图像覆盖对象，给定图像的 URL 和它所绑定的地理范围。

Options

Option	Type	Default	Description
`opacity`	`Number`	`1.0`	The opacity of the image overlay. 图像叠加层的不透明度。
`alt`	`String`	`''`	Text for the `alt` attribute of the image (useful for accessibility). 图片的 alt 属性的文本（有助于辅助功能）。
`interactive`	`Boolean`	`false`	If `true`, the image overlay will emit mouse events when clicked or hovered. 如果为 true，则图像叠加层将在单击或悬停时发出鼠标事件。
`crossOrigin`	`Boolean\|String`	`false`	Whether the crossOrigin attribute will be added to the image. If a String is provided, the image will have its crossOrigin attribute set to the String provided. This is needed if you want to access image pixel data. Refer to CORS Settings for valid String values. 是否将 crossOrigin 属性添加到图像中。如果提供了字符串，则图像将其 crossOrigin 属性设置为提供的字符串。如果您想访问图像像素数据，则需要这样做。有关有效的字符串值，请参阅 CORS 设置。
`errorOverlayUrl`	`String`	`''`	URL to the overlay image to show in place of the overlay that failed to load. 覆盖图像的 URL，以代替加载失败的覆盖图像。
`zIndex`	`Number`	`1`	The explicit zIndex of the overlay layer. 覆盖层的显式 zIndex。
`className`	`String`	`''`	A custom class name to assign to the image. Empty by default. 要分配给图像的自定义类名称。默认为空。

▶ Options inherited from Interactive layer

从交互层继承的选项

Option	Type	Default	Description
`bubblingMouseEvents`	`Boolean`	`true`	When `true`, a mouse event on this layer will trigger the same event on the map (unless `L.DomEvent.stopPropagation` is used). 如果为 true，此图层上的鼠标事件将触发地图上的相同事件（除非使用 L.DomEvent.stopPropagation）。

▶ Options inherited from Layer

从图层继承的选项

Option	Type	Default	Description
`pane`	`String`	`'overlayPane'`	By default the layer will be added to the map’s overlay pane. Overriding this option will cause the layer to be placed on another pane by default. 默认情况下，图层将添加到地图的叠加窗格中。覆盖此选项将导致图层默认放置在另一个窗格上。
`attribution`	`String`	`null`	String to be shown in the attribution control, e.g. “© OpenStreetMap contributors”. It describes the layer data and is often a legal obligation towards copyright holders and tile providers. 要在归因控件中显示的字符串，例如“© OpenStreetMap 贡献者”。它描述了图层数据，并且通常是对版权所有者和切片提供者的法律义务。

Events

Event	Data	Description
`load`	`Event`	Fired when the ImageOverlay layer has loaded its image 当 ImageOverlay 层加载了它的图像时触发
`error`	`Event`	Fired when the ImageOverlay layer fails to load its image 当 ImageOverlay 图层无法加载其图像时触发

▶ Mouse events inherited from Interactive layer

从交互层继承的鼠标事件

Event	Data	Description
`click`	`MouseEvent`	Fired when the user clicks (or taps) the layer. 当用户单击（或点击）图层时触发。
`dblclick`	`MouseEvent`	Fired when the user double-clicks (or double-taps) the layer. 当用户双击（或双击）图层时触发。
`mousedown`	`MouseEvent`	Fired when the user pushes the mouse button on the layer. 当用户在图层上按下鼠标按钮时触发。
`mouseup`	`MouseEvent`	Fired when the user releases the mouse button pushed on the layer. 当用户释放在图层上按下的鼠标按钮时触发。
`mouseover`	`MouseEvent`	Fired when the mouse enters the layer. 当鼠标进入图层时触发。
`mouseout`	`MouseEvent`	Fired when the mouse leaves the layer. 当鼠标离开图层时触发。
`contextmenu`	`MouseEvent`	Fired when the user right-clicks on the layer, prevents default browser context menu from showing if there are listeners on this event. Also fired on mobile when the user holds a single touch for a second (also called long press). 当用户右键单击图层时触发，防止默认浏览器上下文菜单显示此事件是否有侦听器。当用户按住单次触摸一秒钟（也称为长按）时，也会在移动设备上触发。

▶ Events inherited from Layer

从图层继承的事件

Event	Data	Description
`add`	`Event`	Fired after the layer is added to a map 在图层添加到地图后触发
`remove`	`Event`	Fired after the layer is removed from a map 从地图中移除图层后触发

▶ Popup events inherited from Layer

Event	Data	Description
`popupopen`	`PopupEvent`	Fired when a popup bound to this layer is opened 打开绑定到该层的弹出窗口时触发
`popupclose`	`PopupEvent`	Fired when a popup bound to this layer is closed 当绑定到该层的弹出窗口关闭时触发

▶ Tooltip events inherited from Layer

从图层继承的工具提示事件

Event	Data	Description
`tooltipopen`	`TooltipEvent`	Fired when a tooltip bound to this layer is opened. 打开绑定到此图层的工具提示时触发。
`tooltipclose`	`TooltipEvent`	Fired when a tooltip bound to this layer is closed. 当绑定到该层的工具提示关闭时触发。

Methods

Method	Returns	Description
`setOpacity(<Number> opacity)`	`this`	Sets the opacity of the overlay. 设置叠加层的不透明度。
`bringToFront()`	`this`	Brings the layer to the top of all overlays. 将图层置于所有叠加层的顶部。
`bringToBack()`	`this`	Brings the layer to the bottom of all overlays. 将图层置于所有叠加层的底部。
`setUrl(<String> url)`	`this`	Changes the URL of the image. 更改图像的 URL。
`setBounds(<LatLngBounds> bounds)`	`this`	Update the bounds that this ImageOverlay covers 更新此 ImageOverlay 覆盖的边界
`setZIndex(<Number> value)`	`this`	Changes the zIndex of the image overlay. 更改图像叠加层的 zIndex。
`getBounds()`	`LatLngBounds`	Get the bounds that this ImageOverlay covers 获取此 ImageOverlay 覆盖的范围
`getElement()`	`HTMLElement`	Returns the instance of `HTMLImageElement` used by this overlay. 返回此叠加层使用的 HTMLImageElement 实例。
`getCenter()`	`LatLng`	Returns the center of the ImageOverlay. 返回 ImageOverlay 的中心。

▶ Methods inherited from Layer

从图层继承的方法

Method	Returns	Description
`addTo(<Map\|LayerGroup> map)`	`this`	Adds the layer to the given map or layer group. 将图层添加到给定的地图或图层组。
`remove()`	`this`	Removes the layer from the map it is currently active on. 从当前处于活动状态的地图中移除图层。
`removeFrom(<Map> map)`	`this`	Removes the layer from the given map 从给定地图中删除图层
`removeFrom(<LayerGroup> group)`	`this`	Removes the layer from the given `LayerGroup` 从给定的图层组中移除图层
`getPane(<String> name?)`	`HTMLElement`	Returns the `HTMLElement` representing the named pane on the map. If `name` is omitted, returns the pane for this layer. 返回表示地图上命名窗格的 HTMLElement。如果省略名称，则返回此图层的窗格。
`getAttribution()`	`String`	Used by the `attribution control`, returns the attribution option. 由归因控制使用，返回归因选项。

▶ Popup methods inherited from Layer

从图层继承的弹出方法

Method	Returns	Description
`bindPopup(<String\|HTMLElement\|Function\|Popup>` `content, <Popup options> options?)`	`this`	Binds a popup to the layer with the passed `content` and sets up the necessary event listeners. If a `Function` is passed it will receive the layer as the first argument and should return a `String` or `HTMLElement`. 使用传递的内容将弹出窗口绑定到图层并设置必要的事件侦听器。如果传递了一个函数，它将接收图层作为第一个参数，并应返回一个字符串或 HTMLElement。
`unbindPopup()`	`this`	Removes the popup previously bound with `bindPopup`. 移除之前与 bindPopup 绑定的弹出窗口。
`openPopup(<LatLng> latlng?)`	`this`	Opens the bound popup at the specified `latlng` or at the default popup anchor if no `latlng` is passed. 如果未传递任何 latlng，则在指定的 latlng 或默认弹出窗口锚点处打开绑定弹出窗口。
`closePopup()`	`this`	Closes the popup bound to this layer if it is open. 如果该层打开，则关闭绑定到该层的弹出窗口。
`togglePopup()`	`this`	Opens or closes the popup bound to this layer depending on its current state. 根据当前状态打开或关闭绑定到该层的弹出窗口。
`isPopupOpen()`	`boolean`	Returns `true` if the popup bound to this layer is currently open. 如果绑定到此图层的弹出窗口当前打开，则返回 true。
`setPopupContent(<String\|HTMLElement\|Popup>` `content)`	`this`	Sets the content of the popup bound to this layer. 设置绑定到该层的弹出窗口的内容。
`getPopup()`	`Popup`	Returns the popup bound to this layer. 返回绑定到该层的弹出窗口。

▶ Tooltip methods inherited from Layer

从图层继承的工具提示方法

Method	Returns	Description
`bindTooltip(<String\|HTMLElement\|Function\|Tooltip>` `content, <Tooltip options> options?)`	`this`	Binds a tooltip to the layer with the passed `content` and sets up the necessary event listeners. If a `Function` is passed it will receive the layer as the first argument and should return a `String` or `HTMLElement`. 使用传递的内容将工具提示绑定到图层并设置必要的事件侦听器。如果传递了一个函数，它将接收图层作为第一个参数，并应返回一个字符串或 HTMLElement。
`unbindTooltip()`	`this`	Removes the tooltip previously bound with `bindTooltip`. 移除之前与 bindTooltip 绑定的工具提示。
`openTooltip(<LatLng> latlng?)`	`this`	Opens the bound tooltip at the specified `latlng` or at the default tooltip anchor if no `latlng` is passed. 如果未传递任何 latlng，则在指定的 latlng 或默认的工具提示锚点处打开绑定的工具提示。
`closeTooltip()`	`this`	Closes the tooltip bound to this layer if it is open. 如果此图层打开，则关闭绑定到此图层的工具提示。
`toggleTooltip()`	`this`	Opens or closes the tooltip bound to this layer depending on its current state. 根据其当前状态打开或关闭绑定到此图层的工具提示。
`isTooltipOpen()`	`boolean`	Returns `true` if the tooltip bound to this layer is currently open. 如果绑定到此图层的工具提示当前打开，则返回 true。
`setTooltipContent(<String\|HTMLElement\|Tooltip>` `content)`	`this`	Sets the content of the tooltip bound to this layer. 设置绑定到该图层的工具提示的内容。
`getTooltip()`	`Tooltip`	Returns the tooltip bound to this layer. 返回绑定到该图层的工具提示。

▶ Methods inherited from Evented

继承自 Evented 的方法

Method	Returns	Description
`on(<String> type, <Function>` `fn, <Object> context?)`	`this`	Adds a listener function (`fn`) to a particular event type of the object. You can optionally specify the context of the listener (object the this keyword will point to). You can also pass several space-separated types (e.g. `'click dblclick'`). 将侦听器函数 (fn) 添加到对象的特定事件类型。您可以选择指定侦听器的上下文（this 关键字将指向的对象）。您还可以传递几种以空格分隔的类型（例如“click dblclick”）。
`on(<Object> eventMap)`	`this`	Adds a set of type/listener pairs, e.g. `{click: onClick, mousemove: onMouseMove}` 添加一组类型/侦听器对，例如{点击：onClick，鼠标移动：onMouseMove}
`off(<String> type, <Function>` `fn?, <Object> context?)`	`this`	Removes a previously added listener function. If no function is specified, it will remove all the listeners of that particular event from the object. Note that if you passed a custom context to `on`, you must pass the same context to `off` in order to remove the listener. 删除以前添加的侦听器函数。如果未指定函数，它将从对象中删除该特定事件的所有侦听器。请注意，如果您将自定义上下文传递给 on，则必须将相同的上下文传递给 off 才能移除侦听器。
`off(<Object> eventMap)`	`this`	Removes a set of type/listener pairs. 删除一组类型/侦听器对。
`off()`	`this`	Removes all listeners to all events on the object. This includes implicitly attached events. 删除对象上所有事件的所有侦听器。这包括隐式附加事件。
`fire(<String> type, <Object>` `data?, <Boolean> propagate?)`	`this`	Fires an event of the specified type. You can optionally provide a data object — the first argument of the listener function will contain its properties. The event can optionally be propagated to event parents. 触发指定类型的事件。您可以选择提供一个数据对象——侦听器函数的第一个参数将包含其属性。可以选择将事件传播到事件父级。
`listens(<String> type,` `<Boolean> propagate?)`	`Boolean`	Returns `true` if a particular event type has any listeners attached to it. The verification can optionally be propagated, it will return `true` if parents have the listener attached to it. 如果特定事件类型附加了任何侦听器，则返回 true。验证可以选择传播，如果父母有监听器附加到它，它将返回 true。
`once(…)`	`this`	Behaves as `on(…)`, except the listener will only get fired once and then removed. 表现为 on(…)，除了监听器只会被触发一次然后被移除。
`addEventParent(<Evented> obj)`	`this`	Adds an event parent – an `Evented` that will receive propagated events 添加事件父级 – 将接收传播事件的事件
`removeEventParent(<Evented> obj)`	`this`	Removes an event parent, so it will stop receiving propagated events 删除事件父级，因此它将停止接收传播的事件
`addEventListener(…)`	`this`	Alias to `on(…)`
`removeEventListener(…)`	`this`	Alias to `off(…)`
`clearAllEventListeners(…)`	`this`	Alias to `off()`
`addOneTimeEventListener(…)`	`this`	Alias to `once(…)`
`fireEvent(…)`	`this`	Alias to `fire(…)`
`hasEventListeners(…)`	`Boolean`	Alias to `listens(…)`

0 0 投票数

文章评分