Google MapsTMで遊んでみよう！
最終更新日 2007/11/10
【ドラッグ後に地図の中心座標を表示させる】
下の地図をドラッグしてみてください。地図がドラッグにより移動終了した時点で地図の下側に中心座標が(緯度、経度)の形式で表示されます。
ブラウザで「ソースの表示」を行うとこの見本のJAVAScriptを読むことができます。
//<![CDATA[
function load() {
if (GBrowserIsCompatible()) {
var map = new GMap2(document.getElementById("map"));
map.addControl(new GLargeMapControl());
map.addControl(new GMapTypeControl());
map.addControl(new GScaleControl());
map.setCenter(new GLatLng(34.94097,135.765953), 13);
GEvent.addListener(map, "moveend", function() {
var center = map.getCenter();
document.getElementById("message").innerHTML = center.toString();
});
}
}
//]]>
●GEvent.addListener()でmapオブジェクトに"moveend"イベントが発生した(ドラッグが完了した)とき、
mapオブジェクトの中心座標をgetCenter()で取り出し、変数centerに格納します。
そしてtoString()で変数centerの値をストリング形式に変換し、messageオブジェクト内に内部HTML形式で出力します。
messageオブジェクトの配置はmapオブジェクトとともに以下のように定義されています。
<body onload="load()" onunload="GUnload()">
<div id="map" style="width: 640px; height: 480px"></div>
<div id="message"></div>
</body>