我设法使用基于HTML的地理位置来获取用户的纬度和经度。
//Check if browser supports W3C Geolocation API if (navigator.geolocation) { navigator.geolocation.getCurrentPosition(successFunction, errorFunction); } //Get latitude and longitude; function successFunction(position) { var lat = position.coords.latitude; var long = position.coords.longitude; }
我想显示城市名称,看来获得城市名称的唯一方法是使用反向地理位置API。我阅读了Google的反向地理位置文档,但是我不知道如何在我的网站上获得输出。
我不知道该如何使用:"http://maps.googleapis.com/maps/api/geocode/json?latlng='+lat+','+long+'&sensor=true"在页面上显示城市名称。
"http://maps.googleapis.com/maps/api/geocode/json?latlng='+lat+','+long+'&sensor=true"
我该如何实现?
您将使用Google API执行类似的操作。
请注意,您必须包括google maps库才能起作用。Google地理编码器会返回很多地址组成部分,因此您必须做出有根据的猜测,以判断哪个人拥有城市。
“ administrative_area_level_1” 通常是您要寻找的,但有时所在地是您追求的城市。
下面是应该完成此技巧的代码:
<!DOCTYPE html> <html> <head> <meta name="viewport" content="initial-scale=1.0, user-scalable=no"/> <meta http-equiv="content-type" content="text/html; charset=UTF-8"/> <title>Reverse Geocoding</title> <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script> <script type="text/javascript"> var geocoder; if (navigator.geolocation) { navigator.geolocation.getCurrentPosition(successFunction, errorFunction); } //Get the latitude and the longitude; function successFunction(position) { var lat = position.coords.latitude; var lng = position.coords.longitude; codeLatLng(lat, lng) } function errorFunction(){ alert("Geocoder failed"); } function initialize() { geocoder = new google.maps.Geocoder(); } function codeLatLng(lat, lng) { var latlng = new google.maps.LatLng(lat, lng); geocoder.geocode({'latLng': latlng}, function(results, status) { if (status == google.maps.GeocoderStatus.OK) { console.log(results) if (results[1]) { //formatted address alert(results[0].formatted_address) //find country name for (var i=0; i<results[0].address_components.length; i++) { for (var b=0;b<results[0].address_components[i].types.length;b++) { //there are different types that might hold a city admin_area_lvl_1 usually does in come cases looking for sublocality type will be more appropriate if (results[0].address_components[i].types[b] == "administrative_area_level_1") { //this is the object you are looking for city= results[0].address_components[i]; break; } } } //city data alert(city.short_name + " " + city.long_name) } else { alert("No results found"); } } else { alert("Geocoder failed due to: " + status); } }); } </script> </head> <body onload="initialize()"> </body> </html>