Marker

Marker 類別

google.maps.Marker 類別

此類別會擴充 MVCObject

使用 v=beta 時,可透過呼叫 const {Marker} = await google.map.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()
參數:
傳回值:string|Icon|null|Symbol|undefined
取得 Marker 的圖示。詳情請參閱《MarkerOptions.icon》。
getLabel
getLabel()
參數:
傳回值:MarkerLabel|null|string|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
取得用於互動的 Marker 形狀。詳情請參閱《MarkerOptions.shape》和《MarkerShape》。
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])
參數:
  • animationAnimation optional要播放的動畫。
傳回值:
啟動動畫。所有正在進行的動畫都會取消。目前支援的動畫為:Animation.BOUNCEAnimation.DROP。如果傳入 null,任何動畫都會停止。
setClickable
setClickable(flag)
參數:
  • flagboolean如果設為 true,則可按一下標記。
傳回值:
設定 Marker 是否可點擊。
setCursor
setCursor([cursor])
參數:
  • cursorstring optional滑鼠遊標類型。
傳回值:
設定滑鼠遊標懸停時顯示的滑鼠遊標類型。
setDraggable
setDraggable(flag)
參數:
  • flagboolean optional如果設為 true,可以拖曳標記。
傳回值:
設定 Marker 是否可拖曳。
setIcon
setIcon([icon])
參數:
傳回值:
設定 Marker 的圖示。詳情請參閱《MarkerOptions.icon》。
setLabel
setLabel([label])
參數:
傳回值:
設定 Marker 的標籤。詳情請參閱《MarkerOptions.label》。
setMap
setMap(map)
參數:
傳回值:
在指定地圖或全景上轉譯 Marker。如果將地圖設為 null,系統就會移除標記。
setOpacity
setOpacity([opacity])
參數:
  • opacitynumber optional介於 0.0、透明和 1.0 之間的不透明數字。
傳回值:
設定 Marker 的不透明度。
setOptions
setOptions(options)
參數:
傳回值:
設定 Marker 的選項。
setPosition
setPosition([latlng])
參數:
傳回值:
設定 Marker 的郵局。
setShape
setShape([shape])
參數:
傳回值:
設定用於互動的 Marker 形狀。詳情請參閱《MarkerOptions.shape》和《MarkerShape》。
setTitle
setTitle([title])
參數:
  • titlestring optional
傳回值:
設定 Marker 工具提示的標題。詳情請參閱《MarkerOptions.title》。
setVisible
setVisible(visible)
參數:
  • visibleboolean 若為 true,則會顯示標記
傳回值:
設定是否顯示 Marker
setZIndex
setZIndex([zIndex])
參數:
  • zIndexnumber optional
傳回值:
設定 Marker 的 zIndex。詳情請參閱《MarkerOptions.zIndex》。
繼承: addListenerbindTogetnotifysetsetValuesunbindunbindAll
MAX_ZINDEX API 將會指派給標記的最大預設 Z 索引。您可以設定較高的 Z 索引,將標記置於最前方。
animation_changed
function()
引數:
Marker 動畫屬性變更時,即會觸發此事件。
click
function(event)
引數:
按下 Marker 圖示時,會觸發此事件。
clickable_changed
function()
引數:
Marker 可點擊屬性變更時,即會觸發此事件。
contextmenu
function(event)
引數:
Marker
cursor_changed
function()
引數:
Marker 遊標屬性變更時,即會觸發此事件。
dblclick
function(event)
引數:
按兩下 Marker 圖示時,會觸發此事件。
drag
function(event)
引數:
這個事件會在使用者拖曳 Marker 時重複觸發。
dragend
function(event)
引數:
使用者停止拖曳 Marker 時,就會觸發此事件。
draggable_changed
function()
引數:
Marker 可拖曳屬性變更時,即會觸發此事件。
dragstart
function(event)
引數:
使用者開始拖曳 Marker 時,就會觸發此事件。
flat_changed
function()
引數:
Marker 平面屬性變更時,會觸發此事件。
icon_changed
function()
引數:
Marker 圖示屬性變更時,即會觸發此事件。
mousedown
function(event)
引數:
這個事件會在 Marker 上向下移動。
mouseout
function(event)
引數:
滑鼠離開 Marker 圖示的區域時,會觸發此事件。
mouseover
function(event)
引數:
滑鼠進入 Marker 圖示的區域時,會觸發此事件。
mouseup
function(event)
引數:
這個事件會在 Marker 上向上移動。
position_changed
function()
引數:
Marker 位置屬性變更時,會觸發此事件。
shape_changed
function()
引數:
Marker 形狀屬性變更時,會觸發此事件。
title_changed
function()
引數:
Marker 標題屬性變更時,即會觸發此事件。
visible_changed
function()
引數:
Marker 可見屬性變更時,即會觸發此事件。
zindex_changed
function()
引數:
Marker zIndex 屬性變更時,會觸發此事件。
rightclick
function(event)
引數:
Marker 按一下滑鼠右鍵時就會啟動此事件。

