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])
パラメータ: 
指定されたオプションを使用して情報ウィンドウを作成します。情報ウィンドウは、オプションで指定された内容に応じて、地図上の特定の位置またはマーカーの上に配置できます。自動パンが無効にされていない限り、InfoWindow が開いたときに、地図がパンされて InfoWindow が表示されます。InfoWindow を作成したら、open を呼び出して地図に表示する必要があります。ユーザーは情報ウィンドウの閉じるボタン [X] をクリックして地図から情報ウィンドウを削除できます。またはデベロッパーが close() を呼び出しても同じことです。
isOpen
タイプ:  boolean
InfoWindow が開いているかどうかを確認します。
close
close()
パラメータ: なし
戻り値: なし
DOM 構造から削除して、この情報ウィンドウを閉じます。
focus
focus()
パラメータ: なし
戻り値: なし
この InfoWindow にフォーカスを設定します。このメソッドを visible イベントと組み合わせて使用することをおすすめします。これにより、InfoWindow にフォーカスを設定する前に、InfoWindow が確実に表示されます。表示されていない InfoWindow はフォーカスできません。
getContent
getContent()
パラメータ: なし
戻り値:  string|Element|Text|null|undefined このインフォウィンドウの内容。以前にコンテンツとして設定したものと同じです。
getHeaderContent
getHeaderContent()
パラメータ: なし
戻り値:  string|Element|Text|null|undefined この InfoWindow のヘッダー コンテンツ。InfoWindowOptions.headerContent をご覧ください。
getHeaderDisabled
getHeaderDisabled()
パラメータ: なし
戻り値:  boolean|undefined ヘッダー行全体が無効かどうか。InfoWindowOptions.headerDisabled をご覧ください。
getPosition
getPosition()
パラメータ: なし
戻り値:  LatLng|null|undefined この InfoWindow の LatLng 位置。
getZIndex
getZIndex()
パラメータ: なし
戻り値:  number この InfoWindow の zIndex。
open
open([options, anchor])
パラメータ: 
  • optionsInfoWindowOpenOptions|Map|StreetViewPanorama optional InfoWindowOpenOptions オブジェクト(推奨)または、この情報ウィンドウをレンダリングする地図またはパノラマ。
  • anchorMVCObject|AdvancedMarkerElement optional このインフォウィンドウを配置するアンカー。アンカーが null でない場合、InfoWindow はアンカーの中央上部に配置されます。情報ウィンドウは、アンカーと同じ地図またはパノラマにレンダリングされます(利用可能な場合)。
戻り値: なし
指定された地図でこのインフォウィンドウを開きます。必要に応じて、InfoWindow をアンカーに関連付けることができます。コア API では、唯一のアンカーは Marker クラスです。ただし、アンカーは、LatLng position プロパティを公開する MVCObject であれば、pixelOffset の計算に Point anchorPoint プロパティを公開することもできます(InfoWindowOptions を参照)。anchorPoint は、アンカーの位置から InfoWindow の先端までのオフセットです。このメソッドの単一の引数として InfoWindowOpenOptions インターフェースを使用することをおすすめします。開いたときにブラウザのフォーカスが変更されないようにするには、InfoWindowOpenOptions.shouldFocusfalse に設定します。
setContent
setContent([content])
パラメータ: 
  • contentstring|Element|Text optionalこの情報ウィンドウに表示されるコンテンツ。
戻り値: なし
setHeaderContent
setHeaderContent([headerContent])
パラメータ: 
戻り値: なし
setHeaderDisabled
setHeaderDisabled([headerDisabled])
パラメータ: 
  • headerDisabledboolean optional ヘッダー行全体を無効にするかどうかを指定します。InfoWindowOptions.headerDisabled をご覧ください。
戻り値: なし
setOptions
setOptions([options])
パラメータ: 
戻り値: なし
setPosition
setPosition([position])
パラメータ: 
戻り値: なし
setZIndex
setZIndex(zIndex)
パラメータ: 
  • zIndexnumberこの InfoWindow の z インデックス。Z インデックスが大きい InfoWindow は、Z インデックスが低い他のすべての InfoWindow の前に表示されます。
戻り値: なし
継承: addListenerbindTogetnotifysetsetValuesunbindunbindAll
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 インターフェース

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

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

InfoWindowOpenOptions インターフェース

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

InfoWindow を開くオプション

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