本身的项目中有获取当前点击的坐标经纬度或者获取当前街道的信息的需求。
预计这个对付新手来说，还是对照麻烦的，因为从官网上找这个也并不是很好找，要找好久的，运气好的可能会一下子找到。
献上本身写的测试案例。代码如下：
<!DOCTYPE html> <html> <head> <title>Simple Map</title> <meta content="initial-scale=1.0"> <meta charset="utf-8"> <style> html, body { height: 100%; margin: 0; padding: 0; } #map { height: 100%; } </style> </head> <body> <div></div> <script> function initMap() { var myLatlng = { lat: 39.921323, lng: 116.426239 }; var marker ; var markersArray = []; var map = new google.maps.Map(document.getElementById(‘map‘), { zoom: 12, center: myLatlng }); // ---- Google隐藏 ---- var isFirstLoad=true; //舆图瓦片加载完成之后的回调 google.maps.event.addListener(map, ‘tilesloaded‘, function () { if (isFirstLoad) { hideLogo(); isFirstLoad=false; } }); function hideLogo() { $("#map .gm-style-cc").hide(); $("#map [title=‘点击以在 Google 舆图上检察此区域‘]").hide(); } // ---- Google隐藏 ---- map.addListener(‘click‘, function(e) { addMarker(e.latLng, map); //按照经纬度获取 当前地舆信息 var latLngData = e.latLng.lat().toFixed(6)+‘,‘+e.latLng.lng().toFixed(6); console.log(latLngData) $.ajax({ type:"post", url:"https://maps.googleapis.com/maps/api/geocode/json?latlng="+latLngData+"&location_type=ROOFTOP&result_type=street_address&key=AIzaSyC8IXpNgfA7uD-Xb0jEqhkEdB7j3gbgOiE", async:true, success:function(data){ console.log(data) var site = latLngData+‘<br />‘+data.results[0].formatted_address; console.log(site) var infowindow = new google.maps.InfoWindow({ content: site }); infowindow.open(map,marker); //弹出信息提示窗口 } }); }); //添加坐标东西 function addMarker(latLng, map) { if(markersArray.length>0){ markersArray[0].setMap(null); }; markersArray.shift(marker) marker = new google.maps.Marker({ position: latLng, map: map }); markersArray.push(marker); } } </script> <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script> <script src="http://www.mamicode.com/https:/maps.googleapis.com/maps/api/js?key=AIzaSyC8IXpNgfA7uD-Xb0jEqhkEdB7j3gbgOiE&callback=initMap" async defer></script> </body> </html> <script> $(window).load(function(){ //$("#map [title=‘点击以在 Google 舆图上检察此区域‘]").hide(); //$(‘.gm-style-cc‘).hide(); }); </script>
注意：请引入本身本地的jquery，因为要用的ajax请求，谷歌的地舆处事接口。
代码的核心就在于请求的URL：
url:"https://maps.googleapis.com/maps/api/geocode/json?latlng="+latLngData+"&location_type=ROOFTOP&result_type=street_address&key=AIzaSyC8IXpNgfA7uD-Xb0jEqhkEdB7j3gbgOiE"
这个是经纬度反向地舆编码， 这段url里有四个参数：latlng，location_type，result_type，key，，具体观点以及参数详解，请参考下一章的 谷歌舆图API 开发 之 Geocoding API