易航海webSdk

Appearance

使用说明 ​

在地图上创建一个dom,该dom位置会随着地图移动而移动。

[去看示例]

使用示例 ​

html
<script>
  let marker = new EhhGisGl.Marker().setLngLat([30.5, 50.5]).addTo(map)
</script>

设置参数选项 ​

html
<script>
  let marker = new EhhGisGl.Marker({
    color: '#FFFFFF',
    draggable: true,
  })
    .setLngLat([30.5, 50.5])
    .addTo(map)
</script>

参数 ​

Options ​

new EhhGisGl.Marker(options)

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

参数说明类型可选值默认值
element自定义标记的 DOM 元素。如果提供了此参数，color 和 scale 选项将被忽略。如果未提供，将使用默认的蓝色水滴状 SVG 图标。HTMLElement-null
anchor标记的“锚点”位置。即经纬度坐标对应图标的哪个部位。String'center'
'top', 'bottom'
'left', 'right'
'top-left', 'top-right'
'bottom-left', 'bottom-right'		'center'
offset相对于锚点的偏移量（像素）。正值表示向右和向下偏移。PointLike[x, y]
例如 [0, -10]		[0, 0]
color默认 SVG 图标的颜色。如果提供了 element 参数，则此选项无效。StringHex 颜色字符串
(如 '#FF0000')		'#3FB1CE'
scale默认 SVG 图标的缩放比例。如果提供了 element 参数，则此选项无效。NumberNumber1
draggable是否允许用户拖拽标记。Booleantrue, falsefalse
clickTolerance响应点击事件的容差范围（像素）。允许用户点击标记周围一定范围内也能触发点击。NumberNumber0
rotation标记的旋转角度（顺时针，以度为单位）。NumberNumber0
pitchAlignment标记相对于地图倾斜（Pitch）的对齐方式。
auto: 自动匹配 rotationAlignment。
map: 标记平贴在地图表面（随地图倾斜）。
viewport: 标记始终直立面向屏幕。		String'auto', 'map', 'viewport''auto'
rotationAlignment标记相对于地图旋转（Bearing）的对齐方式。
auto: 自动匹配 viewport。
map: 标记随地图旋转（如路名）。
viewport: 标记始终不旋转（如指南针图标）。		String'auto', 'map', 'viewport''auto'