AJAXのお勉強

Googleマップ オーバープレビュー＠AJAX

オーバープレビューを表示します。

画面の隅に、全体図が表示され、
縮小した時に、全体図画見れるので便利です。

拡大しすぎると、位置がよくわからなくなるので、
そういった場合に、表示すると便利だと思います。

map.addControl(new GOverviewMapControl())
で表示することができます。


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>Googleマップ API オーバープレビュー</title>
<script src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=****" type="text/javascript"></script>
<script type="text/javascript">

//<![CDATA[


function load() {
    if (GBrowserIsCompatible()) {

        //東京駅
        var point = new GLatLng(35.681099,139.767084);

        //マップ生成
        var map = new GMap2(document.getElementById("map"));
        map.setCenter(point, 13);
        
        var marker = new GMarker(point);
        map.addOverlay(marker);

        //オーバープレビュー
        map.addControl(new GOverviewMapControl());
    }
}

</script>
</head>
<body onunload="GUnload()" onload="load();">
<form id="form1">
    <div id="map" style="width: 600px; height: 400px"></div>
</form>
</body>
</html>

Copyright (C) 2008 AJAXのお勉強. All Rights Reserved.