Maps

Map クラス

google.maps.Map クラス

このクラスは MVCObject を拡張します。

const {Map} = await google.maps.importLibrary("maps") を呼び出してアクセスします。Maps JavaScript API のライブラリをご覧ください。

Map
Map(mapDiv[, opts])
パラメータ: 
  • mapDivHTMLElement 地図がこの要素全体にレンダリングされます。
  • optsMapOptions optional オプション
指定された HTML コンテナ(通常は DIV 要素)内に新しい地図を作成します。
DEMO_MAP_ID マップ ID を必要とするコードサンプルで使用できるマップ ID。このマップ ID は、本番環境のアプリケーションでの使用を目的としたものではなく、クラウド構成を必要とする機能(Cloud スタイル設定など)には使用できません。
controls
タイプ:  Array<MVCArray<HTMLElement>>
地図に追加するコントロール。地図にコントロールを追加するには、コントロールの <div> を、レンダリングする ControlPosition に対応する MVCArray に追加します。
data
タイプ:  Data
地図にバインドされた Data のインスタンス。この Data オブジェクトに対象物を追加すると、この地図に簡単に表示できます。
mapTypes
タイプ:  MapTypeRegistry
文字列 ID 別の MapType インスタンスのレジストリ。
overlayMapTypes
タイプ:  MVCArray<MapType optional>
オーバーレイする追加のマップタイプ。オーバーレイのマップタイプは、関連付けられている任意の基本地図の上に表示され、その順序は overlayMapTypes 配列での記述順序です(より高いインデックス値を持つオーバーレイが、低いインデックス値を持つオーバーレイの前に表示されます)。
fitBounds
fitBounds(bounds[, padding])
パラメータ: 
  • boundsLatLngBounds|LatLngBoundsLiteral 表示する境界。
  • paddingnumber|Padding optional パディング(ピクセル単位)。境界は、パディングを削除した後に残る地図の部分に収まるように調整されます。数値を指定すると、4 つの辺すべてに同じパディングが適用されます。0 を指定すると、fitBounds が getBounds の結果に対してべき等になります。
戻り値: なし
指定された境界が含まれるようにビューポートを設定します。
注: 地図が display: none に設定されている場合、fitBounds 関数は地図のサイズを 0x0 として読み取るため、何もしません。地図が非表示のときにビューポートを変更するには、地図を visibility: hidden に設定して、地図の div に実際のサイズがあることを確認します。ベクター地図の場合、このメソッドは地図の傾斜と向きをデフォルトのゼロ値に設定します。このメソッドを呼び出すと、地図がパンしてズームし、境界に収まるようになることで、スムーズなアニメーションが生成される場合があります。このメソッドがアニメーション化されるかどうかは、内部ヒューリスティクスによって異なります。
getBounds
getBounds()
パラメータ: なし
戻り値:  LatLngBounds|undefined 現在のビューポートの緯度/経度の境界。
現在のビューポートの緯度/経度の境界を返します。世界地図の複数のコピーが表示されている場合、経度の範囲は -180 ~ 180 度です。地図がまだ初期化されていない場合や、中心とズームが設定されていない場合、結果は undefined になります。傾斜または向きがゼロ以外のベクター地図の場合、返される緯度/経度の境界は、地図のビューポートで表示されるリージョンを含む最小の境界ボックスを表します。地図のビューポートの正確な表示領域を取得するには、MapCanvasProjection.getVisibleRegion をご覧ください。
getCenter
getCenter()
パラメータ: なし
戻り値:  LatLng|undefined
地図の中央に表示される位置を返します。この LatLng オブジェクトはラップされていません。詳しくは、LatLng をご覧ください。中心または境界が設定されていない場合、結果は undefined になります。
getClickableIcons
getClickableIcons()
パラメータ: なし
戻り値:  boolean|undefined
地図アイコンのクリック可能性を返します。地図アイコンは、スポット(POI)を表します。戻り値が true の場合、地図上のアイコンはクリック可能です。
BetagetDatasetFeatureLayer
getDatasetFeatureLayer(datasetId)
パラメータ: 
  • datasetIdstring
