Marker 类
google.maps.Marker
类
此类扩展 MVCObject
。
通过调用 const {Marker} = await google.maps.importLibrary("marker")
进行访问。请参阅 Maps JavaScript API 中的库。
构造函数 | |
---|---|
Marker |
Marker([opts]) 参数:
创建带有指定选项的标记。如果指定了地图,则系统会在构建时将标记添加到地图中。请注意,您必须设置标记的显示位置。 |
方法 | |
---|---|
getAnimation |
getAnimation() 参数:无
返回值:
Animation|null|undefined 获取当前正在运行的动画。 |
getClickable |
getClickable() 参数:无
返回值:
boolean 如果标记可点击,则为 true。获取 Marker 的可点击状态。 |
getCursor |
getCursor() 参数:无
返回值:
string|null|undefined 获取悬停光标时显示的鼠标光标类型。 |
getDraggable |
getDraggable() 参数:无
返回值:
boolean 如果标记可拖动,则返回 true。获取 Marker 的可拖动状态。 |
getIcon |
getIcon() 参数:无
获取 Marker 的图标。请参阅MarkerOptions.icon 。 |
getLabel |
getLabel() 参数:无
返回值:
MarkerLabel|string|null|undefined 获取 Marker 的标签。请参阅MarkerOptions.label 。 |
getMap |
getMap() 参数:无
获取渲染 Marker 的地图或全景图片。 |
getOpacity |
getOpacity() 参数:无
返回值:
number|null|undefined 一个 0.0 到 1.0 之间的数字。获取 Marker 的不透明度。 |
getPosition |
getPosition() 参数:无
返回值:
LatLng|null|undefined 获取 Marker 的位置。 |
getShape |
getShape() 参数:无
返回值:
MarkerShape|null|undefined |
getTitle |
getTitle() 参数:无
返回值:
string|null|undefined 获取 Marker 提示的标题。请参阅MarkerOptions.title 。 |
getVisible |
getVisible() 参数:无
返回值:
boolean 。如果标记可见,则为 true。获取 Marker 的可见性。 |
getZIndex |
getZIndex() 参数:无
返回值:
number|null|undefined 标记的 zIndex。获取 Marker 的 zIndex。请参阅MarkerOptions.zIndex 。 |
setAnimation |
setAnimation([animation]) 参数:
返回值:无
|
setClickable |
setClickable(flag) 参数:
返回值:无
设置 Marker 是否可点击。 |
setCursor |
setCursor([cursor]) 参数:
返回值:无
设置悬停时显示的鼠标光标类型。 |
setDraggable |
setDraggable(flag) 参数:
返回值:无
设置 Marker 是否可拖动。 |
setIcon |
setIcon([icon]) 返回值:无
为 Marker 设置图标。请参阅MarkerOptions.icon 。 |
setLabel |
setLabel([label]) 参数:
返回值:无
为 Marker 设置标签。请参阅MarkerOptions.label 。 |
setMap |
setMap(map) 参数:
返回值:无
在指定地图或全景图片上渲染 Marker 。如果地图设置为null ,系统会移除该标记。 |
setOpacity |
setOpacity([opacity]) 参数:
返回值:无
设置 Marker 的不透明度。 |
setOptions |
setOptions(options) 参数:
返回值:无
为 Marker 设置选项。 |
setPosition |
setPosition([latlng]) 参数:
返回值:无
为 Marker 设置位置。 |
setShape |
setShape([shape]) 参数:
返回值:无
|
setTitle |
setTitle([title]) 参数:
返回值:无
设置 Marker 提示的标题。请参阅MarkerOptions.title 。 |
setVisible |
setVisible(visible) 参数:
返回值:无
设置 Marker 是否可见。 |
setZIndex |
setZIndex([zIndex]) 参数:
返回值:无
设置 Marker 的 Z-index。请参阅MarkerOptions.zIndex 。 |
继承:addListener 、bindTo 、get 、notify 、set 、setValues 、unbind 、unbindAll |
常量 | |
---|---|
MAX_ZINDEX |
API 分配给标记的最大默认 Z-index。您可以设置较高的 Z-index 值,以使相关标记显示在前面。 |
活动 | |
---|---|
animation_changed |
function() 参数:None
当 Marker 动画属性发生变化时会触发此事件。 |
click |
function(event) 参数:
当用户点击 Marker 图标时会触发此事件。 |
clickable_changed |
function() 参数:None
当 Marker 可点击属性更改时会触发此事件。 |
contextmenu |
function(event) 参数:
对 Marker 触发 DOM 上下文菜单事件时会触发此事件 |
cursor_changed |
function() 参数:None
当 Marker 光标属性更改时会触发此事件。 |
dblclick |
function(event) 参数:
双击 Marker 图标时会触发此事件。 |
drag |
function(event) 参数:
用户拖动 Marker 时,系统会重复触发此事件。 |
dragend |
function(event) 参数:
此事件会在用户停止拖动 Marker 时触发。 |
draggable_changed |
function() 参数:None
当 Marker 可拖动属性发生更改时会触发此事件。 |
dragstart |
function(event) 参数:
用户开始拖动 Marker 时会触发此事件。 |
flat_changed |
function() 参数:None
当 Marker 平面属性发生更改时会触发此事件。 |
icon_changed |
function() 参数:None
当 Marker 图标属性更改时会触发此事件。 |
mousedown |
function(event) 参数:
针对 Marker 上的鼠标悬停触发此事件。 |
mouseout |
function(event) 参数:
当鼠标离开 Marker 图标的区域时会触发此事件。 |
mouseover |
function(event) 参数:
当鼠标进入 Marker 图标的区域时会触发此事件。 |
mouseup |
function(event) 参数:
对 Marker 触发鼠标事件会触发此事件。 |
position_changed |
function() 参数:None
当 Marker 位置属性更改时会触发此事件。 |
shape_changed |
function() 参数:None
当 Marker 形状属性发生更改时,就会触发此事件。 |
title_changed |
function() 参数:None
当 Marker 标题属性更改时会触发此事件。 |
visible_changed |
function() 参数:None
当 Marker 可见属性更改时会触发此事件。 |
zindex_changed |
function() 参数:None
Marker zIndex 属性更改时会触发此事件。 |
|
function(event) 参数:
右键点击 Marker 时会触发此事件。 |
MarkerOptions 接口
google.maps.MarkerOptions
接口
MarkerOptions 对象,用于定义可在 Marker 上设置的属性。
属性 | |
---|---|
anchorPoint optional |
类型:
Point optional 从标记位置到信息窗口的尖端的偏移量(以标记作为锚点打开)。 |
animation optional |
类型:
Animation optional 默认:
null 将标记添加到地图时所播放的动画。 |
clickable optional |
类型:
boolean optional 默认:
true 如果为 true ,则标记会接收鼠标和触摸事件。 |
|
类型:
string|CollisionBehavior optional 默认:
null 为矢量地图上的标记设置冲突行为。 |
crossOnDrag optional |
类型:
boolean optional 默认:
true 如果为 false ,则会停用拖动标记时十字路口。 |
cursor optional |
类型:
string optional 默认:
pointer 鼠标悬停时显示的鼠标光标类型。 |
draggable optional |
类型:
boolean optional 默认:
false 如果为 true ,则可以拖动标记。 |
icon optional |
前景的图标。如果提供了字符串,则会被视为字符串为 Icon ,且字符串为 url 。 |
label optional |
类型:
string|MarkerLabel optional 默认:
null 向标记添加标签。标记标签是显示在标记内的字母或数字。标签可以是字符串,也可以是 MarkerLabel 对象。如果提供,但未提供 MarkerOptions.title ,则系统会将无障碍文本(例如,与屏幕阅读器结合使用)添加到包含所提供标签文本的标记中。请注意,label 目前仅用于未优化标记的无障碍文本。 |
map optional |
类型:
Map|StreetViewPanorama optional 要在其上显示标记的地图。地图是显示标记所必需的。如果未在标记构建中提供地图,可以使用 Marker.setMap 来提供地图。 |
opacity optional |
类型:
number optional 默认:1.0
介于 0.0(透明)和 1.0(不透明)之间的数字。 |
optimized optional |
类型:
boolean optional 您可以通过优化将多个标记渲染为单个静态元素,从而提高性能。在需要大量标记的情况下,这会非常有用。详细了解标记优化。 |
position optional |
类型:
LatLng|LatLngLiteral optional 设置标记位置。您可以构建标记,但在提供其位置之前不会显示该标记,例如,根据用户的操作或选择。如果在标记构建时未提供标记位置,则可以使用 Marker.setPosition 为其提供位置。 |
shape optional |
类型:
MarkerShape optional 用于拖动/点击的图像地图区域定义。 |
title optional |
类型:
string optional 默认:
undefined 鼠标悬停时显示的文本。如果提供的话,则无障碍文本(例如,供屏幕阅读器使用)会添加到具有所提供的值的标记中。请注意, title 目前仅用于未优化标记的无障碍文本。 |
visible optional |
类型:
boolean optional 默认:
true 如果为 true ,则表示标记可见。 |
zIndex optional |
类型:
number optional 所有标记均按其 zIndex 的顺序在地图上显示,值较大的标记会显示在值较小的标记之前。默认情况下,标记会按照它们在屏幕上的垂直位置来显示,位置较低的标记会显示在位置较高的标记之前。 |
CollisionBehavior 常量
google.maps.CollisionBehavior
常量
通过调用 const {CollisionBehavior} = await google.maps.importLibrary("marker")
进行访问。请参阅 Maps JavaScript API 中的库。
常量 | |
---|---|
OPTIONAL_AND_HIDES_LOWER_PRIORITY |
仅在标记未与其他标记重叠时才显示该标记。如果此类型的两个标记发生重叠,则会显示 ZIndex 较高的标记。如果它们的 zIndex 相同,则会显示垂直屏幕位置较低的 Z-index。 |
REQUIRED |
无论冲突如何,一律显示标记。这是默认行为。 |
REQUIRED_AND_HIDES_OPTIONAL |
无论冲突如何,一律显示标记,并隐藏与标记重叠的所有 OPTIONAL_AND_HIDES_LOWER_PRIORITY 标记或标签。 |
图标界面
google.maps.Icon
接口
一个表示标记图标图像的结构。
属性 | |
---|---|
url |
类型:
string 图片或拼合图片的网址。 |
anchor optional |
类型:
Point optional 与标记在地图上的位置相对应的锚定图片位置。默认情况下,锚点会放置在图片底部的中心点附近。 |
labelOrigin optional |
类型:
Point optional 标签相对于图标图片左上角的来源(如果标记提供了标签)。默认情况下,原点位于图片的中心点。 |
origin optional |
类型:
Point optional 图片在拼合图片中的位置(如果有的话)。默认情况下,原点位于图片 (0, 0) 的左上角。 |
scaledSize optional |
类型:
Size optional 进行缩放后的整幅图片的尺寸(如果有的话)。可使用此属性伸展/收缩图片或拼合图片。 |
size optional |
类型:
Size optional 拼合图片或图片的显示尺寸。使用拼合图片时必须指定其尺寸。如果未提供尺寸,则系统会在加载图片时进行设置。 |
MarkerLabel 接口
google.maps.MarkerLabel
接口
这些选项可指定标记标签的外观。标记标签是将显示在标记内的字符串(通常是单个字符)。搭配自定义标记使用 Icon
类中的 labelOrigin
属性可为其重新定位。
属性 | |
---|---|
text |
类型:
string 要在标签中显示的文本。 |
className optional |
类型:
string optional 默认:
'' (空字符串)标签元素的 className 属性(等同于元素的类属性)。您可以添加多个以空格分隔的 CSS 类。字体颜色、大小、粗细和系列只能通过 MarkerLabel 的其他属性设置。不应同时使用 CSS 类更改标签的位置或方向(例如,使用翻译和旋转),同时使用标记冲突管理。 |
color optional |
类型:
string optional 默认:
'black' 标签文本的颜色。 |
fontFamily optional |
类型:
string optional 标签文本的字体系列(等同于 CSS font-family 属性)。 |
fontSize optional |
类型:
string optional 默认:
'14px' 标签文字的字体大小(等同于 CSS 字体大小属性)。 |
fontWeight optional |
类型:
string optional 标签文字的字体粗细(等同于 CSS 字体粗细属性)。 |
MarkerShape 接口
google.maps.MarkerShape
接口
该对象可定义标记图像的可点击区域。该形状由两个属性(type
和 coord
)组成,这两个属性用于定义图片的非透明区域。
属性 | |
---|---|
coords |
类型:
Array<number> 此属性的格式取决于 type 的值,并遵循 http://www.w3.org/TR/REC-html40/struct/objects.html#adef-coords 中的 w3 AREA coords 规范。coords 属性是一个整数数组,用于指定形状相对于目标图片左上角的像素位置。坐标取决于 type 的值,如下所示:- circle :坐标为 [x1,y1,r] ,其中 x1,y2 为圆心的坐标,r 为圆的半径。- poly :坐标为 [x1,y1,x2,y2...xn,yn] ,其中每个 x,y 对都包含多边形一个顶点的坐标。- rect :坐标为 [x1,y1,x2,y2] ,其中 x1,y1 是矩形左上角的坐标,x2,y2 是矩形右下角的坐标。 |
type |
类型:
string 描述形状的类型,可以是 circle 、poly 或 rect 。 |
Symbol 接口
google.maps.Symbol
接口
描述符号,其中包含带样式的矢量路径。符号可用作标记的图标,也可放置在多段线上。
属性 | |
---|---|
path |
类型:
SymbolPath|string 符号的路径(内置符号路径)或以 SVG 路径表示法表示的自定义路径。必需。 |
anchor optional |
类型:
Point optional 默认:
google.maps.Point(0,0) 符号相对于标记或多段线的位置。符号路径的坐标分别由锚定点的x坐标和y坐标向左和向上进行转换。位置使用与符号路径相同的坐标系表示。 |
fillColor optional |
类型:
string optional 符号的填充颜色。支持所有CSS3颜色,扩展命名的颜色除外。对于符号标记,此属性默认为“black”。对于多段线上的符号,这默认为相应多段线的描边颜色。 |
fillOpacity optional |
类型:
number optional 默认:
0 符号的填充不透明度。 |
labelOrigin optional |
类型:
Point optional 默认:
google.maps.Point(0,0) 标签的路径相对于路径起点(如果标签由标记提供)。原点以与符号路径相同的坐标系表示。此属性不适用于多段线上的符号。 |
rotation optional |
类型:
number optional 默认:
0 符号的旋转角度,以顺时针度数表示。 IconSequence 中的符号(其中 fixedRotation 为 false )相对于其所在边缘的角度进行旋转。 |
scale optional |
类型:
number optional 符号大小的缩放幅度。对于符号标记,默认值为 1;缩放后的符号大小不受限制。对于多段线上的符号,此参数默认为多段线的描边粗细;经过缩放后,符号必须位于以符号锚点为中心的 22 像素方形范围内。 |
strokeColor optional |
类型:
string optional 符号的描边颜色。支持所有CSS3颜色,扩展命名的颜色除外。对于符号标记,此属性默认为“black”。对于多段线上的符号,此参数默认为多段线的描边颜色。 |
strokeOpacity optional |
类型:
number optional 符号的描边不透明度。对于符号标记,默认值为 1。对于多段线上的符号,此参数默认为多段线的描边不透明度。 |
strokeWeight optional |
类型:
number optional 默认:符号的
Symbol.scale 。符号的描边粗细。 |
SymbolPath 常量
google.maps.SymbolPath
常量
内置符号路径。
通过调用 const {SymbolPath} = await google.maps.importLibrary("core")
进行访问。请参阅 Maps JavaScript API 中的库。
常量 | |
---|---|
BACKWARD_CLOSED_ARROW |
一个向后指向的闭合箭头。 |
BACKWARD_OPEN_ARROW |
一个向后箭头。 |
CIRCLE |
圆形。 |
FORWARD_CLOSED_ARROW |
一个指向前方的闭合箭头。 |
FORWARD_OPEN_ARROW |
一个向前指向的开放式箭头。 |
动画常量
google.maps.Animation
常量
可以在标记上播放的动画。对标记使用 Marker.setAnimation
方法,或使用 MarkerOptions.animation
选项播放动画。
通过调用 const {Animation} = await google.maps.importLibrary("marker")
进行访问。请参阅 Maps JavaScript API 中的库。
常量 | |
---|---|
BOUNCE |
标记会使用 null 调用 Marker.setAnimation ,直至动画停止播放为止。 |
DROP |
标记会从地图顶部下落到其最终位置。一旦标记停止移动,动画即停止,并且 Marker.getAnimation 将返回 null 。这种类型的动画通常在创建标记的过程中指定。 |