Marker クラス
google.maps.Marker クラス
このクラスは MVCObject を拡張します。
const {Marker} = await google.maps.importLibrary("marker") を呼び出してアクセスします。
Maps JavaScript API のライブラリをご覧ください。
コンストラクタ | |
|---|---|
Marker | 
Marker([opts])パラメータ:   
 指定されたオプションでマーカーを作成します。地図が指定されている場合、マーカーは構築時に地図に追加されます。マーカーを表示するには、位置を設定する必要があります。  | 
定数 | |
|---|---|
MAX_ZINDEX | 
API がマーカーに割り当てるデフォルトの最大 Z-Index。Z インデックスを高い値にするほど、マーカーが前に表示されます。 | 
メソッド | |
|---|---|
getAnimation | 
getAnimation()パラメータ: なし 
戻り値:   
Animation|null|undefined現在実行中のアニメーションを取得します。  | 
getClickable | 
getClickable()パラメータ: なし 
戻り値:   
boolean マーカーがクリック可能な場合は True。Marker のクリック可能なステータスを取得します。 | 
getCursor | 
getCursor()パラメータ: なし 
戻り値:   
string|null|undefinedホバー時に表示されるマウスカーソルのタイプを取得します。  | 
getDraggable | 
getDraggable()パラメータ: なし 
戻り値:   
boolean マーカーがドラッグ可能である場合は true。Marker のドラッグ可能なステータスを取得します。 | 
getIcon | 
getIcon()パラメータ: なし 
Marker のアイコンを取得します。MarkerOptions.iconをご確認ください。 | 
getLabel | 
getLabel()パラメータ: なし 
戻り値:   
MarkerLabel|string|null|undefinedMarker のラベルを取得します。MarkerOptions.labelをご確認ください。 | 
getMap | 
getMap()パラメータ: なし 
戻り値:   
Map|StreetViewPanoramaMarker がレンダリングされる地図またはパノラマを取得します。 | 
getOpacity | 
getOpacity()パラメータ: なし 
戻り値:   
number|null|undefined 0.0 ~ 1.0 の数値。Marker の不透明度を取得します。 | 
getPosition | 
getPosition()パラメータ: なし 
戻り値:   
LatLng|null|undefinedMarker の位置を取得します。 | 
getShape | 
getShape()パラメータ: なし 
戻り値:   
MarkerShape|null|undefined | 
getTitle | 
getTitle()パラメータ: なし 
戻り値:   
string|null|undefinedMarker ツールチップのタイトルを取得します。MarkerOptions.titleをご確認ください。 | 
getVisible | 
getVisible()パラメータ: なし 
戻り値:   
boolean マーカーが表示されている場合は True。Marker の可視性を取得します。 | 
getZIndex | 
getZIndex()パラメータ: なし 
戻り値:   
number|null|undefined マーカーの zIndex。Marker の zIndex を取得します。MarkerOptions.zIndexをご確認ください。 | 
setAnimation | 
setAnimation([animation])パラメータ:   
 戻り値: なし 
アニメーションを開始します。進行中のアニメーションはキャンセルされます。現在サポートされているアニメーションは  Animation.BOUNCE、Animation.DROP です。null を渡すと、アニメーションが停止します。 | 
setClickable | 
setClickable(flag)パラメータ:   
 戻り値: なし 
Marker がクリック可能かどうかを設定します。 | 
setCursor | 
setCursor([cursor])パラメータ:   
 戻り値: なし 
ホバー時に表示されるマウスカーソルのタイプを設定します。  | 
setDraggable | 
setDraggable(flag)パラメータ:   
 戻り値: なし 
Marker がドラッグ可能かどうかを設定します。 | 
setIcon | 
setIcon([icon])戻り値: なし 
Marker のアイコンを設定します。MarkerOptions.iconをご確認ください。 | 
setLabel | 
setLabel([label])パラメータ:   
 戻り値: なし 
Marker のラベルを設定します。MarkerOptions.labelをご確認ください。 | 
setMap | 
setMap(map)パラメータ:   
 戻り値: なし 
指定された地図またはパノラマに  Marker をレンダリングします。地図が null に設定されている場合、マーカーは削除されます。 | 
setOpacity | 
setOpacity([opacity])パラメータ:   
 戻り値: なし 