戻り値:  FeatureLayer
指定された datasetIdFeatureLayer を返します。データセット ID は Google Cloud コンソールで構成する必要があります。データセット ID が地図のマップスタイルに関連付けられていない場合、またはデータドリブン スタイル設定を使用できない場合(マップ ID なし、ベクタータイルなし、地図スタイルで構成されたデータドリブン スタイル設定対象の特徴レイヤまたはデータセットなし)、エラーがログに記録され、結果の FeatureLayer.isAvailable は false になります。
getDiv
getDiv()
パラメータ: なし
戻り値:  HTMLElement 地図の mapDiv。
getFeatureLayer
getFeatureLayer(featureType)
パラメータ: 
戻り値:  FeatureLayer
特定の FeatureTypeFeatureLayer を返します。Google Cloud コンソールで FeatureLayer を有効にする必要があります。指定された FeatureTypeFeatureLayer がこの地図に存在しない場合、またはデータドリブン スタイル設定を使用できない場合(マップ ID がない場合、ベクタータイルがない、マップスタイルで FeatureLayer が有効になっていない場合)、エラーがログに記録され、結果の FeatureLayer.isAvailable は false になります。
getHeading
getHeading()
パラメータ: なし
戻り値:  number|undefined
地図のコンパス方位を返します。方角の値は、真北を基準として時計回りの度数で測定されます。地図がまだ初期化されていない場合、結果は undefined になります。
getHeadingInteractionEnabled
getHeadingInteractionEnabled()
パラメータ: なし
戻り値:  boolean|null
見出しの操作が有効かどうかを返します。このオプションは、地図がベクター地図の場合にのみ有効です。コードで設定されていない場合は、地図 ID のクラウド構成が使用されます(利用可能な場合)。
getMapCapabilities
getMapCapabilities()
パラメータ: なし
戻り値:  MapCapabilities
指定されたマップ ID に基づいて、マップで利用可能な現在の機能を呼び出し元に通知します。
getMapTypeId
getMapTypeId()
パラメータ: なし
戻り値:  MapTypeId|string|undefined
getProjection
getProjection()
パラメータ: なし
戻り値:  Projection|undefined
現在の Projection を返します。地図がまだ初期化されていない場合、結果は undefined になります。projection_changed イベントをリッスンし、その値が undefined でないことを確認します。
getRenderingType
getRenderingType()
パラメータ: なし
戻り値:  RenderingType
地図の現在の RenderingType を返します。
getStreetView
getStreetView()
パラメータ: なし
戻り値:  StreetViewPanorama 地図にバインドされたパノラマ。
地図にバインドされたデフォルトの StreetViewPanorama を返します。これは、地図に埋め込まれたデフォルトのパノラマ、または setStreetView() を使用して設定されたパノラマのいずれかです。地図の streetViewControl に変更を加えると、そのような結合されたパノラマの表示に反映されます。
getTilt
getTilt()
パラメータ: なし
戻り値:  number|undefined
地図の現在の入射角を返します。ビューポート平面から地図平面までの角度(度)で返されます。ラスター地図の場合、真上から撮影された画像は 0、45° から撮影された画像は 45 になります。このメソッドは、setTilt によって設定された値を返しません。詳細については、setTilt をご覧ください。
getTiltInteractionEnabled
getTiltInteractionEnabled()
パラメータ: なし
戻り値:  boolean|null
傾斜操作が有効かどうかを返します。このオプションは、地図がベクター地図の場合にのみ有効です。コードで設定されていない場合は、地図 ID のクラウド構成が使用されます(利用可能な場合)。
getZoom
getZoom()
パラメータ: なし
戻り値:  number|undefined
地図のズームを返します。ズームが設定されていない場合、結果は undefined になります。
moveCamera
moveCamera(cameraOptions)
パラメータ: 
戻り値: なし
アニメーションなしで、地図のカメラをターゲット カメラ オプションにすぐに設定します。
panBy
panBy(x, y)
パラメータ: 
  • xnumber 地図を x 方向に移動するピクセル数。
  • ynumber 地図を y 方向に移動するピクセル数。
戻り値: なし
指定された距離(ピクセル単位)だけ地図の中心を移動します。距離が地図の幅と高さの両方よりも短い場合は、遷移がスムーズにアニメーション化されます。地図の座標系は、x 値の場合は西から東に、y 値の場合は北から南に増加します。
panTo
panTo(latLng)
パラメータ: 
戻り値: なし
地図の中心を指定された LatLng に変更します。変更範囲が地図の幅と高さの両方よりも小さい場合、遷移はスムーズにアニメーション表示されます。
panToBounds
panToBounds(latLngBounds[, padding])
パラメータ: 
  • latLngBoundsLatLngBounds|LatLngBoundsLiteral マップをパンする境界。
  • paddingnumber|Padding optional パディング(ピクセル単位)。数値を指定すると、4 つの辺すべてに同じパディングが適用されます。デフォルト値は 0 です。
戻り値: なし
指定された LatLngBounds を表示するために必要な最小限の量だけ地図をパンします。地図上での境界の位置は保証されません。ただし、{currentMapSizeInPx} - {padding} 内に可能な限り多くの境界が表示されるように地図がパンされます。ラスター地図とベクター地図のどちらでも、地図のズーム、傾斜、方向は変更されません。
setCenter
setCenter(latlng)
パラメータ: 
戻り値: なし
setClickableIcons
setClickableIcons(value)
パラメータ: 
  • valueboolean
戻り値: なし
地図アイコンがクリック可能かどうかを制御します。地図アイコンは、スポット(POI)を表します。地図アイコンのクリックを無効にするには、このメソッドに値 false を渡します。
setHeading
setHeading(heading)
パラメータ: 
  • headingnumber
戻り値: なし
地図のコンパスの向首方向(度数)を、北を正方位として設定します。ラスター地図の場合、この方法は航空写真にのみ適用されます。
setHeadingInteractionEnabled
setHeadingInteractionEnabled(headingInteractionEnabled)
パラメータ: 
  • headingInteractionEnabledboolean
戻り値: なし
見出しの操作を有効にするかどうかを設定します。このオプションは、地図がベクター地図の場合にのみ有効です。コードで設定されていない場合は、地図 ID のクラウド構成が使用されます(利用可能な場合)。
setMapTypeId
setMapTypeId(mapTypeId)
パラメータ: 
戻り値: なし
setOptions
setOptions(options)
パラメータ: 
戻り値: なし
setRenderingType
setRenderingType(renderingType)
パラメータ: 
戻り値: なし
地図の現在の RenderingType を設定します。
setStreetView
setStreetView(panorama)
パラメータ: 
戻り値: なし
StreetViewPanorama を地図にバインドします。このパノラマはデフォルトの StreetViewPanorama をオーバーライドし、地図を地図外の外部パノラマにバインドできるようにします。パノラマを null に設定すると、デフォルトの埋め込みパノラマが地図にバインドされます。
setTilt
setTilt(tilt)
パラメータ: 
  • tiltnumber
戻り値: なし
ベクターマップの場合、地図の入射角を設定します。使用できる値は、地図のズームレベルによって制限されます。

