使用说明

地图中创建弹窗dom,该dom位置会随着地图移动而移动。

[去看示例]

使用示例

<script>
  // 1. 显示一个纯文本弹窗
  const popup = new EhhGisGl.Popup({ closeOnClick: false }).setLngLat([116.39, 39.9]).setText('这是一个简单的文本弹窗').addTo(map)

  // 2. 显示 HTML 内容的弹窗
  const popupBydom = new EhhGisGl.Popup().setLngLat([116.4, 39.91]).setHTML('<h1>Hello</h1><p>这是一个 HTML 弹窗</p>').addTo(map)
</script>

参数

Options

new EhhGisGl.Popup(options)

用于初始化 Popup 的配置对象。

参数	说明	类型	可选值	默认值
closeButton	是否在弹窗右上角显示关闭按钮（×）。	Boolean	true, false	true
closeOnClick	当用户点击地图底图时，是否自动关闭该弹窗。	Boolean	true, false	true
closeOnMove	当地图视图发生移动（平移、缩放等）时，是否自动关闭该弹窗。	Boolean	true, false	false
focusAfterOpen	弹窗打开时是否自动将焦点聚焦到弹窗元素上（用于无障碍访问）。	Boolean	true, false	true
anchor	弹窗的“锚点”方向。即弹窗的尖角指向坐标的哪个方向。如果未设置，地图将根据弹窗位置自动选择最佳方向以确保弹窗完整显示。	String	'center' 'top', 'bottom' 'left', 'right' 'top-left', 'top-right' 'bottom-left', 'bottom-right'	自动计算
offset	弹窗相对于锚点的偏移量（像素）。 可以是单个数字（所有方向统一偏移）、数组 [x, y]、或者一个对象（为不同的 anchor 指定不同的偏移）。	Number | Array | Object	-	null
className	添加到弹窗容器上的自定义 CSS 类名。可用于覆盖默认样式。	String	-	null
maxWidth	弹窗的最大宽度。内容超过此宽度时会自动换行。	String	CSS 宽度字符串 (如 '300px', 'none')	'240px'