使用地理位置获取城市名称
使用地理位置获取城市名称
提问于 2011-07-23 09:00:59
我设法使用基于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"在页面上显示城市名称。
我如何才能做到这一点？
回答 7
Stack Overflow用户
发布于 2013-07-30 20:43:52
另一种方法是使用我的服务http://ipinfo.io，它根据用户当前的IP地址返回城市、地区和国家名称。下面是一个简单的例子：
$.get("http://ipinfo.io", function(response) {
console.log(response.city, response.country);
}, "jsonp");下面是一个更详细的JSFiddle示例，它还会打印出完整的响应信息，因此您可以看到所有可用的详细信息：http://jsfiddle.net/zK5FN/2/
Stack Overflow用户
发布于 2016-04-29 12:12:07
您可以使用Google地图地理编码API获取城市名称、国家名称、街道名称和其他地理数据
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript" src="https://code.jquery.com/jquery-2.2.3.js"></script>
</head>
<body>
<script type="text/javascript">
navigator.geolocation.getCurrentPosition(success, error);
function success(position) {
console.log(position.coords.latitude)
console.log(position.coords.longitude)
var GEOCODING = 'https://maps.googleapis.com/maps/api/geocode/json?latlng=' + position.coords.latitude + '%2C' + position.coords.longitude + '&language=en';
$.getJSON(GEOCODING).done(function(location) {
console.log(location)
})
}
function error(err) {
console.log(err)
}
</script>
</body>
</html>并使用jQuery在页面上显示此数据
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript" src="https://code.jquery.com/jquery-2.2.3.js"></script>
</head>
<body>
<p>Country: <span id="country"></span></p>
<p>State: <span id="state"></span></p>
<p>City: <span id="city"></span></p>
<p>Address: <span id="address"></span></p>
<p>Latitude: <span id="latitude"></span></p>
<p>Longitude: <span id="longitude"></span></p>
<script type="text/javascript">
navigator.geolocation.getCurrentPosition(success, error);
function success(position) {
var GEOCODING = 'https://maps.googleapis.com/maps/api/geocode/json?latlng=' + position.coords.latitude + '%2C' + position.coords.longitude + '&language=en';
$.getJSON(GEOCODING).done(function(location) {
$('#country').html(location.results[0].address_components[5].long_name);
$('#state').html(location.results[0].address_components[4].long_name);
$('#city').html(location.results[0].address_components[2].long_name);
$('#address').html(location.results[0].formatted_address);
$('#latitude').html(position.coords.latitude);
$('#longitude').html(position.coords.longitude);
})
}
function error(err) {
console.log(err)
}
</script>
</body>
</html>Stack Overflow用户
发布于 2015-03-01 17:59:46
这是为我更新的工作版本，它将得到城市/城镇，它看起来像是在json响应中修改了一些字段。参考之前对此问题的回答。(感谢Michal和另一个推荐人：Link
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) {
if (results[1]) {
var arrAddress = results;
console.log(results);
$.each(arrAddress, function(i, address_component) {
if (address_component.types[0] == "locality") {
console.log("City: " + address_component.address_components[0].long_name);
itemLocality = address_component.address_components[0].long_name;
}
});
} else {
alert("No results found");
}
} else {
alert("Geocoder failed due to: " + status);
}
});
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/6797569
复制相关文章
相似问题