Info Window

InfoWindow クラス

google.maps.InfoWindow クラス

バブルのように見えるオーバーレイで、通常はマーカーに連結されます。

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

const {InfoWindow} = await google.maps.importLibrary("maps") または const {InfoWindow} = await google.maps.importLibrary("streetView") を呼び出してアクセスします。Maps JavaScript API のライブラリをご覧ください。
InfoWindow
InfoWindow([opts])
パラメータ: 
指定されたオプションで情報ウィンドウを作成します。情報ウィンドウは、オプションの指定内容に応じて、地図上の特定の位置またはマーカーの上に配置できます。自動パンが無効になっていない限り、情報ウィンドウは、開いたときに自身が表示されるように地図をパンします。情報ウィンドウを作成したら、open を呼び出して地図上に表示する必要があります。ユーザーは情報ウィンドウの閉じるボタン [X] をクリックして地図から情報ウィンドウを削除できます。またはデベロッパーが close() を呼び出しても同じことです。
isOpen
タイプ:  boolean
情報ウィンドウが開いているかどうかを確認します。
close
close()
パラメータ: なし
戻り値: なし
DOM 構造から削除して、この情報ウィンドウを閉じます。
focus
focus()
パラメータ: なし
戻り値: なし
この InfoWindow にフォーカスを設定します。このメソッドを visible イベントと併用して、フォーカスを設定する前に InfoWindow が表示されていることを確認することをおすすめします。表示されていない InfoWindow はフォーカスできません。
getContent
getContent()
パラメータ: なし
戻り値:  string|Element|Text|null|undefined この情報ウィンドウのコンテンツ。以前にコンテンツとして設定されたものと同じです。
getHeaderContent
getHeaderContent()
パラメータ: なし
戻り値:  string|Element|Text|null|undefined この情報ウィンドウのヘッダー コンテンツ。InfoWindowOptions.headerContent をご覧ください。
getHeaderDisabled
getHeaderDisabled()
パラメータ: なし
戻り値:  boolean|undefined ヘッダー行全体が無効になっているかどうか。InfoWindowOptions.headerDisabled をご覧ください。
getPosition
getPosition()
パラメータ: なし
戻り値:  LatLng|null|undefined この情報ウィンドウの LatLng の位置。
getZIndex
getZIndex()
パラメータ: なし
戻り値:  number この情報ウィンドウの zIndex。
open
open([options, anchor])
パラメータ: 
  • options:  InfoWindowOpenOptions|Map|StreetViewPanorama optional InfoWindowOpenOptions オブジェクト（推奨）、またはこの情報ウィンドウをレンダリングする地図|パノラマ。
  • anchor:  MVCObject|AdvancedMarkerElement optional この情報ウィンドウが配置されるアンカー。アンカーが null でない場合、情報ウィンドウはアンカーの上部中央に配置されます。情報ウィンドウは、アンカーと同じ地図またはパノラマにレンダリングされます（利用可能な場合）。
戻り値: なし
指定された地図でこの情報ウィンドウを開きます。必要に応じて、情報ウィンドウをアンカーに関連付けることができます。コア API では、唯一のアンカーは Marker クラスです。ただし、アンカーは、LatLng position プロパティと、必要に応じて pixelOffset を計算するためのポイント anchorPoint プロパティを公開する任意の MVCObject にできます（InfoWindowOptions を参照）。anchorPoint は、アンカーの位置から情報ウィンドウの先端までのオフセットです。このメソッドの単一の引数として、InfoWindowOpenOptions インターフェースを使用することをおすすめします。開いているときにブラウザのフォーカスが変更されないようにするには、InfoWindowOpenOptions.shouldFocus を false に設定します。
setContent
setContent([content])
パラメータ: 
  • content:  string|Element|Text optional この情報ウィンドウに表示されるコンテンツ。
戻り値: なし
setHeaderContent
setHeaderContent([headerContent])
パラメータ: 
戻り値: なし
setHeaderDisabled
setHeaderDisabled([headerDisabled])
パラメータ: 
  • headerDisabled:  boolean optional ヘッダー行全体を無効にするかどうかを指定します。InfoWindowOptions.headerDisabled をご覧ください。
戻り値: なし
setOptions
setOptions([options])
パラメータ: 
戻り値: なし
setPosition
setPosition([position])
パラメータ: 
  • position:  LatLng|LatLngLiteral optional この情報ウィンドウを表示する LatLng の位置。
戻り値: なし
setZIndex
setZIndex(zIndex)
パラメータ: 
  • zIndex:  number この情報ウィンドウの Z-Index。Z-Index 値が大きい情報ウィンドウは、Z-Index 値が低い他のすべての情報ウィンドウの前に表示されます。
