Advanced Markers

AdvancedMarkerElement 類別

google.maps.marker.AdvancedMarkerElement 類別

顯示地圖上的位置。請注意，您必須設定 position，系統才會顯示 AdvancedMarkerElement。

注意：做為網頁元件使用 (例如使用自訂 <gmp-advanced-marker> HTML 元素，但只能透過 v=beta 頻道使用)。

自訂元素：
<gmp-advanced-marker position="lat,lng" title="string"></gmp-advanced-marker>

這個類別會擴充 HTMLElement。

這個類別會實作 AdvancedMarkerElementOptions。

呼叫 const {AdvancedMarkerElement} = await google.maps.importLibrary("marker") 即可存取。請參閱 Maps JavaScript API 中的程式庫。
AdvancedMarkerElement
AdvancedMarkerElement([options])
參數： 
使用指定的選項建立 AdvancedMarkerElement。如果指定地圖，系統會在建構地圖時將 AdvancedMarkerElement 加入地圖。
collisionBehavior
類型：  CollisionBehavior optional
查看《AdvancedMarkerElementOptions.collisionBehavior》。
content
類型：  Node optional
查看《AdvancedMarkerElementOptions.content》。
element
類型：  HTMLElement
這是唯讀欄位。支援檢視畫面的 DOM 元素。
gmpDraggable
類型：  boolean optional
查看《AdvancedMarkerElementOptions.gmpDraggable》。
map
類型：  Map optional
查看《AdvancedMarkerElementOptions.map》。
position
查看《AdvancedMarkerElementOptions.position》。
HTML 屬性：
  • <gmp-advanced-marker position="lat,lng"></gmp-advanced-marker>
  • <gmp-advanced-marker position="lat,lng,altitude"></gmp-advanced-marker>
title
類型：  string
查看《AdvancedMarkerElementOptions.title》。
HTML 屬性：
  • <gmp-advanced-marker title="string"></gmp-advanced-marker>
zIndex
類型：  number optional
查看《AdvancedMarkerElementOptions.zIndex》。
BetaaddEventListener
addEventListener(type, listener[, options])
參數： 
  • type：string 這是區分大小寫的字串，代表要監聽的事件類型。
  • listener：EventListener|EventListenerObject 接收通知的物件。這必須是內含 handleEvent 方法的函式或物件
  • options：boolean|AddEventListenerOptions optional 查看選項。自訂事件僅支援 capture 和 passive。
傳回值：  void
設定會在指定事件傳送至目標時呼叫的函式。詳情請參閱 addEventListener
addListener
addListener(eventName, handler)
參數： 
  • eventName：string 觀察到的事件。
  • handler：Function 處理事件的函式。
傳回值：  MapsEventListener 結果事件監聽器。
將指定的事件監聽器函式新增至地圖事件系統中的特定事件名稱。
BetaremoveEventListener
removeEventListener(type, listener[, options])
參數： 
傳回值：  void
從目標中移除先前使用 addEventListener 註冊的事件監聽器。詳情請參閱「removeEventListener」
click
function(event)
引數： 
按一下 AdvancedMarkerElement 元素時，會觸發此事件。

addEventListener() 不適用，請改用 gmp-click。
drag
function(event)
引數： 
使用者拖曳 AdvancedMarkerElement 時，會重複觸發此事件。

addEventListener() 無法使用。
dragend
function(event)
引數： 
使用者停止拖曳 AdvancedMarkerElement 時，會觸發此事件。

addEventListener() 無法使用。
dragstart
function(event)
引數： 
使用者開始拖曳 AdvancedMarkerElement 時，會觸發此事件。

addEventListener() 無法使用。
Betagmp-click
function(event)
引數： 
按一下 AdvancedMarkerElement 元素時，會觸發此事件。最適合與 addEventListener() (而非 addListener()) 搭配使用。

AdvancedMarkerElementOptions 介面

google.maps.marker.AdvancedMarkerElementOptions 介面

建構 AdvancedMarkerElement 的選項。
collisionBehavior optional
類型：  CollisionBehavior optional
此列舉可指定 AdvancedMarkerElement 與其他 AdvancedMarkerElement 或向量地圖上的基本地圖標籤衝突時應採取的行為。

注意：AdvancedMarkerElement 到 AdvancedMarkerElement 衝突適用於光柵地圖和向量地圖，但基本地圖的標籤衝突僅適用於向量地圖。AdvancedMarkerElement
content optional
類型：  Node optional
支援 AdvancedMarkerElement 影像的 DOM 元素。

