google mapでカスタムオーバーレイ

GOverlayを継承したクラスを作っておく。

var map, customDiv;
function customBox() { }
customBox.prototype = new GOverlay();
customBox.prototype.initialize = function(map) {
	map.getPane(G_MAP_MAP_PANE).appendChild(customDiv);
}
customBox.prototype.redraw = function(force){}

実行されたらcustomDivというオブジェクトがgoogle map上に追加されていく。

実行はaddOberlayを利用

gMap.addOverlay( new customBox());

初期位置は初期配置されたオーバーレイのx:0px; y:0px;

positionでごにょごにょすると自由に配置できる。

たとえばクリックされたマーカーのpointかれ情報ウィンドウもどきを表示する。
情報ウィンドウは1地図一つしか表示されないけどカスタムオーバーレイだと複数表示できる。

var Point = gMap.fromLatLngToDivPixel(point);
Element.setStyle(customDiv, { 
　'left':Point.x+'px', 
　'top':Point.y+'px', 
})

個別のカスタムオーバーレイの削除がわからなかったけど、customDivにidとか振っておけば無理やり削除できる。