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 結果のイベント リスナー。
特定のリスナー関数を Maps Eventings システムの指定されたイベント名に追加します。
BetaremoveEventListener
removeEventListener(type, listener[, options])
パラメータ: 
  • type:  string イベント リスナーを削除するイベントのタイプを指定する文字列。
  • listener:  EventListener|EventListenerObject イベント ターゲットから削除するイベント ハンドラのイベント リスナー。
  • options:  boolean|EventListenerOptions optional オプションをご覧ください
戻り値:  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 によって異なる場合があります。

注: ウェブ コンポーネントとしての使用（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])
パラメータ: 
  • type:  string イベント リスナーを削除するイベントのタイプを指定する文字列。
  • listener:  EventListener|EventListenerObject イベント ターゲットから削除するイベント ハンドラのイベント リスナー。
  • options:  boolean|EventListenerOptions optional オプションをご覧ください
戻り値:  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
ピンのスケール。