Marker の不透明度を設定します。 | 
setOptions | 
setOptions(options)パラメータ:   
 戻り値: なし 
Marker のオプションを設定します。 | 
setPosition | 
setPosition([latlng])パラメータ:   
 戻り値: なし 
Marker の位置を設定します。 | 
setShape | 
setShape([shape])パラメータ:   
 戻り値: なし 
 | 
setTitle | 
setTitle([title])パラメータ:   
 戻り値: なし 
Marker ツールチップのタイトルを設定します。MarkerOptions.titleをご確認ください。 | 
setVisible | 
setVisible(visible)パラメータ:   
 戻り値: なし 
Marker が表示される場合に設定します。 | 
setZIndex | 
setZIndex([zIndex])パラメータ:   
 戻り値: なし 
Marker の zIndex を設定します。MarkerOptions.zIndexをご確認ください。 | 
継承:
addListener、
bindTo、
get、
notify、
set、
setValues、
unbind、
unbindAll
 | |
イベント | |
|---|---|
animation_changed | 
function()引数: なし 
このイベントは、 Marker アニメーション プロパティが変更されたときに発生します。 | 
click | 
function(event)引数:   
 このイベントは、 Marker アイコンがクリックされたときに発生します。 | 
clickable_changed | 
function()引数: なし 
このイベントは、 Marker クリック可能プロパティが変更されたときに発生します。 | 
contextmenu | 
function(event)引数:   
 このイベントは、 Marker で DOM contextmenu イベントが発生したときに発生します。 | 
cursor_changed | 
function()引数: なし 
このイベントは、 Marker カーソル プロパティが変更されたときに発生します。 | 
dblclick | 
function(event)引数:   
 このイベントは、 Marker アイコンがダブルクリックされたときに発生します。 | 
drag | 
function(event)引数:   
 このイベントは、ユーザーが  Marker をドラッグしている間、繰り返し発生します。 | 
dragend | 
function(event)引数:   
 このイベントは、ユーザーが  Marker のドラッグを終了したときに発生します。 | 
draggable_changed | 
function()引数: なし 
このイベントは、 Marker draggable プロパティが変更されたときに発生します。 | 
dragstart | 
function(event)引数:   
 このイベントは、ユーザーが  Marker のドラッグを開始したときに発生します。 | 
flat_changed | 
function()引数: なし 
このイベントは、 Marker フラット プロパティが変更されたときに発生します。 | 
icon_changed | 
function()引数: なし 
このイベントは、 Marker アイコン プロパティが変更されたときに発生します。 | 
mousedown | 
function(event)引数:   
 このイベントは、 Marker で mousedown が発生したときに発生します。 | 
mouseout | 
function(event)引数:   
 このイベントは、マウスが  Marker アイコンの領域から離れたときに発生します。 | 
mouseover | 
function(event)引数:   
 このイベントは、マウスが  Marker アイコンの領域に入ったときに発生します。 | 
mouseup | 
function(event)引数:   
 このイベントは、 Marker で mouseup が発生したときに発生します。 | 
position_changed | 
function()引数: なし 
このイベントは、 Marker 位置プロパティが変更されたときに発生します。 | 
shape_changed | 
function()引数: なし 
このイベントは、 Marker シェイプ プロパティが変更されたときに発生します。 | 
title_changed | 
function()引数: なし 
このイベントは、 Marker タイトル プロパティが変更されたときに発生します。 | 
visible_changed | 
function()引数: なし 
このイベントは、 Marker 可視プロパティが変更されたときに発生します。 | 
zindex_changed | 
function()引数: なし 
このイベントは、 Marker zIndex プロパティが変更されたときに発生します。 | 
 | 
function(event)引数:   
 このイベントは、 Marker の右クリックで発生します。 | 
MarkerOptions インターフェース
google.maps.MarkerOptions
インターフェース
マーカーに設定できるプロパティを定義するために使用される MarkerOptions オブジェクト。
プロパティ | |
|---|---|
anchorPoint optional | 
タイプ:   
Point optionalマーカーの位置から、マーカーをアンカーとして開いた InfoWindow の先端までのオフセット。  | 
animation optional | 
タイプ:   
Animation optionalデフォルト:  
nullマーカーが地図に追加されたときに再生するアニメーション。  | 
clickable optional | 
タイプ:   
boolean optionalデフォルト:  
truetrue の場合、マーカーはマウスイベントとタッチイベントを受け取ります。 | 
 | 