戻り値: なし
継承: addListener、 bindTo、 get、 notify、 set、 setValues、 unbind、 unbindAll
close
function()
引数: なし
このイベントは、InfoWindow が閉じるたびに発生します。たとえば、InfoWindow.close メソッドを呼び出す、Esc キーを押して情報ウィンドウを閉じる、閉じるボタンをクリックする、情報ウィンドウを別の地図に移動するなどの処理が考えられます。
closeclick
function()
引数: なし
このイベントは、閉じるボタン [X] がクリックされると発生します。
content_changed
function()
引数: なし
このイベントは、content プロパティが変更されると発生します。
domready
function()
引数: なし
このイベントは、InfoWindow のコンテンツを含む <div> が DOM にアタッチされると発生します。情報ウィンドウのコンテンツを動的に作成している場合は、このイベントを監視できます。
headercontent_changed
function()
引数: なし
このイベントは、headerContent プロパティが変更されると発生します。
headerdisabled_changed
function()
引数: なし
このイベントは、headerDisabled プロパティが変更されると発生します。
position_changed
function()
引数: なし
このイベントは、position プロパティが変更されると発生します。
visible
function()
引数: なし
このイベントは、InfoWindow が完全に表示されると発生します。このイベントは、InfoWindow がパンされて画面に戻ったときには発生しません。
zindex_changed
function()
引数: なし
このイベントは、InfoWindow の zIndex が変更されると発生します。

InfoWindowOptions インターフェース

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

InfoWindowOptions オブジェクトでは、InfoWindow に設定できるプロパティを定義します。
ariaLabel optional
タイプ:  string optional
情報ウィンドウに割り当てる AriaLabel。
content optional
タイプ:  string|Element|Text optional
情報ウィンドウに表示するコンテンツ。HTML 要素、書式なしテキストの文字列、HTML を含む文字列を指定できます。情報ウィンドウのサイズはコンテンツに応じて変わります。コンテンツのサイズを明示的に設定するには、コンテンツをそのサイズの HTML 要素として設定します。
disableAutoPan optional
タイプ:  boolean optional
デフォルト: false
地図の移動を無効にすると、情報ウィンドウを開いたときに完全に表示されるようになります。
headerContent optional
タイプ:  string|Element|Text optional
情報ウィンドウのヘッダー行に表示するコンテンツ。HTML 要素または書式なしテキストの文字列を指定できます。情報ウィンドウのサイズはコンテンツに応じて変わります。ヘッダー コンテンツのサイズを明示的に設定するには、headerContent をそのサイズの HTML 要素に設定します。
headerDisabled optional
タイプ:  boolean optional
情報ウィンドウでヘッダー行全体を無効にします。true に設定すると、ヘッダーは削除され、ヘッダーの内容と閉じるボタンは非表示になります。
maxWidth optional
タイプ:  number optional
情報ウィンドウの最大幅（コンテンツの幅と無関係）。この値は、open() の呼び出し前に設定された場合にのみ考慮されます。コンテンツを変更するときに最大幅を変更するには、close()、setOptions()、open() の順に呼び出します。
minWidth optional
タイプ:  number optional
情報ウィンドウの最小幅。コンテンツの幅と無関係です。このプロパティを使用する場合は、minWidth を地図の幅（ピクセル単位）より小さい値に設定することを強くおすすめします。この値は、open() の呼び出し前に設定された場合にのみ考慮されます。コンテンツを変更するときに最小幅を変更するには、close()、setOptions()、open() の順に呼び出します。
pixelOffset optional
タイプ:  Size optional
情報ウィンドウが固定されている地理的座標の地図上の地点からの情報ウィンドウの先端のオフセット（ピクセル単位）。情報ウィンドウをアンカーで開く場合、pixelOffset はアンカーの anchorPoint プロパティから計算されます。
position optional
タイプ:  LatLng|LatLngLiteral optional
この情報ウィンドウを表示する LatLng。情報ウィンドウをアンカーで開く場合は、アンカーの位置が使用されます。
zIndex optional
タイプ:  number optional
すべての情報ウィンドウは zIndex の順で地図上に表示され、高い値を持つ情報ウィンドウより低い値が表示されます。デフォルトでは、情報ウィンドウは緯度に従って表示され、緯度が低いほど高い緯度にある情報ウィンドウの前に、低い緯度の情報ウィンドウが表示されます。情報ウィンドウは常にマーカーの前に表示されます。

InfoWindowOpenOptions インターフェース

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

情報ウィンドウを開くためのオプション
anchor optional
タイプ:  MVCObject|AdvancedMarkerElement optional
この情報ウィンドウが配置されるアンカー。アンカーが null でない場合、情報ウィンドウはアンカーの上部中央に配置されます。情報ウィンドウは、アンカーと同じ地図またはパノラマにレンダリングされます（利用可能な場合）。
map optional
タイプ:  Map|StreetViewPanorama optional
この情報ウィンドウをレンダリングする地図またはパノラマ。
shouldFocus optional
タイプ:  boolean optional
情報ウィンドウを開いたときに、その内部でフォーカスを移動するかどうかを指定します。このプロパティを未設定のままにした場合や、null または undefined に設定した場合は、ヒューリスティックを使用してフォーカスを移動するかどうかが決定されます。ヒューリスティックは変更される可能性があり、すべてのユースケースで適切に機能するとは限らないため、ニーズに合わせてこのプロパティを明示的に設定することをおすすめします。