从网页浏览器获取 GPS 定位

我正在开发一个基于手机的网站，在那里我已经整合了谷歌地图，我需要填补’从’领域的谷歌地图动态。

有没有可能从网页浏览器中获取 GPS 位置，然后在 Google 地图的“发件人”栏中动态填写？

337844 次浏览
小开

有 地理定位 API，但目前浏览器的支持相当薄弱。大多数关心此类问题的网站使用 GeoIP 数据库(通常附带关于此类系统不准确性的条件)。您还可以查看需要用户合作的第三方服务，如 火鹰。

小开

如果您使用 地理定位 API，那么它将与使用以下代码一样简单。

navigator.geolocation.getCurrentPosition(function(location) {
console.log(location.coords.latitude);
console.log(location.coords.longitude);
console.log(location.coords.accuracy);
});

您也可以使用 Google 的客户端定位 API。

这个问题已经在 是否有可能检测到一个移动浏览器的 GPS 位置？和 从移动浏览器获取位置数据中讨论过了。您可以在那里找到更多的信息。

小开

给出一个更具体的答案。HTML5允许你获得地理坐标，而且它做得相当不错。总的来说，浏览器对地理定位的支持非常好，除了 ie7和 ie8(以及 Opera mini)之外，所有主流浏览器都支持地理定位。IE9做了这项工作，但表现最差。退房 caniuse.com:

Http://caniuse.com/#search=geol

此外，你需要你的用户批准访问他们的位置，所以一定要检查这一点，并给予一些体面的指示，以防它被关闭。特别是对于 Iphone 打开 Safari 的权限有点麻烦。

小开

使用这个，您将在 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>
小开

让我们使用最新的 脂肪箭头功能:

navigator.geolocation.getCurrentPosition((loc) => {
console.log('The location in lat lon format is: [', loc.coords.latitude, ',', loc.coords.longitude, ']');
})
小开

显而易见

/*
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();
}

提交答案