注意：AdvancedMarkerElement 不會複製傳入的 DOM 元素。將 DOM 元素傳遞至 AdvancedMarkerElement 後，如果將相同的 DOM 元素傳遞至另一個 AdvancedMarkerElement，就會移動 DOM 元素，導致先前的 AdvancedMarkerElement 呈現空白。
gmpDraggable optional
類型：  boolean optional
預設： false
如果為 true，則可以拖曳 AdvancedMarkerElement。

注意：您無法拖曳高度的 AdvancedMarkerElement。
map optional
類型：  Map optional
要顯示 AdvancedMarkerElement 的地圖。需要地圖顯示 AdvancedMarkerElement，若建構期間未提供，則可設定 AdvancedMarkerElement.map 以提供地圖。
position optional
設定 AdvancedMarkerElement 的位置。建構 AdvancedMarkerElement 時可能不會有位置，但在提供位置之後才會顯示，例如使用者的動作或選項。如果建構時未提供 AdvancedMarkerElement，則可設定 AdvancedMarkerElement.position 來提供 AdvancedMarkerElement 的位置。

注意：只有向量地圖支援包含海拔高度的 AdvancedMarkerElement。
title optional
類型：  string optional
滑鼠遊標懸停效果文字。如有提供，則會在 AdvancedMarkerElement 中加入提供的值，例如用於螢幕閱讀器。
zIndex optional
類型：  number optional
所有AdvancedMarkerElement 都會依其 zIndex 順序顯示在地圖上，值較大的會顯示在值較小的 AdvancedMarkerElement 前面。根據預設，AdvancedMarkerElement 會根據其在螢幕上的垂直位置顯示，AdvancedMarkerElement 則會顯示在畫面較遠的AdvancedMarkerElement前方。請注意，zIndex 也可用於協助判斷 CollisionBehavior.OPTIONAL_AND_HIDES_LOWER_PRIORITY 進階標記之間的相對優先順序。zIndex 值越高，表示優先順序越高。

AdvancedMarkerClickEvent 類別

google.maps.marker.AdvancedMarkerClickEvent 類別

這個事件是透過點選進階標記來建立。使用 event.target.position 存取標記位置。

這個類別會擴充 Event。

呼叫 const {AdvancedMarkerClickEvent} = await google.maps.importLibrary("marker") 即可存取。請參閱 Maps JavaScript API 中的程式庫。

PinElement 類別

google.maps.marker.PinElement 類別

PinElement 代表 DOM 元素，由形狀和字符組成。形狀的氣球樣式與預設 AdvancedMarkerElement 中顯示的樣式相同。字符是選用的 DOM 元素，會顯示在氣球形狀中。PinElement 的顯示比例可能因 PinElement.scale 而異。

注意：目前不支援做為 Web 元件使用 (例如做為 HTMLElement 子類別或透過 HTML 使用)。

這個類別會擴充 HTMLElement。

這個類別會實作 PinElementOptions。

呼叫 const {PinElement} = await google.maps.importLibrary("marker") 即可存取。請參閱 Maps JavaScript API 中的程式庫。
PinElement
PinElement([options])
參數： 
background
類型：  string optional
查看《PinElementOptions.background》。
borderColor
類型：  string optional
查看《PinElementOptions.borderColor》。
element
類型：  HTMLElement
這是唯讀欄位。支援檢視畫面的 DOM 元素。
glyph
類型：  string|Element|URL optional
查看《PinElementOptions.glyph》。
glyphColor
類型：  string optional
查看《PinElementOptions.glyphColor》。
scale
類型：  number optional
查看《PinElementOptions.scale》。
BetaaddEventListener
addEventListener(type, listener[, options])
參數： 
傳回值：  void
此函式目前尚未開放使用。
BetaremoveEventListener
removeEventListener(type, listener[, options])
參數： 
傳回值：  void
從目標中移除先前使用 addEventListener 註冊的事件監聽器。詳情請參閱「removeEventListener」

PinElementOptions 介面

google.maps.marker.PinElementOptions 介面

建立 PinElement 的選項。
background optional
類型：  string optional
圖釘形狀的背景顏色。支援任何 CSS 顏色值。
borderColor optional
類型：  string optional
圖釘形狀的邊框顏色。支援任何 CSS 顏色值。
glyph optional
類型：  string|Element|URL optional
圖釘中顯示的 DOM 元素。
glyphColor optional
類型：  string optional
字符的顏色。支援任何 CSS 顏色值。
scale optional
類型：  number optional
預設： 1
針腳的比例。