ラスターマップの場合、地図の入射角の自動切り替え動作を制御します。指定できる値は 045 のみです。setTilt(0) を使用すると、ズームレベルとビューポートに関係なく、地図で常に 0° の真上から見た地図が表示されます。setTilt(45) を使用すると、現在のズームレベルとビューポートで 45 度画像が利用可能な場合は傾斜角度が自動的に 45 度に切り替わり、45 度画像が利用できない場合は 0 度に切り替わります(これがデフォルトの動作です)。45° 画像は、satellite および hybrid のマップタイプで、一部の地域とズームレベルでのみ利用できます。注: getTilt は、setTilt で設定された値ではなく、現在の傾斜角度を返します。getTiltsetTilt は異なるものを参照するため、tilt プロパティを bind() しないでください。予測できない影響が生じる可能性があります。
setTiltInteractionEnabled
setTiltInteractionEnabled(tiltInteractionEnabled)
パラメータ: 
  • tiltInteractionEnabledboolean
戻り値: なし
傾斜操作を有効にするかどうかを設定します。このオプションは、地図がベクター地図の場合にのみ有効です。コードで設定されていない場合は、地図 ID のクラウド構成が使用されます(利用可能な場合)。
setZoom
setZoom(zoom)
パラメータ: 
  • zoomnumber ズーム値が大きいほど、解像度が高くなります。
戻り値: なし
地図のズームを設定します。
継承: addListenerbindTogetnotifysetsetValuesunbindunbindAll
bounds_changed
function()
引数: なし
このイベントは、ビューポートの境界が変更されると発生します。
center_changed
function()
引数: なし
このイベントは、地図の中心プロパティが変更されると発生します。
click
function(event)
引数: 
このイベントは、ユーザーが地図をクリックしたときに発生します。プレイスアイコンがクリックされた場合を除き、クリックされた場所のプロパティを含む MapMouseEvent が返されます。プレイスアイコンがクリックされた場合は、プレイス ID を含む IconMouseEvent が返されます。IconMouseEvent と MapMouseEvent は、IconMouseEvent に Place ID フィールドがあることを除き、同じです。プレイス ID が重要でない場合は、このイベントを常に MapMouseEvent として扱うことができます。マーカーまたは情報ウィンドウがクリックされた場合、クリック イベントは発生しません。
contextmenu
function(event)
引数: 
このイベントは、地図コンテナで DOM contextmenu イベントが発生したときに発生します。
dblclick
function(event)
引数: 
このイベントは、ユーザーが地図をダブルクリックしたときに発生します。なお、クリック イベントは、このイベントの直前に 1 回または 2 回発生することがあります。
drag
function()
引数: なし
このイベントは、ユーザーが地図をドラッグしている間に繰り返し発生します。
dragend
function()
引数: なし
このイベントは、ユーザーが地図のドラッグを停止すると発生します。
dragstart
function()
引数: なし
このイベントは、ユーザーが地図のドラッグを開始すると発生します。
heading_changed
function()
引数: なし
このイベントは、地図の方位プロパティが変更されると発生します。
idle
function()
引数: なし
このイベントは、移動またはズームの後に地図がアイドルになると発生します。
isfractionalzoomenabled_changed
function()
引数: なし
このイベントは、isFractionalZoomEnabled プロパティが変更されたときに発生します。
mapcapabilities_changed
function()
引数: なし
このイベントは、地図の機能が変更されたときに発生します。
maptypeid_changed
function()
引数: なし
このイベントは、map TypeId プロパティが変更されると発生します。
mousemove
function(event)
引数: 
このイベントは、ユーザーが地図コンテナ上にマウスオーバーすると発生します。
mouseout
function(event)
引数: 
このイベントは、マウスが地図コンテナから離れると発生します。
mouseover
function(event)
引数: 
このイベントは、マウスが地図コンテナ内に入ると発生します。
projection_changed
function()
引数: なし
このイベントは、投影が変更されると発生します。
renderingtype_changed
function()
引数: なし
このイベントは、renderingType が変更されたときに発生します。
tilesloaded
function()
引数: なし
このイベントは、表示されるタイルの読み込みが完了したときに発生します。
tilt_changed
function()
引数: なし
このイベントは、地図の傾斜プロパティが変更されると発生します。
zoom_changed
function()
引数: なし
このイベントは、地図のズーム プロパティが変更されると発生します。
rightclick
function(event)
引数: 
このイベントは、ユーザーが地図を右クリックしたときに発生します。

MapOptions インターフェース

google.maps.MapOptions インターフェース

MapOptions オブジェクト。地図に設定できるプロパティを定義するために使用します。

backgroundColor optional
タイプ:  string optional
Map div の背景に使用される色。ユーザーがパン操作を行ったときに、タイルがまだ読み込まれていない場合にこの色が表示されます。このオプションは、地図が初期化されたときのみ設定できます。
center optional
タイプ:  LatLng|LatLngLiteral optional
地図の初期の中心。
clickableIcons optional
タイプ:  boolean optional
デフォルト: true
false の場合、地図アイコンはクリックできません。地図アイコンは、スポット(POI)を表します。
BetacolorScheme optional
タイプ:  ColorScheme|string optional
デフォルト: ColorScheme.LIGHT
地図の初期のカラーパターン。このオプションは、地図が初期化されたときのみ設定できます。
controlSize optional
タイプ:  number optional
地図上に表示されるコントロールのサイズ(ピクセル単位)。この値は、地図の作成時に直接指定する必要があります。この値を後で更新すると、コントロールが undefined 状態になる可能性があります。Maps API 自体が行うコントロールのみを対象とします。デベロッパーが作成したカスタム コントロールはスケーリングされません。
disableDefaultUI optional
タイプ:  boolean optional
すべてのデフォルト UI ボタンを有効または無効にします。個別にオーバーライドできます。キーボード操作は無効になりません。キーボード操作は MapOptions.keyboardShortcuts オプションで別途制御されます。ジェスチャー操作は無効になりません。ジェスチャー操作は MapOptions.gestureHandling オプションで別途制御されます。
disableDoubleClickZoom optional
タイプ:  boolean optional
ダブルクリックによるズームと画面中央への移動を有効または無効にします。デフォルトで有効。

