読者です 読者をやめる 読者になる 読者になる

Googleマップの中心の緯度経度を表示する

ちょっと、古めの内容ですが、Googleマップの中心の緯度経度を表示してみました。
こんな感じで、ドラッグしても、センターの場所を教えてくれます。

ソースコードはこちらっ

<html xmlns="http//www.w3.org/1999/xhtml">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  <title></title>
  <script src="http://maps.google.com/maps?file=api&v=2&key=APIKEY&sensor=false" type="text/javascript"></script>
  <script type="text/javascript">
  function initialize() {
    if (GBrowserIsCompatible()) {
      //マップの初期化
      var map = new GMap2( document.getElementById("map") );
      var point = new GLatLng( 35 , 139 );
      console.log( point );
      map.setCenter( point , 18);
      map.addControl(  new GLargeMapControl(),
                       new GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(5,30))
                     );
      map.addControl(new GMapTypeControl());
      map.addControl(new GScaleControl());
      //十字アイコン作成
      var icon        = new GIcon();
      icon.image      = "/image/top/gmap_cursor.gif";
      icon.iconSize   = new GSize(100, 100);
      icon.iconAnchor = new GPoint(50, 50);
      var marker      = new GMarker( point , icon );
      map.addOverlay(marker);
      //マップ移動イベント
      GEvent.addListener( map , "move" , function(){
        //現在の緯度経度を表示する
        showLatLon();
      });
      //十字アイコンが示す座標を表示
      showLatLon= function (){
        //マップの中央を取得
        var point = map.getCenter();
        //マーカーをセンターに配置する
        marker.setPoint( point );
        document.getElementById("latlon").innerHTML ="緯度:" + point.lng() + "<br />経度:" + point.lat();
      };
      showLatLon();
    }
  }
  </script>
</head>
<body onload="initialize()" onunload="GUnload()">
<div id="latlon" style="padding:10px;">
  緯度:読み込み中・・・<br>
  経度:読み込み中・・・
</div>
<div id="map" style="width:480px;height:480px;"></div>
</body>
</html>