canvas教程

HTML5的Geolocation地理位置定位API使用教程(2)

字号+ 作者:H5之家 来源:H5之家 2017-05-18 18:00 我要评论( )

上面就是Geolocation的常用的三个API,日常开发中我们可根据实际情况选用合适的方法,进而获取用户的位置信息。 现在大部分浏览器都已支持Geolocation了,可是为了兼容低版本的浏览器,我们需要判断它的支持情况:

上面就是Geolocation的常用的三个API,日常开发中我们可根据实际情况选用合适的方法,进而获取用户的位置信息。
现在大部分浏览器都已支持Geolocation了,可是为了兼容低版本的浏览器,我们需要判断它的支持情况:

JavaScript Code复制内容到剪贴板

最后,我们用一个简单的例子来演示在开发中是如何使用Geolocation的:

JavaScript Code复制内容到剪贴板

在上面的代码中,首先我们定义一个根据当前位置获取推荐数据的方法,然后在文档加载完成后,开始试图获取当前位置,并调研这个方法,获取模拟的数据,真是开发环境中,可能会进一步利用返回的数据做渲染UI等操作。

网络设备
位置服务用于估计您所在位置的本地网络信息包括:有关可见 WiFi 接入点的信息(包括信号强度)、有关您本地路由器的信息、您计算机的 IP 地址。位置服务的准确度和覆盖范围因位置不同而异。
总的来说,在PC的浏览器中 HTML5 的地理位置功能获取的位置精度不够高,如果借助这个 HTML5 特性做一个城市天气预报是绰绰有余,但如果是做一个地图应用,那误差还是太大了。不过,如果是移动设备上的 HTML5 应用,可以通过设置 enableHighAcuracy 参数为 true,调用设备的 GPS 定位来获取高精度的地理位置信息。

可选项
事实上,上述getCurrentPosition函数还支持第三个可选的参数,是一个 Option Object,一共有三个选项可以设定:

JavaScript Code复制内容到剪贴板

 
其中timeout是设定地理位置获取的超时时间(单位为毫秒,用户选择允许的时间不计算在内);而maximumAge表示允许设备从缓存中读取位置,缓存的过期时间,单位是毫秒,设为0来禁用缓存读取。如果返回的是缓存中的时间,会在timestamp中反映出来。
 

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • html5 Canvas画图5:画曲线之arc

    html5 Canvas画图5:画曲线之arc

    2017-05-16 18:02

  • 基于html5 Canvas图表库 : ECharts

    基于html5 Canvas图表库 : ECharts

    2017-05-16 15:00

  • HTML5中的nav标签学习笔记

    HTML5中的nav标签学习笔记

    2017-05-16 10:02

  • HTML5 Canvas和EaselJS入门(译)

    HTML5 Canvas和EaselJS入门(译)

    2017-05-16 08:05

网友点评
/