: このプロパティは推奨されません。ダブルクリックでのズームを無効にするには、gestureHandling プロパティを使用して "none" に設定します。

draggable optional
タイプ:  boolean optional
false の場合、地図をドラッグできなくなります。ドラッグはデフォルトで有効になっています。
draggableCursor optional
タイプ:  string optional
ドラッグ可能な地図にカーソルを合わせたときに表示するカーソルの名前または URL。このプロパティでは、css cursor 属性を使用してアイコンを変更します。css プロパティと同様に、URL 以外の代替カーソルを少なくとも 1 つ指定する必要があります。例: draggableCursor: 'url(http://www.example.com/icon.png), auto;'
draggingCursor optional
タイプ:  string optional
地図のドラッグ時に表示するカーソルの名前または URL。このプロパティでは、css cursor 属性を使用してアイコンを変更します。css プロパティと同様に、URL 以外の代替カーソルを少なくとも 1 つ指定する必要があります。例: draggingCursor: 'url(http://www.example.com/icon.png), auto;'
fullscreenControl optional
タイプ:  boolean optional
全画面表示コントロールの有効/無効の状態。
fullscreenControlOptions optional
タイプ:  FullscreenControlOptions optional
全画面表示コントロールの表示オプション。
gestureHandling optional
タイプ:  string optional
この設定は、API が地図上のジェスチャーを処理する方法を制御します。使用できる値:
  • "cooperative": スクロール イベントと 1 本指のタップ操作はページをスクロールします。地図のズームやパンは行いません。2 本の指でタップすると、地図のパンやズームができます。Ctrl キーまたは ⌘ キーを押しながらスクロールすると、地図がズームされます。
    このモードでは、地図はページと連携します。
  • "greedy": すべてのタップ操作とスクロール イベントで、地図がパンまたはズームされます。
  • "none": ユーザーのジェスチャーで地図をパンまたはズームすることはできません。
  • "auto": (デフォルト)ページがスクロール可能か iframe 内にあるかによって、ジェスチャー処理は協調型または貪欲型のいずれかになります。
heading optional
タイプ:  number optional
航空画像の向首方向(度数)。真北からの時計回りの角度で表されます。方位は、画像を表示できる最も近い角度に合わせられます。
headingInteractionEnabled optional
タイプ:  boolean optional
デフォルト: false
地図でユーザーがカメラの向き(回転)を操作できるようにするかどうか。このオプションは、地図がベクター地図の場合にのみ有効です。コードで設定されていない場合は、地図 ID のクラウド構成が使用されます(利用可能な場合)。
isFractionalZoomEnabled optional
タイプ:  boolean optional
デフォルト: ベクター地図の場合は true、ラスター地図の場合は false
地図で小数ズームレベルを許可するかどうか。isfractionalzoomenabled_changed をリッスンして、デフォルトが設定されたタイミングを把握します。
keyboardShortcuts optional
タイプ:  boolean optional
false の場合、地図をキーボードで操作できなくなります。キーボード ショートカットはデフォルトで有効になっています。
mapId optional
タイプ:  string optional
地図のマップ ID。このパラメータは、地図のインスタンス化後に設定または変更することはできません。Map.DEMO_MAP_ID を使用すると、マップ ID は必要だがクラウドの有効化は必要でない機能を試すことができます。
mapTypeControl optional
タイプ:  boolean optional
地図タイプ コントロールの初期の有効/無効の状態。
mapTypeControlOptions optional
タイプ:  MapTypeControlOptions optional
地図形式のコントロールの初期表示オプション。
mapTypeId optional
タイプ:  MapTypeId|string optional
初期地図の mapTypeId。デフォルトは ROADMAP です。
maxZoom optional
タイプ:  number optional
地図に表示される最大ズームレベル。省略した場合、または null に設定した場合は、現在の地図タイプの最大ズームが代わりに使用されます。有効なズーム値は、0 からサポートされている最大ズームレベルまでの数値です。
minZoom optional
タイプ:  number optional
地図に表示される最小ズームレベル。省略した場合、または null に設定した場合は、現在の地図タイプの最小ズームが代わりに使用されます。有効なズーム値は、0 からサポートされている最大ズームレベルまでの数値です。
noClear optional
タイプ:  boolean optional
true の場合は、Map div の内容を消去しないでください。
panControl optional
タイプ:  boolean optional
パン コントロールの有効/無効の状態。

panControlOptions optional
タイプ:  PanControlOptions optional
パン コントロールの表示オプション。

