goole map API實例

第一個:

<html>
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
 <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
  <script type="text/javascript">
  function initialize()
  { 
  var latlng = new google.maps.LatLng(22.538879564256025, 114.11844713783264); //22.538879564256025, 114.11844713783264爲經緯度
   var myOptions = {
      zoom: 15,    //縮放大小
      center: latlng,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
    //添加一個標記
    var marker = new google.maps.Marker({
        position: latlng,
        map: map,
        title:"Hello World!\n電話:13713731383"
    });  
  }
  </script>
   </head>
   <body onLoad="initialize()"> 
    <div id="map_canvas" style="width:400px;; height:400px;"></div>
   
    <div>
    google Map經緯度座標取得方法<br>

  首先打開Google地圖,在上面尋找一個地址,然後上下左右移動地圖,讓這個地址正好處於地圖的正中心位置,當您想尋找座標位置已經處於地圖的中心位置的時候,拷貝並粘貼以下代碼到你的瀏覽器地址欄:<br/>

  javascript:void(prompt('',gApplication.getMap().getCenter())); <br/>

  這時,你將得到一個彈出式的座標,這個座標就是你需要找的經度和緯度<br/>
    </div>
     </body>  
 </html>

第二個:

<html>
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
 <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
  <script type="text/javascript">
  function initialize()
  { 
  var myLatlng = new google.maps.LatLng(22.538879564256025, 114.11844713783264); //22.538879564256025, 114.11844713783264爲經緯度
   var myOptions = {
      zoom: 15,    //縮放大小
      center: myLatlng,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
    //添加一個標記
    var contentString = '<div id="content">Welcome ITA-Solution<br/>聯繫電話:15013870009</div>'; 
 var infowindow = new google.maps.InfoWindow({     content: contentString }); 
 var marker = new google.maps.Marker({     position: myLatlng,     map: map,     title:"Uluru (Ayers Rock)" });
 google.maps.event.addListener(marker, 'click', function() {   infowindow.open(map,marker); });
  }
  </script>
   </head>
   <body onLoad="initialize()"> 
    <div id="map_canvas" style="width:400px;; height:400px;"></div>
     </body>  
 </html>

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章