# Marker

扩展事件

创建一个标记组件

# Parameters

  • options Object?
    • options.element HTMLElement? 用作标记的 DOM 元素。默认为浅蓝色、水滴状的 SVG 标记。
    • options.anchor **string**一个字符串,指示应该通过Marker#setLngLat定位到最接近坐标集的Marker 部分。选项包括'center''top''bottom''left''right''top-left''top-right''bottom-left',和'bottom-right'。(可选,默认'center'
    • options.offset 点像? 以像素为单位的偏移量,作为要应用的[PointLike][166]对象相对于元素的中心。负数表示向左和向上。
    • options.color **string**如果未提供 options.element,则用于默认标记的颜色。默认为浅蓝色。(可选,默认'#3FB1CE'
    • options.scale **number**如果未提供 options.element,则用于默认标记的比例。默认比例对应于 的高度41px和宽度27px。(可选,默认1
    • options.draggable **boolean**一个布尔值,指示是否可以将标记拖动到地图上的新位置。(可选,默认false
    • options.clickTolerance **number**用户在点击标记期间可以移动鼠标指针的最大像素数,以便将其视为有效点击(与标记拖动相反)。默认是继承地图的clickTolerance。(可选,默认0
    • options.rotation **number**标记相对于其各自rotationAlignment设置的旋转角度(以度为单位)。正值将顺时针旋转标记。(可选,默认0
    • options.pitchAlignment string map将 与Marker地图平面对齐。viewport将 与Marker视口平面对齐。auto自动匹配 的值rotationAlignment。(可选,默认'auto'
    • options.rotationAlignment string map对齐Marker相对于地图的旋转,在地图旋转时保持方位角。相对于视口viewport对齐Marker的旋转,与地图旋转无关。auto相当于viewport。(可选,默认'auto'
  • legacyOptions 选项?

# Examples

var marker = new vjmap.Marker()
  .setLngLat([30.5, 50.5])
  .addTo(map);
1
2
3
// Set options
var marker = new vjmap.Marker({
    color: "#FFFFFF",
    draggable: true
  }).setLngLat([30.5, 50.5])
  .addTo(map);
1
2
3
4
5
6

# addTo

将 附加MarkerMap对象。

# Parameters

  • map **[Map][1]**要添加标记的地图。

# Examples

var marker = new vjmap.Marker()
  .setLngLat([30.5, 50.5])
  .addTo(map); // add the marker to the map
1
2
3

返回**标记** this

# remove

从地图上移除标记

# Examples

var marker = new vjmap.Marker().addTo(map);
marker.remove();
1
2

返回**标记** this

# getLngLat

获取标记的地理位置。

结果的经度可能与之前设置的经度相差 360 度的倍数,setLngLat因为Marker将锚定经度包裹在世界的副本上以将标记保留在屏幕上。

# Examples

// Store the marker's longitude and latitude coordinates in a variable
var lngLat = marker.getLngLat();
// Print the marker's longitude and latitude values in the console
console.log('Longitude: ' + lngLat.lng + ', Latitude: ' + lngLat.lat )
1
2
3
4

返回**[LngLat][230]**一个[LngLat][230]描述标记的位置。

# setLngLat

设置标记的地理位置并移动它。

# Parameters

  • lnglat **[LngLat][230]**甲[LngLat][230]描述将标记应位于。

# Examples

// Create a new marker, set the longitude and latitude, and add it to the map
new vjmap.Marker()
  .setLngLat([-65.017, -16.457])
  .addTo(map);
1
2
3
4

返回**标记** this

# getElement

返回Marker的 HTML 元素。

返回**HTMLElement**元素

# setPopup

将[Popup][208]绑定到[Marker][238]。

# Parameters

  • popup 弹出窗口[Popup][208]类的一个实例。如果未定义或为空,则在此[Marker][238]实例上设置的任何弹出窗口都未设置。

# Examples

var marker = new vjmap.Marker()
 .setLngLat([0, 0])
 .setPopup(new vjmap.Popup().setHTML("<h1>Hello World!</h1>")) // add popup
 .addTo(map);
1
2
3
4

返回**标记** this

# getPopup

返回绑定到Marker][238]的[Popup][208]实例。[

# Examples

var marker = new vjmap.Marker()
 .setLngLat([0, 0])
 .setPopup(new vjmap.Popup().setHTML("<h1>Hello World!</h1>"))
 .addTo(map);

console.log(marker.getPopup()); // return the popup instance
1
2
3
4
5
6

返回**弹出**窗口

# togglePopup

打开或关闭弹出绑定到该实例标记,这取决于当前的状态弹出

# Examples

var marker = new vjmap.Marker()
 .setLngLat([0, 0])
 .setPopup(new vjmap.Popup().setHTML("<h1>Hello World!</h1>"))
 .addTo(map);

marker.togglePopup(); // toggle popup open or closed
1
2
3
4
5
6

返回**标记** this

# getOffset

获取标记的偏移量。

返回**[Point][165]**标记的屏幕坐标(以像素为单位)。

# setOffset

设置标记的偏移量

# Parameters

  • offset **[PointLike][166]**作为要应用的[PointLike][166]对象相对于元素中心的偏移量(以像素为单位)。负数表示向左和向上。

返回**标记** this

# setDraggable

设置draggable标记的属性和功能

# Parameters

  • shouldBeDraggable **boolean**打开/关闭拖动功能(可选,默认false

返回**标记** this

# isDraggable

如果可以拖动标记,则返回 true

**boolean**如果标记是可拖动的,则返回True。

# setRotation

设置rotation标记的属性。

# Parameters

  • rotation **number**标记的旋转角度(顺时针,以度为单位),相对于其各自的Marker#setRotationAlignment设置。(可选,默认0

返回**标记** this

# getRotation

返回标记的当前旋转角度(以度为单位)。

返回**number**标记的当前旋转角度。

# setRotationAlignment

设置rotationAlignment标记的属性。

# Parameters

  • alignment **string**设置rotationAlignment标记的属性。(可选,默认'auto'

返回**标记** this

# getRotationAlignment

返回rotationAlignment标记的当前属性。

返回**string**标记的当前旋转对齐方式。

# setPitchAlignment

设置pitchAlignment标记的属性。

# Parameters

  • alignment string? 设置pitchAlignment标记的属性。如果对齐是“自动”,它会自动匹配rotationAlignment

返回**标记** this

# getPitchAlignment

返回pitchAlignment标记的当前属性。

返回**string**标记的当前音高对齐(以度为单位)。

# dragstart

拖动开始时触发

类型: Object

# Properties

  • marker 被拖动的**标记**对象

# drag

拖动时触发

类型: Object

# Properties

  • marker 被拖动的**标记**对象

# dragend

当标记完成拖动时触发

类型: Object

# Properties

  • marker 被拖动的**标记**对象