renderingType optional
タイプ:  RenderingType optional
デフォルト: RenderingType.RASTER
地図がラスターマップかベクターマップか。このパラメータは、地図のインスタンス化後に設定または変更することはできません。設定されていない場合、レンダリング タイプは地図 ID のクラウド構成によって決まります(利用可能な場合)。ベクター地図は、すべてのデバイスやブラウザで利用できるとは限りません。必要に応じて、地図はラスターマップにフォールバックします。
restriction optional
タイプ:  MapRestriction optional
ユーザーがアクセスできる地図のエリアを制限する境界を定義します。設定すると、カメラビューが境界の範囲内にある間のみ、ユーザーはパンとズームを行えます。
rotateControl optional
タイプ:  boolean optional
回転コントロールの有効/無効状態。
rotateControlOptions optional
タイプ:  RotateControlOptions optional
回転コントロールの表示オプション。
scaleControl optional
タイプ:  boolean optional
スケール コントロールの最初の有効/無効状態。
scaleControlOptions optional
タイプ:  ScaleControlOptions optional
スケール コントロールの最初の表示オプション。
scrollwheel optional
タイプ:  boolean optional
false の場合、マウスのスクロール ホイールによる地図のズームを無効にします。スクロールホイールはデフォルトで有効になっています。

: このプロパティは推奨されません。スクロール ホイールによるズームを無効にするには、gestureHandling プロパティを使用して "cooperative" または "none" に設定します。

streetView optional
タイプ:  StreetViewPanorama optional
ストリートビューのペグマンが地図上にドロップされたときに表示される StreetViewPanorama。パノラマが指定されていない場合、ペグマンをドロップすると、地図の div にデフォルトの StreetViewPanorama が表示されます。
streetViewControl optional
タイプ:  boolean optional
ストリートビューのペグマン コントロールの初期の有効/無効の状態。このコントロールはデフォルトの UI の一部であり、ストリートビューの道路オーバーレイが表示されない地図タイプ(地球以外の地図タイプなど)を表示する場合は false に設定する必要があります。
streetViewControlOptions optional
タイプ:  StreetViewControlOptions optional
ストリートビューでペグマン コントロールの最初の表示オプション。
styles optional
タイプ:  Array<MapTypeStyle> optional
デフォルトの地図タイプごとに適用するスタイル。satellite/hybrid モードと terrain モードでは、これらのスタイルはラベルとジオメトリにのみ適用されます。この機能は、マップ ID を使用している場合やベクターマップを使用している場合は使用できません(代わりに Cloud ベースのマップのスタイル設定を使用してください)。
tilt optional
タイプ:  number optional
ベクターマップの場合、地図の入射角を設定します。使用できる値は、地図のズームレベルによって制限されます。ラスターマップの場合、マップの入射角の自動切り替え動作を制御します。指定できる値は 045 のみです。値 0 を指定すると、ズームレベルとビューポートに関係なく、地図で常に 0° のオーバーヘッド ビューが使用されます。値 45 を指定すると、現在のズームレベルとビューポートで 45 度画像が利用可能な場合は傾斜角度が自動的に 45 度に切り替わり、45 度画像が利用できない場合は 0 度に切り替わります(これがデフォルトの動作です)。45° 画像は、satellite および hybrid のマップタイプで、一部の地域とズームレベルでのみ利用できます。注: getTilt は、このオプションで指定した値ではなく、現在の傾斜角度を返します。getTilt とこのオプションは異なるものを参照するため、tilt プロパティを bind() しないでください。予測できない影響が生じる可能性があります。
tiltInteractionEnabled optional
タイプ:  boolean optional
デフォルト: false
地図でユーザーがカメラの傾きを操作できるようにするかどうか。このオプションは、地図がベクター地図の場合にのみ有効です。コードで設定されていない場合は、地図 ID のクラウド構成が使用されます(利用可能な場合)。
zoom optional
タイプ:  number optional
地図の初期ズームレベル。有効なズーム値は、サポートされている最大ズームレベルまでの数値です。ズーム値が大きいほど、解像度が高くなります。
zoomControl optional
タイプ:  boolean optional
ズーム コントロールの有効/無効状態。
zoomControlOptions optional
タイプ:  ZoomControlOptions optional
ズーム コントロールの表示オプション。

MapElement クラス

google.maps.MapElement クラス

MapElement は、地図をレンダリングするための HTMLElement サブクラスです。maps ライブラリを読み込んだら、HTML で地図を作成できます。次に例を示します。

<gmp-map center="37.4220656,-122.0840897" zoom="10" map-id="DEMO_MAP_ID">
  <button slot="control-block-start-inline-end">Custom Control</button>
</gmp-map>

内部では Map を使用します。innerMap プロパティでアクセスできます。

カスタム要素:
<gmp-map center="lat,lng" heading-interaction-disabled map-id="string" rendering-type="vector" tilt-interaction-disabled zoom="number"></gmp-map>

このクラスは HTMLElement を拡張します。

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

const {MapElement} = await google.maps.importLibrary("maps") を呼び出してアクセスします。Maps JavaScript API のライブラリをご覧ください。

MapElement
MapElement([options])
パラメータ: 
center
タイプ:  LatLng|LatLngLiteral optional
地図の中心の緯度と経度。
HTML 属性:
  • <gmp-map center="lat,lng"></gmp-map>
headingInteractionDisabled
タイプ:  boolean optional
デフォルト: false
地図でユーザーがカメラの向き(回転)を操作できるようにするかどうか。このオプションは、地図がベクター地図の場合にのみ有効です。コードで設定されていない場合は、地図 ID のクラウド構成が使用されます(利用可能な場合)。
HTML 属性:
  • <gmp-map heading-interaction-disabled></gmp-map>
innerMap
タイプ:  Map
MapElement が内部で使用する Map への参照。
mapId
タイプ:  string optional
地図のマップ ID。このパラメータは、地図のインスタンス化後に設定または変更することはできません。Map.DEMO_MAP_ID を使用すると、マップ ID は必要だがクラウドの有効化は必要でない機能を試すことができます。
HTML 属性:
  • <gmp-map map-id="string"></gmp-map>