MarkerOptions 介面

google.maps.MarkerOptions 介面

MarkerOptions 物件,用來定義可在標記上設定的屬性。

anchorPoint optional
類型:Point optional
從標記位置到開啟資訊視窗的資訊視窗的偏移值,已經以標記作為錨定開啟。
animation optional
類型:Animation optional
預設:null
在地圖中新增標記時所要播放的動畫。
clickable optional
類型:boolean optional
預設:true
如果為 true,標記會接收滑鼠和觸控事件。
BetacollisionBehavior optional
類型:string|CollisionBehavior optional
預設:null
為向量地圖上的標記設定衝突行為。
crossOnDrag optional
類型:boolean optional
預設:true
如為 false,請在拖曳時停用標記下方顯示的交叉線。
cursor optional
類型:string optional
預設:pointer
滑鼠遊標懸停時顯示的滑鼠遊標類型。
draggable optional
類型:boolean optional
預設:false
如果為 true,可以拖曳標記。
icon optional
類型:string|Icon|Symbol 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 常數

使用 v=beta 時,可透過呼叫 const {CollisionBehavior} = await google.map.importLibrary("marker") 來存取請參閱 Maps JavaScript API 中的程式庫

OPTIONAL_AND_HIDES_LOWER_PRIORITY 這個標記只有在與其他標記重疊時才會顯示。如果這類型的兩個標記會重疊,系統會顯示 zIndex 較高的標記。如果 ZIndex 的 ZIndex 相同,則會顯示垂直螢幕位置較低的那一個。
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 font-size 屬性)。
fontWeight optional
類型:string optional
標籤文字的字型粗細 (等同於 CSS font-weight 屬性)。

MarkerShape 介面

google.maps.MarkerShape 介面

此物件定義標記圖片的可點擊區域。形狀包含兩個屬性:typecoord,可定義圖片的不透明區域。

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
說明形狀的類型,可以是 circlepolyrect

Symbol 介面

google.maps.Symbol 介面

描述一個符號,由包含樣式的向量路徑所組成。符號可以用作標記的圖示,也可以放在折線中。

path
類型:SymbolPath|string
符號的路徑,這是內建符號路徑,或使用 SVG 路徑標記法表示的自訂路徑。這是必填欄位。
anchor optional
類型:Point optional
預設:google.maps.Point(0,0)
符號相對於標記或折線的位置。符號的路徑座標會分別根據錨點的 x 和 y 座標轉譯成左方和上方的位置。這個位置會以與符號路徑相同的座標系統表示。
fillColor optional
類型:string optional
符號的填滿色彩。系統支援所有 CSS3 色彩 (延伸的具名色彩除外)。如果是符號標記,則預設為 [黑色]。如果是折線上的符號,則會預設為對應折線的筆劃顏色。
fillOpacity optional
類型:number optional
預設:0
符號的透明度透明度。
labelOrigin optional
類型:Point optional
預設:google.maps.Point(0,0)
標籤的來源 (即路徑的來源,如果標記是由標記提供)。起點以與符號路徑相同的座標系統表示。這項屬性不適用於折線上的符號。
rotation optional
類型:number optional
預設:0
符號的旋轉角度,以順時針角度表示。在 IconSequence 中,fixedRotationfalse 的符號相對於其所在邊緣的角度旋轉。
scale optional
類型:number optional
符號的大小比例。對符號標記而言,預設值為 1;縮放後,該符號可以是任何大小。如果是折線上的符號,這個欄位會預設為折線的筆劃粗細;縮放後,符號必須位於正方形的 22 像素大小 (以符號的錨點為中心)。
strokeColor optional
類型:string optional
符號的筆劃顏色。系統支援所有 CSS3 色彩 (延伸的具名色彩除外)。如果是符號標記,則預設為 [黑色]。如果是折線上的符號,則會預設為折線的筆劃顏色。
strokeOpacity optional
類型:number optional
符號的筆劃透明度。針對符號標記,預設值為 1。如果是折線上的符號,系統會將該線條預設為折線的筆劃透明度。
strokeWeight optional
類型:number optional
預設:符號的 Symbol.scale
符號的筆劃粗細。

SymbolPath 常數

google.maps.SymbolPath 常數

內建符號路徑。

使用 v=beta 時,可透過呼叫 const {SymbolPath} = await google.map.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 選項來播放動畫。

使用 v=beta 時,可透過呼叫 const {Animation} = await google.map.importLibrary("marker") 來存取請參閱 Maps JavaScript API 中的程式庫

BOUNCE 透過呼叫 null 呼叫 Marker.setAnimation,標記將停止,直到動畫停止為止。
DROP 標記從地圖頂端落入其最終位置。當標記停止時,動畫會停止,Marker.getAnimation 會傳回 null。這類動畫通常在建立標記時指定。