Google Maps API V3学习一（获取地图坐标与街道地址）

最新推荐文章于 2024-08-16 17:41:49 发布

夏天的一朵云

最新推荐文章于 2024-08-16 17:41:49 发布

阅读量3.4k

点赞数

分类专栏： google api 定位坐标谷歌地图

google api 同时被 3 个专栏收录

2 篇文章 0 订阅

订阅专栏

谷歌地图

2 篇文章 0 订阅

订阅专栏

定位坐标

1 篇文章 0 订阅

订阅专栏

最近需要用到Google地图，整理下：

官方文档地址：http://code.google.com/intl/zh-CN/apis/maps/documentation/javascript/basics.html

html代码：

[xhtml]view plaincopy 
   
 <body onload="initialize()">  
 <div id="map_canvas"></div>  
 <div id="content" style="display:none;" mce_style="display:none;" ><span id="loca"></span><br />  
   <span id="addr"></span></div>  

JavaScript代码：

[javascript]view plaincopy 
   
 <mce:script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false" mce_src="http://maps.google.com/maps/api/js?sensor=false"></mce:script>   
 <mce:script type="text/javascript"><!--  
 var map;  
 var marker;  
 var infowindow;  
 var geocoder;  
 var markersArray = [];  
 var content = document.getElementById("content");  
 var loca = document.getElementById("loca")  
 var addr = document.getElementById("addr")  
 function initialize() {  
     geocoder = new google.maps.Geocoder();   
     var latlng = new google.maps.LatLng(28.212651557421317,112.94564378840637);  
     var myOptions = {  
         zoom: 9,  
         center: latlng,  
         navigationControl: true,  
         scaleControl: true,  
         streetViewControl: true,        
         mapTypeId: google.maps.MapTypeId.ROADMAP  
     };  
     map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);  
       
     google.maps.event.addListener(map, 'click', function(event) {  
         placeMarker(event.latLng);  
     });  
   }  
 function placeMarker(location) {  
     clearOverlays(infowindow);  
     marker = new google.maps.Marker({  
         position: location,   
         map: map  
     });  
     markersArray.push(marker);  
       
     var _cs = [];  
     _cs[_cs.length] = "坐标为：";  
     _cs[_cs.length] = location.lat();  
     _cs[_cs.length] = ",";  
     _cs[_cs.length] = location.lng();  
       
     loca.innerHTML = _cs.join("");  
       
     if (geocoder) {  
       geocoder.geocode({'location': location}, function(results, status) {  
         if (status == google.maps.GeocoderStatus.OK) {  
           if (results[0]) {  
             addr.innerHTML = " 地址为：" + results[0].formatted_address;  
           }   
         } else {  
             alert("Geocoder failed due to: " + status);  
         }  
       });  
     }  
       
     content.style.display = "";  
    
     infowindow = new google.maps.InfoWindow({     
         content: content,  
         //size: new google.maps.Size(50,50),  
         position: location  
     });  
     infowindow.open(map);  
  }  
    
   // Deletes all markers in the array by removing references to them  
 function clearOverlays(infowindow) {  
     if (markersArray) {  
         for (i in markersArray) {  
             markersArray[i].setMap(null);  
         }  
         markersArray.length = 0;  
     }  
     if(infowindow){  
         infowindow.close();  
     }  
 }  
 // --></mce:script>  