GoogleMap

トップ > 試作品 > GoogleMap:js,tools

マーカーのイベント設定と位置取得

マーカーをドロップした場所の緯度(lat)と経度(lng)を取得するサンプルです。ナビゲーションを利用して大まかな位置を決定した後、「マーカを中央に移動」ボタンをクリックすると画面中央にマーカが現れます。次にこのマーカーをドラッグし、位置の微調整を行って下さい。マーカの位置は地図下のテキストエリアに表示されています。

lat(緯度): lng(経度):  

コード

ページ読み込み時に実行されるJavaScriptの主な部分のみ抜粋します。詳細はこのページのソースコードを参照して下さい。

map = new GMap2(document.getElementById("map_canvas"));
map.addControl(new GLargeMapControl());
var center = new GLatLng(35.178158,137.04586);
map.setCenter(center, 13);

marker = new GMarker(center, {draggable: true});

GEvent.addListener(marker, "dragend", function() {
  var ll = marker.getLatLng();
  document.getElementsByName("lat")[0].value = ll.lat();
  document.getElementsByName("lng")[0].value = ll.lng();
});
map.addOverlay(marker);