Advanced Markers

AdvancedMarkerElement 類別

google.maps.marker.AdvancedMarkerElement 類別

在地圖上顯示位置。請注意，您必須為 AdvancedMarkerElement 設定 position，以供顯示。

注意：以網站元件的形式使用 (例如使用自訂 <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
預設值： PinElement.element
支援 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。
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 Components 中使用 (例如做為 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
圖釘尺寸。