【Google Map】情報ウィンドウ（吹き出し）を表示する

【Google Map】
情報ウィンドウ（吹き出し）を表示する

「情報ウィンドウ」とは、地図上に表示できる吹き出しのこと。
「情報ウィンドウ」には、文字を表示したり、フォームを表示して入力ために用いることもできる。
「情報ウィンドウ」を表示するには、「google.maps.InfoWindow」クラスを使用する。
使用方法は、「InfoWindow」クラスのインスタンスを作成して、「InfoWindow.open()」メソッドで開く。

var infoWnd = new google.maps.InfoWindow({
position:new google.maps.LatLng(35.681382,139.766084),
content:"Hello Window!"
});

//マーカー吹き出しを表示する方法。
infoWnd.open(null, marker1);

//マーカーの代わりに吹き出しを表示する方法。
//infoWnd.open(mapCanvas);

「InfoWindow」クラスのコンストラクタ

InfoWindow(初期化するためのオプション)

「content」「position」プロパティを設定しないと地図上に表示されない。
「content」プロパティには、情報ウィンドウに表示する文字列・HTML・DOMノードを設定する。
「setContent()」メソッドで設定することも可能。

情報ウィンドウを表示する方法

InfoWindow.open(map,anchor)

map	「InfoWindow」クラスを表示するMapを指定する。「null」を指定すると地図上に表示されなくなる。
anchor	「InfoWindow」クラスを関連づけるMarkerを指定する。第二引数を指定する時は、第一引数を省略することが可能。

「InfoWindow」クラスオプションのプロパティ

content	情報ウィンドウ内に表示する内容を設定する。情報ウィンドウのサイズは、自動調整される。
disableAutoPan	情報ウィンドウが表示されるとき、地図内に表示されるように地図を動かすかを指定する。「true」を指定すると動かさない。
maxWidth	情報ウィンドウが最大に広がる幅を設定する。 open()メソッドを呼び出す前に設定する必要あり。
position	情報ウィンドウをっ表示する経度緯度を指定する。指定方法は、「LatLng」クラスで指定する。「open()」メソッドの「anchor」を指定した場合、positionの値が使用される。

「InfoWindow」クラスのメソッド

close()	情報ウィンドウを閉じる。
getContent()	contentプロパティの内容を返す。
getPosition()	positionプロパティの内容を返す。
open(map?:Map, anchor?:MVCObject)	情報ウィンドウを表示する。
setContent(content:string \| Node)	情報ウィンドウが表示した時の内容を、contentプロパティに設定。
setOptions(options:InfoWindowOptions)	情報ウィンドウの表示オプションを設定する。
setPostion(position:LatLng)	情報ウィンドウを表示する位置をpositionプロパティに設定。