<!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">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  <head><title>経度・緯度を調べる（地図作成作業補助サンプル）</title>
    <!-- 下記キーは、必ず自分専用のものをhttp://www.google.com/apis/maps/で取得して使ってください -->
    <script src="http://maps.google.com/maps?file=api&v=1&key=ABQIAAAArXkhpD8kl_yiiFjm3U9X7BTLWCrfVQwX-dEBPQ3oKtfnxsFVxxRUaJZow2cHaaFJqFub0xe7IfB-Fg" type="text/javascript"></script>
  </head>
  <body>
    <div id="map" style="width: 500px; height: 400px"></div>
    <script type="text/javascript">
    //<![CDATA[
    
    var map = new GMap(document.getElementById("map"));
    map.centerAndZoom(new GPoint(139.765449,35.633477), 10);
    map.addControl(new GLargeMapControl());
    map.addControl(new GMapTypeControl());

    //十字アイコン作成
    var icon = new GIcon();
    icon.image = "./cross.png";
    icon.iconSize = new GSize(100, 100);
    icon.iconAnchor = new GPoint(50, 50);
    var marker = new GMarker(map.getCenterLatLng(), icon);
    map.addOverlay(marker);
   
    //地図移動で十字アイコン追随と、座標を表示
    GEvent.addListener(map, "move", function() { 
       map.clearOverlays()
       marker = new GMarker(map.getCenterLatLng(), icon);
       map.addOverlay(marker);
       
       //十字アイコンが示す座標を表示
       document.getElementById('datalatlon').innerHTML=map.getCenterLatLng() 
    });


    //]]>
    </script>
    
    <div id="datalatlon" style="font-size:1.2em;">---</div>


    <!-- 最新版 -->
    <script type="text/javascript" src="./saisin.js"></script>
        <br />
    <br />[ <a href='http://jsgt.org/mt/01/'>かも日記</a> ] [ <a href='http://jsgt.org/ajax/'>入門Ajax</a>  ] [ <a href='http://jsgt.org/ajax/newmon/GoogleMapsAPI.htm'>Google Maps API クラスリファレンス</a>  ]

  </body>
</html>