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 |
content |
タイプ:
Node optional AdvancedMarkerElementOptions.content をご確認ください。 |
element |
タイプ:
HTMLElement このフィールドは読み取り専用です。ビューの背後にある DOM 要素。 |
gmpDraggable |
タイプ:
boolean optional |
map |
タイプ:
Map optional AdvancedMarkerElementOptions.map をご確認ください。 |
position |
タイプ:
LatLng|LatLngLiteral|LatLngAltitude|LatLngAltitudeLiteral optional HTML 属性:
|
title |
タイプ:
string AdvancedMarkerElementOptions.title をご確認ください。HTML 属性:
|
zIndex |
タイプ:
number optional AdvancedMarkerElementOptions.zIndex をご確認ください。 |
メソッド | |
---|---|
addEventListener |
addEventListener(type, listener[, options]) パラメータ:
戻り値:
void 指定されたイベントがターゲットに配信されるたびに呼び出される関数を設定します。addEventListener をご覧ください。 |
addListener |
addListener(eventName, handler) パラメータ:
戻り値:
MapsEventListener 結果のイベント リスナー。指定されたリスナー関数を、マップ イベント システムの指定されたイベント名に追加します。 |
removeEventListener |
removeEventListener(type, listener[, options]) パラメータ:
戻り値:
void 以前に addEventListener で登録されたイベント リスナーをターゲットから削除します。removeEventListener をご覧ください。 |
イベント | |
---|---|
click |
function(event) 引数:
このイベントは、 AdvancedMarkerElement 要素がクリックされると発生します。addEventListener() では使用できません(代わりに gmp-click を使用してください)。 |
drag |
function(event) 引数:
|
dragend |
function(event) 引数:
|
dragstart |
function(event) 引数:
|
gmp-click |
function(event) 引数:
このイベントは、 AdvancedMarkerElement 要素がクリックされると発生します。addListener() ではなく addEventListener() で使用することをおすすめします。 |
AdvancedMarkerElementOptions インターフェース
google.maps.marker.AdvancedMarkerElementOptions
インターフェース
AdvancedMarkerElement
を作成するためのオプション。
プロパティ | |
---|---|
collisionBehavior optional |
タイプ:
CollisionBehavior optional AdvancedMarkerElement が別の AdvancedMarkerElement またはベクターマップの基本地図ラベルと衝突した場合の動作を指定する列挙型。注: |
content optional |
タイプ:
Node optional デフォルト:
PinElement.element AdvancedMarkerElement のビジュアルを支える DOM 要素。注: |
gmpDraggable optional |
タイプ:
boolean optional デフォルト:
false true の場合は、AdvancedMarkerElement をドラッグできます。注: 標高を含む |
map optional |
タイプ:
Map optional AdvancedMarkerElement を表示する地図。地図は AdvancedMarkerElement を表示するために必須であり、構築時に指定されていない場合は AdvancedMarkerElement.map を設定することで提供できます。 |
position optional |
タイプ:
LatLng|LatLngLiteral|LatLngAltitude|LatLngAltitudeLiteral optional AdvancedMarkerElement の位置を設定します。AdvancedMarkerElement は位置を指定しなくても作成できますが、位置(ユーザーの操作や選択など)が指定されるまでは表示されません。AdvancedMarkerElement の位置は、構築時に指定されていない場合は AdvancedMarkerElement.position を設定することで指定できます。注: 高度を指定した |
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 |
PinElementOptions.glyph をご確認ください。 |
glyphColor |
タイプ:
string optional PinElementOptions.glyphColor をご確認ください。 |
scale |
タイプ:
number optional PinElementOptions.scale をご確認ください。 |
メソッド | |
---|---|
addEventListener |
addEventListener(type, listener[, options]) パラメータ:
戻り値:
void この関数はまだ使用できません。 |
removeEventListener |
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 |
ピンに表示される DOM 要素。 |
glyphColor optional |
タイプ:
string optional グリフの色。CSS の任意の色値をサポートします。 |
scale optional |
タイプ:
number optional デフォルト:
1 ピンのスケール。 |