html5地理位置定位功能小析
Geolocationd 基本原理
1.GPS
GPS基本原理是测量出已知位置的卫星到用户接收机之间的距离,然后综合多颗卫星的数据就可知道接收机的具体位置。适用于具备GPS功能的设备
(1)优点:在空旷地区比较准确,覆盖面比较广
(2)缺点:需要比较长时间定位,比较耗电池,在室内不太好,需要GPS设备支持
2.WIFI
地理定位服务提供者会在全世界范围内去收集WIFI热点位置信息,然后用户的设备只要能支持WIFI就能获取到周围WIFI热点的位位置和信号强弱信息,然后把这些信息发给提供者,就能得到自己的位置。
(1)优点:比较准确,适用于室内环境,相应速度快。
(2)缺点:在WiFi热点少的地方不适用
3.IP定位
通过你设备的物理地址所备案的地址信息来定位,但这种方式精确度不高,特别是用代理来上网的情况下。一般作为GPS和WIFI都不支持的情况下大致模糊匹配,比如各大团购网站监测用户所在城市。
4.手机基站
和WIFI原理类似,Apple的设备就是把WIFI和基站信息结合起来进行定位
代码实现:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<script>
//成功时获取位置信息
function success(position) {
alert(position.coords.latitude);
alert(position.coords.longitude); //错误时获取有关的信息
function error(errorCode) {
alert(errorCode.code + '--' + errorCode.message);
// 错误代码及错误的具体信息
} var options = {};
//options中的一些参数
//options是一个对象,可以设置超时时间,缓存时间等,如下:
//enableHighAccuracy表示是否允许使用高精度,但这个参数在很多设备上设置了没用,设备综合考虑电量,地理情况等,很多时候都是默认由设备自身来调整
//timeout指定超时时间
//maximumAge是指缓存的时间
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(success, error, options)
} else {
alert('你浏览器out啦!')
}
}
// getCurrentPosition(success,error,options)是geolocation的一个方法,此外还有两个方法:
//1.watchPosition(success,error,options)表示重复获取地理位置,相当于将getCurrentPosition这个方法利用setinterval不断执行,其他用法和参数使用一样
//2.clearWatch()用来清除前一次获取的位置信息。
//这两个方法配合使用,能够实现一些很棒的功能,比如导航等!
</script>
</body>
</html>
html5地理位置定位功能小析的更多相关文章
- HTML5 地理位置定位(HTML5 Geolocation)原理及应用
地理位置(Geolocation)是 HTML5 的重要特性之一,提供了确定用户位置的功能,借助这个特性能够开发基于位置信息的应用.今天这篇文章向大家介绍一下 HTML5 地理位置定位的基本原理及各个 ...
- [Javascript] HTML5 地理位置定位(HTML5 Geolocation)原理及应用
地理位置(Geolocation)是 HTML5 的重要特性之一,提供了确定用户位置的功能,借助这个特性能够开发基于位置信息的应用.今天这篇文章向大家介绍一下 HTML5 地理位置定位的基本原理及各个 ...
- HTML5 地理位置定位API(1)
地理位置(Geolocation)是 HTML5 的重要特性之一,提供了确定用户位置的功能,借助这个特性能够开发基于位置信息的应用.今天这篇文章向大家介绍一下 HTML5 地理位置定位的基本原理及各个 ...
- HTML5 地理位置定位API(3)
HTML5 地理位置定位实例 这篇文章主要为大家介绍了HTML5地理定位的方法,实例讲述了html5获取坐标完整实现过程, 并对比不同浏览器运行效果给出参考结果,需要的朋友可以参考下 本文实例讲述了h ...
- 使用HTML5地理位置定位到城市的方法及注意事项
介绍 本文将简述一下如何通过HTML5和百度地图开放平台提供的API来实现对浏览器的定位.实现效果为显示出用户所在的省市,即: XXX省 XXX市. 实现思路 利用HTML5 提供的API获取到用户的 ...
- HTML5 地理位置定位API(5)
HTML5 Geolocation API (地理位置应用程序接口) 目前PC浏览器支持情况: Firefox 3.5+Chrome 5.0+Safari 5.0+Opera 10.60+Intern ...
- HTML5 地理位置定位API(2)
HTML5 Geolocation API (地理位置应用程序接口) 目前PC浏览器支持情况: Firefox 3.5+Chrome 5.0+Safari 5.0+Opera 10.60+Intern ...
- HTML5 地理位置定位API(4)
地理定位(geolocation)是最令人兴奋,而且得到了广泛支持的一个新API.通过这套API, JavaScript代码能够访问到用户的 当前位置信息.当然,访问之前必须得到用户的明确许可,即同意 ...
- AngularJS进阶(二十)HTML5实现获取地理位置信息并定位功能
HTML5实现获取地理位置信息并定位功能 注:请点击此处进行充电! 前言 这篇文章主要介绍了HTML5实现获取地理位置信息并定位功能,本文讲解了原生HTML5.百度地图.谷歌地图等三种获取理位置信息并 ...
随机推荐
- [转]python 常用类库!
Python学习 On this page... (hide) 1. 基本安装 2. Python文档 2.1 推荐资源站点 2.2 其他参考资料 2.3 代码示例 3. 常用工具 3.1 Pytho ...
- 点击空白处 div隐藏掉了
$(document).on('click',function (e) { var target = $(e.target); if(target.closest(".login-box&q ...
- [MySQL] MySQL存储过程常用的函数
一.字符串类 CHARSET(str) //返回字串字符集 CONCAT (string2 [,... ]) //连接字串 INSTR (string ,substring ) //返回substr ...
- VC++/MFC 最常用宏和指令
1.#include指令 包含指定的文件,最基本的最熟悉的指令,编程中不得不用,包含库文件用双尖括号,包含自定义头文件用双引号. 2.#define指令 预定义,通常用它来定义常量(包括无参量与 ...
- 有人要分享pjax吗?
安装 1.在 composer.json 的 require里 加入 "yuanchao/pjax-for-laravel-5": "dev-master" 2 ...
- css 上下滚动效果
<html> <head> <style> .scroll{ overflow:hidden; width:100%; } .scrollout{ height:2 ...
- js变量及其作用域(附例子及讲解)
Javascript和Java.C这些语言不同,它是一种无类型.弱检测的语言.它对变量的定义并不需要声明变量类型,我们只要通过赋值的形式,可以将各种类型的数据赋值给同一个变量 工具/原料 Ch ...
- 用.net 发送邮件
using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.N ...
- tp框架之分页与第三方类的应用
1.先把分页类放在根目录下,比如放在某个模块下 2.在类里面写入命名空间,注意类名的格式(类名要与里面的方法名一致) 3.在需要的方法里面按照路径进行实例化,然后就可以使用了 方法: public f ...
- VS 2013编译64位版本QT 4.8.6及使用cmake为依赖QT生成VS项目时Could NOT find Qt4
对于一些已经解决的问题,本博客不再讨论.只将本人遇到的问题做简单的说明. 一.VS 2013编译64位版本QT 4.8.6 QT项目官网中,对于QT4,其只提供了windows X86的版本,并且支持 ...