renderingType
タイプ:  RenderingType optional
デフォルト: RenderingType.VECTOR
地図がラスターマップかベクターマップか。このパラメータは、地図のインスタンス化後に設定または変更することはできません。設定されていない場合、レンダリング タイプは地図 ID のクラウド構成によって決まります(利用可能な場合)。ベクター地図は、すべてのデバイスやブラウザで利用できるとは限りません。必要に応じて、地図はラスターマップにフォールバックします。
HTML 属性:
  • <gmp-map rendering-type="vector"></gmp-map>
  • <gmp-map rendering-type="raster"></gmp-map>
tiltInteractionDisabled
タイプ:  boolean optional
デフォルト: false
地図でユーザーがカメラの傾きを操作できるようにするかどうか。このオプションは、地図がベクター地図の場合にのみ有効です。コードで設定されていない場合は、地図 ID のクラウド構成が使用されます(利用可能な場合)。
HTML 属性:
  • <gmp-map tilt-interaction-disabled></gmp-map>
zoom
タイプ:  number optional
地図のズームレベル。有効なズーム値は、サポートされている最大ズームレベルまでの数値です。ズーム値が大きいほど、解像度が高くなります。
HTML 属性:
  • <gmp-map zoom="number"></gmp-map>
control-block-end-inline-center
スロット要素を ControlPosition.BLOCK_END_INLINE_CENTER 位置に配置します。
control-block-end-inline-end
スロット要素を ControlPosition.BLOCK_END_INLINE_END 位置に配置します。
control-block-end-inline-start
スロット要素を ControlPosition.BLOCK_END_INLINE_START 位置に配置します。
control-block-start-inline-center
スロット要素を ControlPosition.BLOCK_START_INLINE_CENTER 位置に配置します。
control-block-start-inline-end
スロット要素を ControlPosition.BLOCK_START_INLINE_END 位置に配置します。
control-block-start-inline-start
スロット要素を ControlPosition.BLOCK_START_INLINE_START 位置に配置します。
control-inline-end-block-center
スロット要素を ControlPosition.INLINE_END_BLOCK_CENTER 位置に配置します。
control-inline-end-block-end
スロット要素を ControlPosition.INLINE_END_BLOCK_END 位置に配置します。
control-inline-end-block-start
スロット要素を ControlPosition.INLINE_END_BLOCK_START 位置に配置します。
control-inline-start-block-center
スロット要素を ControlPosition.INLINE_START_BLOCK_CENTER 位置に配置します。
control-inline-start-block-end
スロット要素を ControlPosition.INLINE_START_BLOCK_END 位置に配置します。
control-inline-start-block-start
スロット要素を ControlPosition.INLINE_START_BLOCK_START 位置に配置します。
default
カスタム要素を使用して、Maps JavaScript Web Components(AdvancedMarkerElement など)を基に再利用可能なコンポーネントを作成できます。デフォルトでは、MapElement に直接追加されたカスタム要素は、MapPanes.overlayMouseTarget にスロット化され、レンダリングされます。ただし、Maps JavaScript API の Web Components は MapElement の内部スロットに再スロットされる場合があります。
BetaaddEventListener
addEventListener(type, listener[, options])
パラメータ: 
  • typestring リッスンするイベントタイプを表す大文字と小文字を区別する文字列。
  • listenerEventListener|EventListenerObject通知を受け取るオブジェクト。これは、handleEvent メソッドを含む関数またはオブジェクトである必要があります。
  • optionsboolean|AddEventListenerOptions optional オプションをご覧ください。カスタム イベントでは capturepassive のみがサポートされます。
戻り値:  void
指定されたイベントがターゲットに配信されるたびに呼び出される関数を設定します。addEventListener をご覧ください。
BetaremoveEventListener
removeEventListener(type, listener[, options])
パラメータ: 
戻り値:  void
以前に addEventListener で登録されたイベント リスナーをターゲットから削除します。removeEventListener をご覧ください。
gmp-zoomchange
function(event)
引数: 
このイベントは、地図のズーム プロパティが変更されると発生します。

MapElementOptions インターフェース

google.maps.MapElementOptions インターフェース

MapElement に設定できるプロパティを定義するために使用される MapElementOptions オブジェクト。

center optional
タイプ:  LatLng|LatLngLiteral optional
MapElement.center をご覧ください。
headingInteractionDisabled optional
タイプ:  boolean optional
MapElement.headingInteractionDisabled をご覧ください。
mapId optional
タイプ:  string optional
MapElement.mapId をご覧ください。
renderingType optional
タイプ:  RenderingType optional
MapElement.renderingType をご覧ください。
tiltInteractionDisabled optional
タイプ:  boolean optional
MapElement.tiltInteractionDisabled をご覧ください。
zoom optional
タイプ:  number optional
MapElement.zoom をご覧ください。

ZoomChangeEvent クラス

google.maps.ZoomChangeEvent クラス

このイベントは、ズームの変更をモニタリングした結果作成されます。

このクラスは Event を拡張します。

const {ZoomChangeEvent} = await google.maps.importLibrary("maps") を呼び出してアクセスします。Maps JavaScript API のライブラリをご覧ください。

MapTypeStyle インターフェース

google.maps.MapTypeStyle インターフェース

MapTypeStyle は、地図のスタイル設定方法を定義するセレクタとスタイル設定ツールのコレクションです。セレクタでは、影響を受ける地図の対象物や要素を指定します。スタイラでは、対象物や要素を変更する方法を指定します。詳細については、スタイルのリファレンスをご覧ください。

