HTML5 地理定位详解（转载）

http://www.php10086.com/2012/08/934.html

 

为什么要采用html5地理定位？

原因其实很简单，—————-0ee72b30—————-ip定位不准！

一直以后总想找一个靠谱的ip库，但是事实上所有的ip库基本上到市一级就不行了，再往下面区县级的就基本不靠谱了，虽然有少量的ip库是可以到区县级的，但是这个数据量也是非常少的，所以html5定位实际上就是作为ip定位的替补出现的！

html5的Geolocation API定位原理

Geolocation API 是基于新增加的全局对象 navigator：navigator.geolocation。JavaScript 对象 navigator 包含了很有用的有关访问者的浏览器和系统的信息。Geolocation 可以使用 IP 地址、基于 Web 的数据库、无线网络连接和三角测量或 GPS 技术来确定经度和纬度。一定要注意 Geolocation 所提供信息的精确性会由于获取信息的方式不同而有所差别。有时候，您可能无法精确地读取某些位置的地理信息，甚至完全无法读取。

注意：html5的定位原理是什么？网上很少有文章解说html5工作原理，有些直接认为是商业版ip库，或者任务是wifi定位，这些说法都不是很准确，准确的说html5技术是综合了IP 地址、基于 Web 的数据库、无线网络连接和三角测量或 GPS 技术来确定经度和纬度。

html5定位的精确度

有很多方法可以定位用户的地理位置，并且每种方法都有不同的精度。桌面浏览器一般会使用WiFi（精确到20m）或者IP定位（只能精确到城市级别，并且有可能是假地址）。移动装置一般会使用GPS（精确到10m并且只能在外部使用），WiFi或GSM/CDMA网络信号定位（精确到1000m）

一个有趣的测试

同一位置同一电脑的在不同 的时间点测试的精确度是不一样的。

测试地址：HTML5定位demo

晚上7点—30M精确度

晚上9点—63M精确度

早上7点—20M精确度

个人猜测这个定位和上网早高峰很有关，9点钟是上网高峰，信号降低，早上7点信号最强到达20M精确度

不知道有没有比这更高的精确度了，希望有童鞋测试留言 告诉我！

浏览器兼容性

目前如下浏览器支持Geolocation API：

• Firefox 3.5+
• Chrome 5.0+
• Safari 5.0+
• Opera 10.60+
• Internet Explorer 9.0+
• Android 2.0+
• iPhone 3.0+
• Opera Mobile 10.1+
• Symbian (S60 3rd & 5th generation)
• Blackberry OS 6
• Maemo
• 需要注意的是：使用html5定位需要用户授权才可以使用！
  • 如何使用html5定位
  • 判断浏览器是否支持html5定位

if (navigator.geolocation) {
// do }

返回false则不支持此api。

navigator.geolocation对象使用

navigator.geolocation 对象具有 3 个方法：

• getCurrentPosition()
• watchPosition()
• clearWatch()

getCurrentPosition 或 watchPosition

getCurrentPosition() 方法的调用方式如下所示：

1 void navigator.geolocation.getCurrentPosition(
2           geolocationSuccess, geolocationError, geolocationOptions);

watchPosition和getCurrentPosition() 调用方法一样！

这两个方法都是立即返回的，使用的是异步回调的方式来使用api。它们有相同的参数：

1. geolocationSuccess– 成功后的回调函数
2. [geolocationError] – 失败后的回调函数
3. [geolocationOptions] – 相关配置参数：
   • enableHighAccuracy – 确保应用会给出最佳结果。这有可能会让浏览器的反应时间变慢。如果是移动装置，还有可能因为使用GPS而消耗更多电量。接受参数类型为boolean，默认为false。
   • timeout – 接受一个数字作为参数，默认为0微秒。设置浏览器的超时时间。
   • maximumAge – 表示程序能接受的被缓存位置的最大过期时间。接受一个数字作为参数，默认为0微秒。这就意味这默认每次获取位置都必需重新获取一个新位置。

两者之间的区别

getCurrentPosition() 方法能够获取用户的当前位置，但是只能获取一次。

watchPosition() 方法会定期查询用户的位置，观察用户位置是否发生了变化

clearWatch

这个方法接受一个参数，需要清理的观察进程的id：watchID（这个参数由watchPosition方法返回）。

getCurrentPosition 和 watchPosition方法的主要区别是watchPosition方法会持续告诉你位置的改变，所以基本上它一直在更新用户的位置。当你在移动的时候，这个功能会非常有利于追踪用户的位置。这个函数还会返回一个watchID值被clearWatch使用来停止监控。

clearWatch() 方法的调用方式如下所示：

void navigator.geolocation.clearWatch(watchID)

地理位置对象 Position

Geolocation API 会返回一个地理位置对象 Position。这个对象具有两个属性：timestamp 和 coords。timestamp 属性表示地理数据创建的时间。而 coords 属性包含了 7 个属性：

• coords.latitude。 估算的纬度
• coords.longitude。 估算的经度
• coords.altitude。 估算的高度 (以米为单位的海拔值)
• coords.accuracy。 所得经度和纬度的估算精度，以米为单位
• coords.altitudeAccuracy。 所得高度的估算精度，以米为单位
• coords.heading. 宿主设备的当前移动方向，以度为单位，相对于正北方向顺时针方向计算
• coords.speed. 设备的当前对地速度，以米/秒为单位

这里只有 3 个属性是必需的：coords.latitude、coords.longitude 和 coords.accuracy。其他属性返回 null，取决于设备及其交互的后端定位服务器的功能。heading 和 speed 属性是基于用户的前一个位置计算的（如果有）。

 

HTML5 demo演示

该接口功能：包括html5定位，谷歌chrome定位，百度地图浏览器定位，ip地址查询，ip定位

返回：地址信息，经纬度，精确度