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 要素。 |
gmpClickable |
種類:
boolean optional |
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 をご確認ください。 |
Methods | |
---|---|
addEventListener |
addEventListener(type, listener[, options]) パラメータ:
戻り値:
void 指定されたイベントがターゲットに配信されるたびに呼び出される関数を設定します。addEventListener をご覧ください。 |
addListener |
addListener(eventName, handler) パラメータ:
戻り値:
MapsEventListener 結果のイベント リスナー。指定されたリスナー関数を、Maps Eventing システムの指定されたイベント名に追加します。 |
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 要素。注: |
gmpClickable optional |
種類:
boolean optional デフォルト:
false true の場合、AdvancedMarkerElement はクリック可能になり、gmp-click イベントをトリガーします。また、ユーザー補助のためにインタラクティブになります(矢印キーによるキーボード ナビゲーションを許可するなど)。 |
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 をご確認ください。 |
Methods | |
---|---|
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 ピンのスケール。 |