JavaScript地理位置信息API

 更新时间:2016年06月11日 12:40:34   投稿:lijiao  
这篇文章主要介绍了JavaScript地理位置信息API的相关资料,需要的朋友可以参考下

对于一个Web开发程序员来说,开发工作中一个最有意思的方面就是获取地理位置信息;试想一下,浏览你的网页的用户是在什么地方?程序员可以根据用户的地理位置信息来调整网站的语言、特定产品介绍等。下面我们将要演示的就是通过浏览器里JavaScript地理位置信息API来获取详细地理信息!

检查你的浏览器是否支持地理位置信息API

目前主流的浏览器都已经对JavaScript地理位置信息API有了较好的支持。但如果你还不放心,那么,确认地理位置信息API支持情况最好的方式是浏览器的功能特征测试。

if("geolocation" in navigator) {
 //w00t!
}
else {
 alert("很不幸!你的浏览器并不支持Geolocation API功能");
}

对于判断浏览器是否支持地理位置API,最主要的就是看看navigator.geolocation这个对象,使用in,而不是简单的使用if(navigator.geolocation),这一点非常重要,因为后者有可能会因此初始化地理位置信息对象,从而占用/锁定了设备资源。

查询地理位置信息

这个navigator.geolocation.getCurrentPosition方法是获取详细位置信息最关键的一个接口:

if("geolocation" in navigator) {
 navigator.geolocation.getCurrentPosition(function(position) {
 console.log(position);
 });
}

一旦你调用了这个方法(如果请求成功,它会执行你在参数里提供的回调方法),浏览器会询问用户是否允许程序获取他们的地理位置信息。

当用户运行网页获取他们的位置信息后,浏览器就可以开始读取地理信息,它会返回给你一个位置信息对象,对象的结构基本是这样的:

// "Position" object
{
 coords: { "Coordinates" object
 accuracy: 65,
 altitude: 294.4074401855469,
 altitudeAccuracy: 10,
 heading: -1,
 latitude: 43.01256284360166,
 longitude: -89.44531987692744,
 speed: -1
 },

 timestamp: 1429722992094269
}

如果你觉得这些地理位置信息(地理经纬度坐标)还不够充足,还想要这些地理坐标属于哪个国家、城市,则你需要再调用其它的第三方数据库——这里我们就不细述了。
这个地理位置信息API在很多移动应用里是最常见的API运用,作为Web程序员,它应该是你必须具备的一项知识技巧。幸运的是,目前所有流行的浏览器都支持了这种技术。

以上就是本文的全部内容,希望对大家学习javascript程序设计有所帮助。

相关文章

  • Bootstrap Table 双击、单击行获取该行及全表内容

    Bootstrap Table 双击、单击行获取该行及全表内容

    这篇文章主要介绍了Bootstrap Table 双击、单击行获取该行内容及获取全表的内容,本文通过实例代码给大家介绍的非常详细,具有一定的参考借鉴价值,需要的朋友可以参考下
    2018-08-08
  • JavaScrip常见的一些算法总结

    JavaScrip常见的一些算法总结

    这篇文章主要介绍了JavaScrip常见的一些算法总结的相关资料,需要的朋友可以参考下
    2015-12-12
  • javascript学习基础笔记之DOM对象操作

    javascript学习基础笔记之DOM对象操作

    javascript是一种基于对象和世界驱动,并且安全性较强的脚本语言。一个完整的javascript实现包括核心(ECMAScript),文档对象模型(DOM)和浏览器对象模型(BOM)
    2011-11-11
  • JavaScript实现星级评分

    JavaScript实现星级评分

    本文主要分享了JavaScript实现星级评分的实例代码,具有一定的参考价值,下面跟着小编一起来看下吧
    2017-01-01
  • 微信小程序实现多选框功能的实例代码

    微信小程序实现多选框功能的实例代码

    这篇文章主要介绍了微信小程序实现多选框功能及效果,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2020-06-06
  • iframe父页面获取子页面参数的方法

    iframe父页面获取子页面参数的方法

    这篇文章主要介绍了iframe父页面获取子页面参数的方法,需要的朋友可以参考下
    2014-02-02
  • javascript tabIndex属性

    javascript tabIndex属性

    围绕表单的可访问性与交互性上,各浏览器都下了很大工夫,比如fieldset与legend等用于增强区域感的元素,for,accessKey,defaultValue,maxlength,tabIndex等用于交互或提示的属性。不过,今天只讲tabIndex。
    2009-12-12
  • JS动态日期时间的获取方法

    JS动态日期时间的获取方法

    这篇文章主要介绍了js获得当前系统日期时间的方法,涉及javascript操作日期时间的相关技巧,非常简单实用,需要的朋友可以参考下
    2015-09-09
  • 原生JS实现分享侧边栏

    原生JS实现分享侧边栏

    这篇文章主要为大家详细介绍了原生JS实现分享侧边栏,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2021-10-10
  • JS之获取样式的简单实现方法(推荐)

    JS之获取样式的简单实现方法(推荐)

    下面小编就为大家带来一篇JS之获取样式的简单实现方法(推荐)。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-09-09

最新评论