Javascript 从网络浏览器获取 GPS 位置
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/2577305/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Get GPS location from the web browser
提问by Ganesh
I am developing a mobile based web-site, there I have integrated Google Maps, I need to fill the 'From' field of Google Maps dynamically.
我正在开发一个基于移动的网站,在那里我已经集成了谷歌地图,我需要动态填充谷歌地图的“发件人”字段。
Is it possible to get the GPS location from web browser and fill it up in the 'From' field of a Google Map dynamically?
是否可以从网络浏览器获取 GPS 位置并将其动态填充到 Google 地图的“发件人”字段中?
回答by dochoffiday
If you use the Geolocation API, it would be as simple as using the following code.
如果您使用Geolocation API,就像使用以下代码一样简单。
navigator.geolocation.getCurrentPosition(function(location) {
console.log(location.coords.latitude);
console.log(location.coords.longitude);
console.log(location.coords.accuracy);
});
You may also be able to use Google's Client Location API.
您也可以使用Google 的 Client Location API。
This issue has been discussed in Is it possible to detect a mobile browser's GPS location?and Get position data from mobile browser. You can find more information there.
此问题已在是否可以检测移动浏览器的 GPS 位置?并从移动浏览器获取位置数据。您可以在那里找到更多信息。
回答by Tosh
To give a bit more specific answer. HTML5 allows you to get the geo coordinates, and it does a pretty decent job. Overall the browser support for geolocation is pretty good, all major browsers except ie7 and ie8 (and opera mini). IE9 does the job but is the worst performer. Checkout caniuse.com:
给出更具体的答案。HTML5 允许您获取地理坐标,并且它做得相当不错。总体而言,浏览器对地理定位的支持非常好,除 ie7 和 ie8(和 Opera mini)之外的所有主要浏览器。IE9 可以完成这项工作,但性能最差。结帐 caniuse.com:
http://caniuse.com/#search=geol
http://caniuse.com/#search=geol
Also you need the approval of your user to access their location, so make sure you check for this and give some decent instructions in case it's turned off. Especially for Iphone turning permissions on for Safari is a bit cumbersome.
此外,您还需要获得用户的批准才能访问他们的位置,因此请确保检查这一点并给出一些适当的说明,以防它被关闭。尤其是Iphone Safari 开启权限有点麻烦。
回答by Ema.H
Use this, and you will find all informations at http://www.w3schools.com/html/html5_geolocation.asp
使用它,您将在http://www.w3schools.com/html/html5_geolocation.asp找到所有信息
<script>
var x = document.getElementById("demo");
function getLocation() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition);
} else {
x.innerHTML = "Geolocation is not supported by this browser.";
}
}
function showPosition(position) {
x.innerHTML = "Latitude: " + position.coords.latitude +
"<br>Longitude: " + position.coords.longitude;
}
</script>
回答by Quentin
There is the GeoLocation API, but browser support is rather thin on the ground at present. Most sites that care about such things use a GeoIP database (with the usual provisos about the inaccuracy of such a system). You could also look at third party services requiring user cooperation such as FireEagle.
有GeoLocation API,但目前对浏览器的支持相当薄弱。大多数关心此类事情的站点都使用 GeoIP 数据库(通常有关于此类系统不准确性的附带条件)。您还可以查看需要用户合作的第三方服务,例如FireEagle。
回答by robert king
Observable
可观察的
/*
function geo_success(position) {
do_something(position.coords.latitude, position.coords.longitude);
}
function geo_error() {
alert("Sorry, no position available.");
}
var geo_options = {
enableHighAccuracy: true,
maximumAge : 30000,
timeout : 27000
};
var wpid = navigator.geolocation.watchPosition(geo_success, geo_error, geo_options);
*/
getLocation(): Observable<Position> {
return Observable.create((observer) => {
const watchID = navigator.geolocation.watchPosition((position: Position) => {
observer.next(position);
});
return () => {
navigator.geolocation.clearWatch(watchID);
};
});
}
ngOnDestroy() {
this.sub.unsubscribe();
}
回答by xameeramir
Let's use the latest fat arrow functions:
让我们使用最新的胖箭头函数:
navigator.geolocation.getCurrentPosition((loc) => {
console.log('The location in lat lon format is: [', loc.coords.latitude, ',', loc.coords.longitude, ']');
})

