Advanced Markers (beta)

コレクションでコンテンツを整理 必要に応じて、コンテンツの保存と分類を行います。

AdvancedMarkerView クラス

google.maps.marker.AdvancedMarkerView クラス

指定されたオプションを使用して AdvancedMarkerView を作成します。地図を指定すると、作成時に AdvancedMarkerView が地図に追加されます。AdvancedMarkerView を表示するには、位置を設定する必要があります。

このクラスは AdvancedMarkerViewOptions を実装します。

&libraries=marker URL パラメータを使用して読み込みます。詳しくは、Maps JavaScript API のライブラリをご覧ください。

v=beta を使用している場合は、const {AdvancedMarkerView} = await google.map.importLibrary("marker") を呼び出してアクセスできます。詳しくは、Maps JavaScript API のライブラリをご覧ください。
AdvancedMarkerView
AdvancedMarkerView([options])
パラメータ:
collisionBehavior
タイプ: CollisionBehavior optional
AdvancedMarkerViewOptions.collisionBehaviorをご確認ください。
content
タイプ: Element optional
AdvancedMarkerViewOptions.contentをご確認ください。
draggable
タイプ: boolean optional
AdvancedMarkerViewOptions.draggableをご確認ください。
element optional
タイプ: HTMLElement|SVGElement optional
このフィールドは読み取り専用です。ビューを支える DOM 要素。
map
タイプ: Map optional
AdvancedMarkerViewOptions.mapをご確認ください。
position
AdvancedMarkerViewOptions.positionをご確認ください。
title
タイプ: string optional
AdvancedMarkerViewOptions.titleをご確認ください。
zIndex
タイプ: number optional
AdvancedMarkerViewOptions.zIndexをご確認ください。
addListener
addListener(eventName, handler)
パラメータ:
戻り値: MapsEventListener
指定されたリスナーを、指定したイベント名に追加します。
click
function(event)
引数:
このイベントは、AdvancedMarkerView 要素がクリックされると発生します。
drag
function(event)
引数:
このイベントは、ユーザーが AdvancedMarkerView をドラッグしている間に繰り返し発生します。
dragend
function(event)
引数:
このイベントは、ユーザーが AdvancedMarkerView のドラッグを停止すると発生します。
dragstart
function(event)
引数:
このイベントは、ユーザーが AdvancedMarkerView をドラッグし始めると発生します。

AdvancedMarkerViewOptions インターフェース

google.maps.marker.AdvancedMarkerViewOptions インターフェース

AdvancedMarkerView を作成するためのオプション。
collisionBehavior optional
タイプ: CollisionBehavior optional
AdvancedMarkerView が別の AdvancedMarkerView またはベクター地図のベースマップのラベルと競合したときの動作を指定する列挙型。

注: AdvancedMarkerView と AdvancedMarkerView の競合はラスター地図とベクター地図の両方で機能しますが、AdvancedMarkerView の競合は基本地図のラベル競合で処理されるのはベクター地図のみです。
content optional
タイプ: Element optional
デフォルト: PinView.element
AdvancedMarkerView のビジュアルを支える DOM 要素。

注: AdvancedMarkerView は、渡された DOM 要素のクローンを作成しません。DOM 要素が AdvancedMarkerView に渡されると、同じ DOM 要素を別の AdvancedMarkerView に渡すと DOM 要素を移動し、以前の AdvancedMarkerView は空になります。
draggable optional
タイプ: boolean optional
デフォルト: false
true の場合は、AdvancedMarkerView をドラッグできます。

注: 標高のある AdvancedMarkerView はドラッグできません。
element optional
タイプ: HTMLElement|SVGElement optional
このフィールドは読み取り専用です。ビューを支える DOM 要素。
map optional
タイプ: Map optional
AdvancedMarkerView を表示する地図。この地図は AdvancedMarkerView を表示するために必要です。これは、作成時に AdvancedMarkerView.map を指定しない場合に指定できます。
position optional
AdvancedMarkerView の位置を設定します。AdvancedMarkerView は、ポジションなしで作成できますが、その位置（たとえば、ユーザーのアクションや選択）が提供されるまでは表示されません。AdvancedMarkerView の位置は、構築時に指定されていない場合は AdvancedMarkerView.position を設定することで指定できます。

注: 標高を指定した AdvancedMarkerView は、ベクター地図でのみ使用できます。
title optional
タイプ: string optional
ロールオーバー テキスト。指定すると、ユーザー補助テキスト（スクリーン リーダーでの使用など）が、指定された値で AdvancedMarkerView に追加されます。
zIndex optional
タイプ: number optional
すべての sAdvancedMarkerView が zIndex の順で地図上に表示されます。つまり、この値が大きいほど、値が小さい AdvancedMarkerView より前に表示されています。デフォルトでは、AdvancedMarkerViewは画面の垂直方向の位置に応じて表示され、低いAdvancedMarkerViewは画面のAdvancedMarkerView手前に表示されます。zIndex は、CollisionBehavior.OPTIONAL_AND_HIDES_LOWER_PRIORITY 高度なマーカー間の相対的な優先度を判断する際にも役立ちます。zIndex の値が高いほど優先度が高くなります。

PinView クラス

google.maps.marker.PinView クラス

PinView は、シェイプとグリフで構成される DOM 要素を表します。シェイプのバルーン スタイルは、デフォルトの AdvancedMarkerView のものと同じです。グリフは、バルーン形状で表示されるオプションの DOM 要素です。PinView は、PinView.scale に応じてアスペクト比が異なる場合があります。

このクラスは PinViewOptions を実装します。

&libraries=marker URL パラメータを使用して読み込みます。詳しくは、Maps JavaScript API のライブラリをご覧ください。

v=beta を使用している場合は、const {PinView} = await google.map.importLibrary("marker") を呼び出してアクセスできます。詳しくは、Maps JavaScript API のライブラリをご覧ください。
PinView
PinView([options])
パラメータ:
background
タイプ: string optional
PinViewOptions.backgroundをご確認ください。
borderColor
タイプ: string optional
PinViewOptions.borderColorをご確認ください。
element optional
タイプ: HTMLElement|SVGElement optional
このフィールドは読み取り専用です。ビューを支える DOM 要素。
glyph
タイプ: string|Element|URL optional
PinViewOptions.glyphをご確認ください。
glyphColor
タイプ: string optional
PinViewOptions.glyphColorをご確認ください。
scale
タイプ: number optional
PinViewOptions.scaleをご確認ください。
addListener
addListener(eventName, handler)
パラメータ:
戻り値: MapsEventListener
指定されたリスナーを、指定したイベント名に追加します。

PinViewOptions インターフェース

google.maps.marker.PinViewOptions インターフェース

PinView を作成するためのオプション。
background optional
タイプ: string optional
ピンの形状の背景色。任意の CSS 色値をサポートします。
borderColor optional
タイプ: string optional
ピンの形状の枠線の色。任意の CSS 色値をサポートします。
element optional
タイプ: HTMLElement|SVGElement optional
このフィールドは読み取り専用です。ビューを支える DOM 要素。
glyph optional
タイプ: string|Element|URL optional
ピンに表示される DOM 要素。
glyphColor optional
タイプ: string optional
グリフの色。任意の CSS 色値をサポートします。
scale optional
タイプ: number optional
デフォルト: 1
ピンのスケール。