Appearance
Documentation / @geoverse/core-libre / InfoWindow
Class: InfoWindow
Defined in: packages/core-libre/src/map/infoWindow.ts:37
信息弹窗,继承自 maplibregl.Popup。
相对原生 Popup 的增强:内容支持 HTML 字符串/元素 id/DOM 元素; 提供与 core 对齐的 open / close 语义(位置入参为 WGS-84 经纬度)。 Popup 自身已派发 'open' / 'close' 事件。
坐标:使用者给的 position 恒为 WGS-84。挂到 GMap 时按其当前 datum 把位置 forward 到地图空间(国内底图无偏移);挂到原生 Map 则按 WGS-84 处理。
Extends
Popup
Constructors
Constructor
ts
new InfoWindow(opts?): InfoWindow;Defined in: packages/core-libre/src/map/infoWindow.ts:47
Parameters
opts?
InfoWindowOptions = {}
Returns
InfoWindow
Overrides
ts
Popup.constructorProperties
_closeButton
ts
_closeButton: HTMLButtonElement;Defined in: node_modules/.pnpm/maplibre-gl@5.24.0/node_modules/maplibre-gl/dist/maplibre-gl.d.ts:13496
Inherited from
ts
Popup._closeButton_container
ts
_container: HTMLElement;Defined in: node_modules/.pnpm/maplibre-gl@5.24.0/node_modules/maplibre-gl/dist/maplibre-gl.d.ts:13495
Inherited from
ts
Popup._container_content
ts
_content: HTMLElement;Defined in: node_modules/.pnpm/maplibre-gl@5.24.0/node_modules/maplibre-gl/dist/maplibre-gl.d.ts:13494
Inherited from
ts
Popup._content_eventedParent
ts
_eventedParent: Evented;Defined in: node_modules/.pnpm/maplibre-gl@5.24.0/node_modules/maplibre-gl/dist/maplibre-gl.d.ts:827
Inherited from
ts
Popup._eventedParent_eventedParentData
ts
_eventedParentData: any;Defined in: node_modules/.pnpm/maplibre-gl@5.24.0/node_modules/maplibre-gl/dist/maplibre-gl.d.ts:828
Inherited from
ts
Popup._eventedParentData_flatPos
ts
_flatPos: Point;Defined in: node_modules/.pnpm/maplibre-gl@5.24.0/node_modules/maplibre-gl/dist/maplibre-gl.d.ts:13501
Inherited from
ts
Popup._flatPos_listeners
ts
_listeners: Listeners;Defined in: node_modules/.pnpm/maplibre-gl@5.24.0/node_modules/maplibre-gl/dist/maplibre-gl.d.ts:825
Inherited from
ts
Popup._listeners_lngLat
ts
_lngLat: LngLat;Defined in: node_modules/.pnpm/maplibre-gl@5.24.0/node_modules/maplibre-gl/dist/maplibre-gl.d.ts:13498
Inherited from
ts
Popup._lngLat_map
ts
_map: Map$1;Defined in: node_modules/.pnpm/maplibre-gl@5.24.0/node_modules/maplibre-gl/dist/maplibre-gl.d.ts:13492
Inherited from
ts
Popup._map_onClose
ts
_onClose: () => void;Defined in: node_modules/.pnpm/maplibre-gl@5.24.0/node_modules/maplibre-gl/dist/maplibre-gl.d.ts:13720
Returns
void
Inherited from
ts
Popup._onClose_oneTimeListeners
ts
_oneTimeListeners: Listeners;Defined in: node_modules/.pnpm/maplibre-gl@5.24.0/node_modules/maplibre-gl/dist/maplibre-gl.d.ts:826
Inherited from
ts
Popup._oneTimeListeners_pos
ts
_pos: Point;Defined in: node_modules/.pnpm/maplibre-gl@5.24.0/node_modules/maplibre-gl/dist/maplibre-gl.d.ts:13500
Inherited from
ts
Popup._pos_tip
ts
_tip: HTMLElement;Defined in: node_modules/.pnpm/maplibre-gl@5.24.0/node_modules/maplibre-gl/dist/maplibre-gl.d.ts:13497
Inherited from
ts
Popup._tip_trackPointer
ts
_trackPointer: boolean;Defined in: node_modules/.pnpm/maplibre-gl@5.24.0/node_modules/maplibre-gl/dist/maplibre-gl.d.ts:13499
Inherited from
ts
Popup._trackPointer_update
ts
_update: (event?) => void;Defined in: node_modules/.pnpm/maplibre-gl@5.24.0/node_modules/maplibre-gl/dist/maplibre-gl.d.ts:13718
Parameters
event?
MapMouseEvent | MapLibreEvent<unknown>
Returns
void
Inherited from
ts
Popup._update_updateOpacity
ts
_updateOpacity: () => void;Defined in: node_modules/.pnpm/maplibre-gl@5.24.0/node_modules/maplibre-gl/dist/maplibre-gl.d.ts:13526
Add opacity to popup if in globe projection and location is behind view
Returns
void
Inherited from
ts
Popup._updateOpacityoptions
ts
options: PopupOptions;Defined in: node_modules/.pnpm/maplibre-gl@5.24.0/node_modules/maplibre-gl/dist/maplibre-gl.d.ts:13493
Inherited from
ts
Popup.optionsremove
ts
remove: () => this;Defined in: node_modules/.pnpm/maplibre-gl@5.24.0/node_modules/maplibre-gl/dist/maplibre-gl.d.ts:13540
Removes the popup from the map it has been added to.
Returns
this
Example
ts
let popup = new Popup().addTo(map);
popup.remove();Inherited from
ts
Popup.removeMethods
_createCloseButton()
ts
_createCloseButton(): void;Defined in: node_modules/.pnpm/maplibre-gl@5.24.0/node_modules/maplibre-gl/dist/maplibre-gl.d.ts:13717
Returns
void
Inherited from
ts
Popup._createCloseButton_focusFirstElement()
ts
_focusFirstElement(): void;Defined in: node_modules/.pnpm/maplibre-gl@5.24.0/node_modules/maplibre-gl/dist/maplibre-gl.d.ts:13719
Returns
void
Inherited from
ts
Popup._focusFirstElementaddClassName()
ts
addClassName(className): this;Defined in: node_modules/.pnpm/maplibre-gl@5.24.0/node_modules/maplibre-gl/dist/maplibre-gl.d.ts:13662
Adds a CSS class to the popup container element.
Parameters
className
string
Non-empty string with CSS class name to add to popup container
Returns
this
Example
ts
let popup = new Popup()
popup.addClassName('some-class')Inherited from
ts
Popup.addClassNameaddTo()
ts
addTo(map): this;Defined in: packages/core-libre/src/map/infoWindow.ts:68
挂载到地图;记录其 datum、订阅 datum 变更、并按之重新投影已有位置
Parameters
map
Map$1
Returns
this
Overrides
ts
Popup.addToclose()
ts
close(): this;Defined in: packages/core-libre/src/map/infoWindow.ts:95
关闭弹窗(从地图移除,Popup 会派发 'close')
Returns
this
fire()
ts
fire(event, properties?): this;Defined in: node_modules/.pnpm/maplibre-gl@5.24.0/node_modules/maplibre-gl/dist/maplibre-gl.d.ts:855
Parameters
event
string | Event$1
properties?
any
Returns
this
Inherited from
ts
Popup.firegetElement()
ts
getElement(): HTMLElement;Defined in: node_modules/.pnpm/maplibre-gl@5.24.0/node_modules/maplibre-gl/dist/maplibre-gl.d.ts:13583
Returns the Popup's HTML element.
Returns
HTMLElement
element
Example
Change the Popup element's font size
ts
let popup = new Popup()
.setLngLat([-96, 37.8])
.setHTML("<p>Hello World!</p>")
.addTo(map);
let popupElem = popup.getElement();
popupElem.style.fontSize = "25px";Inherited from
ts
Popup.getElementgetLngLat()
ts
getLngLat(): LngLat;Defined in: packages/core-libre/src/map/infoWindow.ts:63
获取位置(WGS-84)
Returns
LngLat
Overrides
ts
Popup.getLngLatgetMaxWidth()
ts
getMaxWidth(): string;Defined in: node_modules/.pnpm/maplibre-gl@5.24.0/node_modules/maplibre-gl/dist/maplibre-gl.d.ts:13627
Returns the popup's maximum width.
Returns
string
The maximum width of the popup.
Inherited from
ts
Popup.getMaxWidthisOpen()
ts
isOpen(): boolean;Defined in: node_modules/.pnpm/maplibre-gl@5.24.0/node_modules/maplibre-gl/dist/maplibre-gl.d.ts:13530
Returns
boolean
true if the popup is open, false if it is closed.
Inherited from
ts
Popup.isOpenlistens()
ts
listens(type): boolean;Defined in: node_modules/.pnpm/maplibre-gl@5.24.0/node_modules/maplibre-gl/dist/maplibre-gl.d.ts:862
Returns a true if this instance of Evented or any forwardeed instances of Evented have a listener for the specified type.
Parameters
type
string
The event type
Returns
boolean
true if there is at least one registered listener for specified event type, false otherwise
Inherited from
ts
Popup.listensoff()
ts
off(type, listener): this;Defined in: node_modules/.pnpm/maplibre-gl@5.24.0/node_modules/maplibre-gl/dist/maplibre-gl.d.ts:844
Removes a previously registered event listener.
Parameters
type
string
The event type to remove listeners for.
listener
Listener
The listener function to remove.
Returns
this
Inherited from
ts
Popup.offon()
ts
on(type, listener): Subscription;Defined in: node_modules/.pnpm/maplibre-gl@5.24.0/node_modules/maplibre-gl/dist/maplibre-gl.d.ts:837
Adds a listener to a specified event type.
Parameters
type
string
The event type to add a listen for.
listener
Listener
The function to be called when the event is fired. The listener function is called with the data object passed to fire, extended with target and type properties.
Returns
Subscription
Inherited from
ts
Popup.ononce()
ts
once(type, listener?): Promise<any> | InfoWindow;Defined in: node_modules/.pnpm/maplibre-gl@5.24.0/node_modules/maplibre-gl/dist/maplibre-gl.d.ts:854
Adds a listener that will be called only once to a specified event type.
The listener will be called first time the event fires after the listener is registered.
Parameters
type
string
The event type to listen for.
listener?
Listener
The function to be called when the event is fired the first time.
Returns
Promise<any> | InfoWindow
this or a promise if a listener is not provided
Inherited from
ts
Popup.onceopen()
ts
open(map, lngLat?): this;Defined in: packages/core-libre/src/map/infoWindow.ts:88
打开弹窗;可选传入新的经纬度位置
Parameters
map
Map$1
lngLat?
LngLatLike
Returns
this
removeClassName()
ts
removeClassName(className): this;Defined in: node_modules/.pnpm/maplibre-gl@5.24.0/node_modules/maplibre-gl/dist/maplibre-gl.d.ts:13674
Removes a CSS class from the popup container element.
Parameters
className
string
Non-empty string with CSS class name to remove from popup container
Returns
this
Example
ts
let popup = new Popup()
popup.removeClassName('some-class')Inherited from
ts
Popup.removeClassNamesetContent()
ts
setContent(content): this;Defined in: packages/core-libre/src/map/infoWindow.ts:101
设置内容(HTML 字符串 / 元素 id / DOM 元素)
Parameters
content
string | HTMLElement
Returns
this
setDOMContent()
ts
setDOMContent(htmlNode): this;Defined in: node_modules/.pnpm/maplibre-gl@5.24.0/node_modules/maplibre-gl/dist/maplibre-gl.d.ts:13650
Sets the popup's content to the element provided as a DOM node.
Parameters
htmlNode
Node
A DOM node to be used as content for the popup.
Returns
this
Example
Create an element with the popup content
ts
let div = document.createElement('div');
div.innerHTML = 'Hello, world!';
let popup = new Popup()
.setLngLat(e.lngLat)
.setDOMContent(div)
.addTo(map);Inherited from
ts
Popup.setDOMContentsetEventedParent()
ts
setEventedParent(parent?, data?): this;Defined in: node_modules/.pnpm/maplibre-gl@5.24.0/node_modules/maplibre-gl/dist/maplibre-gl.d.ts:866
Bubble all events fired by this instance of Evented to this parent instance of Evented.
Parameters
parent?
Evented | null
data?
any
Returns
this
Inherited from
ts
Popup.setEventedParentsetHTML()
ts
setHTML(html): this;Defined in: node_modules/.pnpm/maplibre-gl@5.24.0/node_modules/maplibre-gl/dist/maplibre-gl.d.ts:13621
Sets the popup's content to the HTML provided as a string.
This method does not perform HTML filtering or sanitization, and must be used only with trusted content. Consider Popup.setText if the content is an untrusted text string.
Parameters
html
string
A string representing HTML content for the popup.
Returns
this
Example
ts
let popup = new Popup()
.setLngLat(e.lngLat)
.setHTML("<h1>Hello World!</h1>")
.addTo(map);See
Inherited from
ts
Popup.setHTMLsetLngLat()
ts
setLngLat(lngLat): this;Defined in: packages/core-libre/src/map/infoWindow.ts:56
设置位置(WGS-84);按当前挂载地图 datum 投影到地图空间
Parameters
lngLat
LngLatLike
Returns
this
Overrides
ts
Popup.setLngLatsetMaxWidth()
ts
setMaxWidth(maxWidth): this;Defined in: node_modules/.pnpm/maplibre-gl@5.24.0/node_modules/maplibre-gl/dist/maplibre-gl.d.ts:13634
Sets the popup's maximum width. This is setting the CSS property max-width. Available values can be found here: https://developer.mozilla.org/en-US/docs/Web/CSS/max-width
Parameters
maxWidth
string
A string representing the value for the maximum width.
Returns
this
Inherited from
ts
Popup.setMaxWidthsetOffset()
ts
setOffset(offset?): this;Defined in: node_modules/.pnpm/maplibre-gl@5.24.0/node_modules/maplibre-gl/dist/maplibre-gl.d.ts:13680
Sets the popup's offset.
Parameters
offset?
Offset
Sets the popup's offset.
Returns
this
Inherited from
ts
Popup.setOffsetsetPadding()
ts
setPadding(padding?): void;Defined in: node_modules/.pnpm/maplibre-gl@5.24.0/node_modules/maplibre-gl/dist/maplibre-gl.d.ts:13716
Sets the popup's padding constraints for positioning.
Parameters
padding?
PaddingOptions
The padding to apply as a PaddingOptions object.
Returns
void
Example
ts
popup.setPadding({ top: 10, right: 20, bottom: 30, left: 40 });Inherited from
ts
Popup.setPaddingsetSubpixelPositioning()
ts
setSubpixelPositioning(value): void;Defined in: node_modules/.pnpm/maplibre-gl@5.24.0/node_modules/maplibre-gl/dist/maplibre-gl.d.ts:13706
Set the option to allow subpixel positioning of the popup by passing a boolean
Parameters
value
boolean
When boolean is true, subpixel positioning is enabled for the popup.
Returns
void
Example
ts
let popup = new Popup()
popup.setSubpixelPositioning(true);Inherited from
ts
Popup.setSubpixelPositioningsetText()
ts
setText(text): this;Defined in: node_modules/.pnpm/maplibre-gl@5.24.0/node_modules/maplibre-gl/dist/maplibre-gl.d.ts:13600
Sets the popup's content to a string of text.
This function creates a Text node in the DOM, so it cannot insert raw HTML. Use this method for security against XSS if the popup content is user-provided.
Parameters
text
string
Textual content for the popup.
Returns
this
Example
ts
let popup = new Popup()
.setLngLat(e.lngLat)
.setText('Hello, world!')
.addTo(map);Inherited from
ts
Popup.setTexttoggleClassName()
ts
toggleClassName(className): boolean | undefined;Defined in: node_modules/.pnpm/maplibre-gl@5.24.0/node_modules/maplibre-gl/dist/maplibre-gl.d.ts:13694
Add or remove the given CSS class on the popup container, depending on whether the container currently has that class.
Parameters
className
string
Non-empty string with CSS class name to add/remove
Returns
boolean | undefined
if the class was removed return false, if class was added, then return true, undefined if there is no container
Example
ts
let popup = new Popup()
popup.toggleClassName('toggleClass')Inherited from
ts
Popup.toggleClassNametrackPointer()
ts
trackPointer(): this;Defined in: node_modules/.pnpm/maplibre-gl@5.24.0/node_modules/maplibre-gl/dist/maplibre-gl.d.ts:13568
Tracks the popup anchor to the cursor position on screens with a pointer device (it will be hidden on touchscreens). Replaces the setLngLat behavior. For most use cases, set closeOnClick and closeButton to false.
Returns
this
Example
ts
let popup = new Popup({ closeOnClick: false, closeButton: false })
.setHTML("<h1>Hello World!</h1>")
.trackPointer()
.addTo(map);Inherited from
ts
Popup.trackPointer