081_html5地理定位

1. html5 Geolocation(地理定位)用于定位用户的位置。

2. 定位用户的位置

2.1. html5 Geolocation API用于获得用户的地理位置。

2.2. 鉴于该特性可能侵犯用户的隐私, 除非用户同意, 否则用户位置信息是不可用的。

3. 浏览器支持

3.1. Internet Explorer 9+、Firefox、Chrome、Safari支持地理定位。

3.2. 对于拥有GPS的设备, 比如: iPhone, 地理定位更加精确。

4. html5使用地理定位

4.1. 请使用getCurrentPosition()方法来获得用户的位置。

4.2. 下例是一个简单的地理定位实例, 可返回用户位置的经度和纬度。

<!DOCTYPE html>
<html><head><meta charset="utf-8" /><title>获取位置坐标</title></head><body><p id="demo">点击这个按钮, 获得您的坐标:</p><button onclick="getLocation()">试一下</button><script type="text/javascript">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></body>
</html>

4.3. 例子解释:

4.3.1. 检测是否支持地理定位。

4.3.2. 如果支持, 则运行getCurrentPosition()方法。如果不支持, 则向用户显示一段消息。

4.3.3. 如果getCurrentPosition()运行成功, 则向参数showPosition中规定的函数返回一个coordinates对象。

4.3.4. showPosition()函数获得并显示经度和纬度。

5. 处理错误和拒绝

5.1. getCurrentPosition()方法的第二个参数用于处理错误。它规定当获取用户位置失败时运行的函数:

<!DOCTYPE html>
<html><head><meta charset="utf-8" /><title>获取位置坐标或错误</title></head><body><p id="demo">点击这个按钮, 获得您的坐标:</p><button onclick="getLocation()">试一下</button><script type="text/javascript">var x=document.getElementById("demo");function getLocation() {if(navigator.geolocation) {navigator.geolocation.getCurrentPosition(showPosition,showError);} else {x.innerHTML="Geolocation is not supported by this browser.";}}function showPosition(position) {x.innerHTML="Latitude: " + position.coords.latitude + "<br />Longitude: " + position.coords.longitude; }function showError(error) {switch(error.code) {case error.PERMISSION_DENIED:x.innerHTML="User denied the request for Geolocation."break;case error.POSITION_UNAVAILABLE:x.innerHTML="Location information is unavailable."break;case error.TIMEOUT:x.innerHTML="The request to get user location timed out."break;case error.UNKNOWN_ERROR:x.innerHTML="An unknown error occurred."break;}}</script></body>
</html>

5.2. 错误代码:

5.2.1. Permission denied: 用户不允许地理定位。

5.2.2. Position unavailable: 无法获取当前位置。

5.2.3. Timeout: 操作超时。

6. getCurrentPosition()方法: 返回数据

6.1. 若成功, 则getCurrentPosition()方法返回对象。始终会返回latitude、longitude以及accuracy属性。如果可用, 则会返回其他下面的属性。

7. Geolocation对象, 其他方法

7.1. watchPosition(): 返回用户的当前位置, 并继续返回用户移动时的更新位置(就像汽车上的GPS)。

7.2. clearWatch(): 停止watchPosition()方法。

7.3. 下面的例子展示watchPosition()方法。您需要一台精确的GPS设备来测试该例(比如: iPhone):

<!DOCTYPE html>
<html><head><meta charset="utf-8" /><title>获取位置坐标</title></head><body><p id="demo">点击这个按钮, 获得您的坐标:</p><button onclick="getLocation()">试一下</button><script type="text/javascript">var x=document.getElementById("demo");function getLocation() {if(navigator.geolocation) {navigator.geolocation.watchPosition(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></body>
</html>

081_html5地理定位相关推荐

html浏览位置坐标,HTML5教程 | HTML5地理定位（GeoLocation API）
HTML5 GeoLocation API(地理定位API)可以获取用户所在的地理位置.由于安全的原因,在使用HTML5 GeoLocation的时候,会弹出对话框让用户决定是否共享他们所在的位置,只 ...
HTML5地理定位用法
定位用户的位置 HTML5 Geolocation API 用于获得用户的地理位置. 鉴于该特性可能侵犯用户的隐私,除非用户同意,否则用户位置信息是不可用的. 浏览器支持 Internet Explo ...
html自动获取用户位置,HTML5 - 使用Geolocation（地理定位）获取用户的位置
一.Geolocation(地理定位) 1,基本介绍 (1)虽然 Geolocation 经常以 HTML5 的名义提到,但地理定位实际上是一个单独的标准,而且也不是经由 WHATWG 制定的. (2 ...
微信小程序：获取地理定位和显示相应的城市名称。
最近在看微信小程序,遇到地理定位显示城市名称的问题.本文就是记录这一过程. 解决方案 ...
Xamarin Essentials教程地理定位Geolocation
Xamarin Essentials教程地理定位Geolocation 通过地理定位功能,应用程序可以获取用户的当前地理位置,如经纬度值.利用地理位置,可以在地图上定位,也可以转化物理位置,划分用户的 ...
如何用html5定位,如何利用html5进行地理定位
满意答案 ggk666 2017.10.13 采纳率:57% 等级:9 已帮助:413人 HTML5 Geolocation(地理定位)用于定位用户的位置点击这个按钮,获得您的位置: 试一下 ...
chrome浏览器模拟手机地理定位
chrome浏览器模拟手机地理定位在pc端做touch页面调试的时候,常常会遇到需要模拟定位的情况 chrome浏览器有着强大的调试工具,尤其是新版chrome浏览器下面我就以新版chrome浏 ...
用Spark和DBSCAN对地理定位数据进行聚类
机器学习,特别是聚类算法,可以用来确定哪些地理区域经常被一个用户访问和签到而哪些区域不是.这样的地理分析使多种服务成为可能,比如基于地理位置的推荐系统,先进的安全系统,或更通常来说,提供更个性化的用户 ...
h5精准定位_HTML5 地理定位
原标题:HTML5 地理定位定位用户的位置 HTML5 Geolocation API 用于获得用户的地理位置. 鉴于该特性可能侵犯用户的隐私,除非用户同意,否则用户位置信息是不可用的. 浏览器支持 ...

081_html5地理定位

081_html5地理定位相关推荐

最新文章

热门文章