stylers
タイプ:  Array<Object>
選択した地図対象物と要素に適用するスタイルルール。ルールは、この配列で指定した順序で適用されます。使用方法と使用可能な値に関するガイドラインについては、スタイルのリファレンスをご覧ください。
elementType optional
タイプ:  string optional
スタイル設定を適用する要素。要素は、地図上の対象物の視覚的な要素です。例: ラベル、アイコン、ジオメトリに適用されたストロークや塗りつぶしなど。省略可。elementType が指定されていない場合、値は 'all' であるとみなされます。使用方法と使用可能な値の詳細については、スタイルのリファレンスをご覧ください。
featureType optional
タイプ:  string optional
スタイラを適用する対象物(対象物のグループ)省略可。featureType が指定されていない場合、値は 'all' であるとみなされます。使用方法と使用可能な値の詳細については、スタイルのリファレンスをご覧ください。

MapMouseEvent インターフェース

google.maps.MapMouseEvent インターフェース

このオブジェクトは、地図とオーバーレイ上のさまざまなマウスイベントから返され、次に示すすべてのフィールドが含まれます。

domEvent
対応するネイティブ DOM イベント。デベロッパーは、targetcurrentTargetrelatedTargetpath プロパティが定義され、一貫していることを前提としない必要があります。また、デベロッパーは Maps API の内部実装の DOM 構造にも依存しないでください。内部イベント マッピングにより、domEventMapMouseEvent のセマンティクスが異なる場合があります(例: MapMouseEvent「クリック」に KeyboardEvent タイプの domEvent がある場合)。
latLng optional
タイプ:  LatLng optional
イベントが発生したときにカーソルの下にあった緯度/経度。
stop
stop()
パラメータ: なし
戻り値:  void
このイベントがさらに伝播しないようにします。

IconMouseEvent インターフェース

google.maps.IconMouseEvent インターフェース

このオブジェクトは、ユーザーが地図上のアイコンをクリックしたときにイベントで送信されます。この場所のプレイス ID は、placeId メンバーに保存されます。デフォルトの情報ウィンドウが表示されないようにするには、このイベントで stop() メソッドを呼び出して、イベントが伝播されないようにします。プレイス ID の詳細については、Places API デベロッパー ガイドをご覧ください。

このインターフェースは MapMouseEvent を拡張します。

placeId optional
タイプ:  string optional
クリックされたプレイスのプレイス ID。このプレイス ID を使用して、クリックされた特徴の詳細情報をクエリできます。

プレイス ID の詳細については、Places API デベロッパー ガイドをご覧ください。

継承: domEventlatLng
継承: stop

ColorScheme 定数

google.maps.ColorScheme 定数

地図のカラーパターンの識別子。これらは値で指定するか、定数の名前を使用して指定します。たとえば、'FOLLOW_SYSTEM' や、google.maps.ColorScheme.FOLLOW_SYSTEM です。

const {ColorScheme} = await google.maps.importLibrary("core") を呼び出してアクセスします。Maps JavaScript API のライブラリをご覧ください。

DARK 地図のダーク カラーパターン。
FOLLOW_SYSTEM カラーパターンは、システムの設定に基づいて選択されます。
LIGHT 地図の明るい配色。従来の Maps JS のデフォルト値。

MapTypeId 定数

google.maps.MapTypeId 定数

一般的な MapType の ID。これらは値で指定するか、定数の名前を使用して指定します。たとえば、'satellite' や、google.maps.MapTypeId.SATELLITE です。

const {MapTypeId} = await google.maps.importLibrary("maps") を呼び出してアクセスします。Maps JavaScript API のライブラリをご覧ください。

HYBRID このマップ タイプは、航空写真上に主要な道路の透明なレイヤを表示します。
ROADMAP このマップ タイプは通常の市街地図を表示します。
SATELLITE このマップ タイプは航空写真を表示します。
TERRAIN このマップ タイプは地形や樹木などの地形的特徴を持つ地図を表示します。

MapTypeRegistry クラス

google.maps.MapTypeRegistry クラス

MapType ID をキーとする MapType インスタンスのレジストリ。

このクラスは MVCObject を拡張します。

const {MapTypeRegistry} = await google.maps.importLibrary("maps") を呼び出してアクセスします。Maps JavaScript API のライブラリをご覧ください。

MapTypeRegistry
MapTypeRegistry()
パラメータ: なし
MapTypeRegistry には、地図で使用できるカスタム マップタイプのコレクションが保持されます。API は、コントロール内で使用可能なマップタイプのリストを提供する場合などに、このレジストリを参照します。
set
set(id, mapType)
パラメータ: 
  • id:  レジストリに追加する MapType の識別子。string
  • mapType:  レジストリに追加する MapType|* MapType オブジェクト。
戻り値: なし
渡された文字列 ID を渡された MapType と関連付けるように、レジストリを設定します。
継承: addListenerbindTogetnotifysetValuesunbindunbindAll

MapRestriction インターフェース

google.maps.MapRestriction インターフェース

地図に適用できる制限。地図のビューポートはこれらの制限を超えません。

latLngBounds
設定すると、ユーザーは指定された境界内でのみパンとズームを行えるようになります。境界では、経度と緯度の両方を制限することも、緯度のみを制限することもできます。緯度のみの境界の場合は、西経と東経をそれぞれ -180 と 180 にします(例: latLngBounds: {north: northLat, south: southLat, west: -180, east: 180})。
strictBounds optional
タイプ:  boolean optional
strictBounds フラグを true に設定すると、境界をさらに制限できます。これにより、ユーザーがズームアウトできる範囲が狭まり、制限された境界外のものがすべて非表示になります。デフォルトは false です。つまり、ユーザーは境界領域全体が画面に表示されるまでズームアウトできます(境界領域外の領域が含まれる場合もあります)。