タイプ:   
string|CollisionBehavior optionalデフォルト:  
nullベクターマップ上のマーカーが重なった場合の動作を設定します。  | 
crossOnDrag optional | 
タイプ:   
boolean optionalデフォルト:  
truefalse の場合、ドラッグ時にマーカーの下に表示される十字を無効にします。 | 
cursor optional | 
タイプ:   
string optionalデフォルト:  
pointerマウスカーソルを重ねたときに表示するマウスカーソルの種類。  | 
draggable optional | 
タイプ:   
boolean optionalデフォルト:  
falsetrue の場合、マーカーをドラッグできます。注: これを true に設定すると、clickable が false に設定されていても、マーカーをクリックできるようになります。 | 
icon optional | 
 フォアグラウンドのアイコン。文字列が指定された場合、文字列を  url とする Icon として扱われます。 | 
label optional | 
タイプ:   
string|MarkerLabel optionalデフォルト:  
nullマーカーにラベルを追加します。マーカーラベルは、マーカー内に表示される文字または数値です。ラベルには、文字列または  MarkerLabel オブジェクトを指定できます。このパラメータが指定され、MarkerOptions.title が指定されていない場合、指定されたラベルのテキストを含むユーザー補助テキスト(スクリーン リーダーで使用するなど)がマーカーに追加されます。なお、label は現在、最適化されていないマーカーのユーザー補助テキストにのみ使用されています。 | 
map optional | 
タイプ:   
Map|StreetViewPanorama optionalマーカーを表示する地図。マーカーを表示するには地図が必要であり、マーカーの構築時に指定されていない場合は  Marker.setMap で指定できます。 | 
opacity optional | 
タイプ:   
number optionalデフォルト: 1.0 
0.0(透明)から 1.0(不透明)までの数値。  | 
optimized optional | 
タイプ:   
boolean optional最適化すると、多数のマーカーが単一の静的要素としてレンダリングされ、パフォーマンスが向上します。最適化は、多くのマーカーが必要な場合に便利です。詳しくは、マーカーの最適化をご覧ください。注: この最適化は、ベクターマップ上のマーカーには影響しません。  | 
position optional | 
タイプ:   
LatLng|LatLngLiteral optionalマーカーの位置を設定します。マーカーは、位置情報が提供されるまで(たとえば、ユーザーの操作や選択によって)構築されても表示されないことがあります。マーカーの構築時に指定されていない場合、マーカーの位置は  Marker.setPosition で指定できます。 | 
shape optional | 
タイプ:   
MarkerShape optionalドラッグ/クリック用の画像マップの領域定義。  | 
title optional | 
タイプ:   
string optionalデフォルト:  
undefinedロールオーバー テキスト。指定された場合、ユーザー補助テキスト(スクリーン リーダーで使用するなど)が、指定された値とともにマーカーに追加されます。なお、 title は現在、最適化されていないマーカーのユーザー補助テキストにのみ使用されています。 | 
visible optional | 
タイプ:   
boolean optionalデフォルト:  
truetrue の場合、マーカーは表示されます。 | 
zIndex optional | 
タイプ:   
number optionalすべてのマーカーは、zIndex の順で地図上に表示されます。つまり、この値が大きいマーカーは、値が小さいマーカーよりも前面に表示されます。デフォルトでは、マーカーは画面の垂直方向の位置に従って表示され、画面で低い位置にあるマーカーが高い位置にあるマーカーより前に表示されます。  | 
CollisionBehavior 定数
google.maps.CollisionBehavior
定数
const {CollisionBehavior} = await google.maps.importLibrary("marker") を呼び出してアクセスします。
Maps JavaScript API のライブラリをご覧ください。
定数 | |
|---|---|
OPTIONAL_AND_HIDES_LOWER_PRIORITY | 
他のマーカーと位置が重ならない場合にだけ表示されます。このタイプのマーカー同士が重なった場合、zIndex の高いほうが表示されます。zIndex が同じ場合は、画面内の縦位置が低いほうが表示されます。 | 
REQUIRED | 
他のマーカーと重なっていても常に表示されます。これはデフォルトの動作です。 | 
REQUIRED_AND_HIDES_OPTIONAL | 
他のマーカーと重なっても常に表示されますが、このマーカーと表示位置が重なる OPTIONAL_AND_HIDES_LOWER_PRIORITY のマーカーとラベルはすべて非表示になります。 | 
Icon インターフェース
google.maps.Icon
インターフェース
マーカー アイコン画像を表す構造体。
プロパティ | |
|---|---|
url | 
タイプ:   
string画像またはスプライト シートの URL。  | 
anchor optional | 
タイプ:   
Point optional地図上のマーカーの位置に対応して画像をアンカーする位置。デフォルトでは、アンカーは画像の下辺中央に設定されています。  | 
labelOrigin optional | 
タイプ:   
Point optionalマーカーによってラベルが指定されている場合、アイコン画像の左上隅を基準としたラベルの原点。デフォルトでは、原点は画像の中央に配置されます。  | 
origin optional | 
タイプ:   
Point optionalスプライト内の画像の位置(ある場合)。デフォルトでは、原点は画像  (0, 0) の左上隅にあります。 | 
scaledSize optional | 
タイプ:   
Size optionalスケーリング後の画像全体のサイズ(スケーリングが行われた場合)。このプロパティを使用して画像またはスプライトを伸縮します。  | 
size optional | 
タイプ:   
Size optionalスプライトまたは画像の表示サイズ。スプライトを使用する場合は、スプライトのサイズを指定する必要があります。サイズを指定しない場合、画像を読み込むときに設定されます。  | 
MarkerLabel インターフェース
google.maps.MarkerLabel
インターフェース
マーカーラベルの表示形式を指定します。マーカーラベルは、マーカー内に表示される文字列(多くの場合、1 文字)です。カスタム マーカーで使用している場合は、Icon クラスの labelOrigin プロパティで位置を変更できます。
プロパティ | |
|---|---|
text | 
タイプ:   
stringラベルに表示するテキスト。  | 
className optional | 
タイプ:   
string optionalデフォルト:  
''(空の文字列)ラベルの要素の className プロパティ(要素の class 属性と同等)。スペースで区切られた複数の CSS クラスを追加できます。フォントの色、サイズ、太さ、ファミリーは、 MarkerLabel の他のプロパティでのみ設定できます。マーカーの衝突管理も使用している場合は、CSS クラスを使用してラベルの位置や向きを変更しないでください(変換や回転などを使用する場合)。 | 
color optional | 
タイプ:   
string optionalデフォルト:  
'black'ラベルテキストの色。  | 
fontFamily optional | 
タイプ:   
string optionalラベル テキストのフォント ファミリー(CSS の font-family プロパティと同等)。  | 
fontSize optional | 
タイプ:   
string optionalデフォルト:  
'14px'ラベルテキストのフォントサイズ(CSS の font-size プロパティと同等)。  | 
fontWeight optional | 
タイプ:   
string optionalラベルテキストのフォントの太さ(CSS の font-weight プロパティと同等)。  | 
MarkerShape インターフェース
google.maps.MarkerShape
インターフェース
このオブジェクトは、マーカー画像のクリック可能な領域を定義します。シェイプは、画像の透明でない領域を定義する type と coord の 2 つのプロパティで構成されます。
プロパティ | |
|---|---|
type | 
タイプ:   
stringシェイプのタイプを記述します。 circle、poly、rect のいずれかになります。 | 
coords optional | 
タイプ:   
Array<number> optionalこの属性の形式は  type の値によって異なり、 http://www.w3.org/TR/REC-html40/struct/objects.html#adef-coords にある w3 AREA coords 仕様に準拠します。coords 属性は、ターゲット画像の左上隅を基準としたシェイプのピクセル位置を指定する整数の配列です。座標は type の値に応じて次のように変化します。- circle: coords は [x1,y1,r] です。ここで、x1、y2 は円の中心の座標、r は円の半径です。- poly: coords は [x1,y1,x2,y2...xn,yn] で、各 x,y ペアにはポリゴンの 1 つの頂点の座標が含まれます。- rect: coords は [x1,y1,x2,y2] です。x1,y1 は長方形の左上隅の座標、x2,y2 は長方形の右下隅の座標です。 | 
Symbol インターフェース
google.maps.Symbol
インターフェース
スタイル設定されたベクターパスで構成されるシンボルについて説明します。シンボルは、マーカーのアイコンとして使用したり、ポリライン上に配置したりできます。
プロパティ | |
|---|---|
path | 
タイプ:   
SymbolPath|stringシンボルのパス。組み込みのシンボルパス、または SVG パス表記を使用して表されるカスタムパス。必須。  | 
anchor optional | 
タイプ:   
Point optionalデフォルト:  
google.maps.Point(0,0)マーカーまたはポリラインに対するシンボルの相対位置。記号のパスの座標は、アンカーの x 座標と y 座標からそれぞれ左方向と上方向に変換されます。この位置は、シンボルのパスと同じ座標系で表現されます。  | 
fillColor optional | 
タイプ:   
string optionalシンボルの塗りつぶしの色。名前付き拡張色を除くすべての CSS3 色に対応します。シンボル マーカーの場合、デフォルトは「黒」です。ポリライン上のシンボルの場合、デフォルトは対応するポリラインのストロークの色です。  | 
fillOpacity optional | 
タイプ:   
number optionalデフォルト:  
0シンボルの塗りつぶしの不透明度。  | 
labelOrigin optional | 
タイプ:   
Point optionalデフォルト:  
google.maps.Point(0,0)ラベルがマーカーによって提供される場合、パスの原点に対するラベルの原点。原点は、シンボルのパスと同じ座標系で表現されます。このプロパティは、ポリライン上のシンボルでは使用されません。  | 
rotation optional | 
タイプ:   
number optionalデフォルト:  
0シンボルを回転させる角度です。時計回りの度数で表します。 fixedRotation が false である IconSequence のシンボルは、そのシンボルの下にあるエッジの角度を基準に回転します。 | 
scale optional | 
タイプ:   
number optionalシンボルのサイズが拡大 / 縮小する度合い。シンボル マーカーの場合、デフォルトは 1 です。スケーリング後のシンボルのサイズに制限はありません。ポリライン上のシンボルの場合、デフォルトではポリラインのストロークの幅になります。拡大 / 縮小後は、シンボルは、シンボルのアンカーを中心とした 22 ピクセルの正方形内に収める必要があります。  | 
strokeColor optional | 
タイプ:   
string optionalシンボルのストロークの色。名前付き拡張色を除くすべての CSS3 色に対応します。シンボル マーカーの場合、デフォルトは「黒」です。ポリライン上のシンボルの場合、デフォルトはポリラインのストロークの色です。  | 
strokeOpacity optional | 
タイプ:   
number optionalシンボルのストロークの不透明度。シンボル マーカーの場合、デフォルトは 1 です。ポリライン上のシンボルの場合、デフォルトはポリラインのストロークの不透明度です。  | 
strokeWeight optional | 
タイプ:   
number optionalデフォルト: シンボルの  
Symbol.scale。シンボルのストロークの太さ。  | 
SymbolPath 定数
google.maps.SymbolPath
定数
組み込みのシンボルパス。
const {SymbolPath} = await google.maps.importLibrary("core") を呼び出してアクセスします。
Maps JavaScript API のライブラリをご覧ください。
定数 | |
|---|---|
BACKWARD_CLOSED_ARROW | 
後方を指す閉じた矢印。 | 
BACKWARD_OPEN_ARROW | 
後方を指す開いた矢印。 | 
CIRCLE | 
円。 | 
FORWARD_CLOSED_ARROW | 
前方を指す閉じた矢印。 | 
FORWARD_OPEN_ARROW | 
前方を指す開いた矢印。 | 
アニメーション定数
google.maps.Animation
定数
マーカーで再生できるアニメーション。アニメーションを再生するには、Marker の Marker.setAnimation メソッドまたは MarkerOptions.animation オプションを使用します。
const {Animation} = await google.maps.importLibrary("marker") を呼び出してアクセスします。
Maps JavaScript API のライブラリをご覧ください。
定数 | |
|---|---|
BOUNCE | 
null で Marker.setAnimation を呼び出してアニメーションを停止するまで、マーカーがバウンドします。 | 
DROP | 
マーカーが地図の上部から最終的な場所まで落ちてきます。マーカーが止まるとアニメーションが終了し、Marker.getAnimation が null に戻ります。このタイプのアニメーションは、通常、マーカーの作成時に指定します。 |