TrafficLayer クラス

google.maps.TrafficLayer クラス

交通レイヤ。

このクラスは MVCObject を拡張します。

const {TrafficLayer} = await google.maps.importLibrary("maps") を呼び出してアクセスします。Maps JavaScript API のライブラリをご覧ください。

TrafficLayer
TrafficLayer([opts])
パラメータ: 
現在の道路渋滞状況を表示するレイヤ。
getMap
getMap()
パラメータ: なし
戻り値:  Map
このレイヤが表示される地図を返します。
setMap
setMap(map)
パラメータ: 
戻り値: なし
指定された地図にレイヤをレンダリングします。map が null に設定されている場合、レイヤは削除されます。
setOptions
setOptions(options)
パラメータ: 
戻り値: なし
継承: addListenerbindTogetnotifysetsetValuesunbindunbindAll

TrafficLayerOptions インターフェース

google.maps.TrafficLayerOptions インターフェース

TrafficLayer に設定できるプロパティを定義するために使用される TrafficLayerOptions オブジェクト。

autoRefresh optional
タイプ:  boolean optional
デフォルト: true
トラフィック レイヤが更新された情報で自動的に更新されるかどうか。
map optional
タイプ:  Map optional
交通状況レイヤを表示する地図。

TransitLayer クラス

google.maps.TransitLayer クラス

交通機関レイヤ。

このクラスは MVCObject を拡張します。

const {TransitLayer} = await google.maps.importLibrary("maps") を呼び出してアクセスします。Maps JavaScript API のライブラリをご覧ください。

TransitLayer
TransitLayer()
パラメータ: なし
交通機関の路線を表示するレイヤ。
getMap
getMap()
パラメータ: なし
戻り値:  Map
このレイヤが表示される地図を返します。
setMap
setMap(map)
パラメータ: 
戻り値: なし
指定された地図にレイヤをレンダリングします。map が null に設定されている場合、レイヤは削除されます。
継承: addListenerbindTogetnotifysetsetValuesunbindunbindAll

BicyclingLayer クラス

google.maps.BicyclingLayer クラス

自動車レーンとパスを表示するレイヤ。

このクラスは MVCObject を拡張します。

const {BicyclingLayer} = await google.maps.importLibrary("maps") を呼び出してアクセスします。Maps JavaScript API のライブラリをご覧ください。

BicyclingLayer
BicyclingLayer()
パラメータ: なし
自動車レーンとパスを表示し、幹線道路を目立たなくするレイヤ。
getMap
getMap()
パラメータ: なし
戻り値:  Map
このレイヤが表示される地図を返します。
setMap
setMap(map)
パラメータ: 
戻り値: なし
指定された地図にレイヤをレンダリングします。map が null に設定されている場合、レイヤは削除されます。
継承: addListenerbindTogetnotifysetsetValuesunbindunbindAll

CameraOptions インターフェース

google.maps.CameraOptions インターフェース

地図のカメラ オプションの設定に使用されます。

center optional
タイプ:  LatLngLiteral|LatLng optional
heading optional
タイプ:  number optional
tilt optional
タイプ:  number optional
zoom optional
タイプ:  number optional

VisibleRegion インターフェース

google.maps.VisibleRegion インターフェース

地図の表示領域である 4 辺のポリゴンを定義する 4 つのポイントが含まれます。ベクターマップに傾斜がある場合、このポリゴンは長方形ではなく台形になることがあります。

farLeft
タイプ:  LatLng
farRight
タイプ:  LatLng
latLngBounds
タイプ:  LatLngBounds
表示されるリージョンを含む最小の境界ボックス。
nearLeft
タイプ:  LatLng
nearRight
タイプ:  LatLng

RenderingType 定数

google.maps.RenderingType 定数

const {RenderingType} = await google.maps.importLibrary("maps") を呼び出してアクセスします。Maps JavaScript API のライブラリをご覧ください。

RASTER 地図がラスターマップであることを示します。
UNINITIALIZED 地図の初期化がまだ完了していないため、地図がベクター地図かラスター地図かは不明であることを示します。
VECTOR 地図がベクターマップであることを示します。

MapCapabilities インターフェース

google.maps.MapCapabilities インターフェース

地図で現在利用可能な機能のスナップショットを含むオブジェクト。これは、関連するモジュールが読み込まれている、または初期化されていることを意味するわけではありません。現在の地図にこれらの API を使用する権限があることを意味します。使用可能な機能の一覧については、プロパティをご覧ください。

isAdvancedMarkersAvailable optional
タイプ:  boolean optional
true の場合、この地図は高度なマーカーを使用できるように正しく設定されています。高度なマーカーを使用するには、marker ライブラリをインポートする必要があります。詳しくは、https://goo.gle/gmp-isAdvancedMarkersAvailable をご覧ください。
isDataDrivenStylingAvailable optional
タイプ:  boolean optional
true の場合、この地図は、少なくとも 1 つの FeatureLayer でデータドリブンのスタイル設定を使用できるように適切に構成されています。詳しくは、https://goo.gle/gmp-data-driven-stylinghttps://goo.gle/gmp-FeatureLayerIsAvailable をご覧ください。
isWebGLOverlayViewAvailable optional
タイプ:  boolean optional
true の場合、このマップは WebGLOverlayView を使用できるように正しく構成されています。