H5地理定位navigator.geolocation的使用(获取经纬度、海拔高度等设备信息)

简介: H5地理定位navigator.geolocation的使用(获取经纬度、海拔高度等设备信息)

navigator.geolocation定位说明

  1. 1.getCurrentPosition,需要https加密SSL证书支持,http服务协议逐步启用;
  2. 2.使用PC端浏览器,部分返回的值是无法正常显示,为NULL;


H5定位代码

navigator.geolocation.getCurrentPosition(function (position) {
       console.log(position);
    }, function (err) {
        console.log(err.code);
    }, {
        enableHighAcuracy: true, //位置是否精确获取
        timeout: 5000,//获取位置允许的最长时间
        maximumAge: 0 //多久更新获取一次位置
    })


代码分析

getCurrentPosition()返回说明

1.coords.latitude:估计纬度

2.coords.longitude:估计经度

3coords.altitude:估计高度

4.coords.accuracy:所提供的以米为单位的经度和纬度估计的精确度

5.coords.altitudeAccuracy:所提供的以米为单位的高度估计的精确度

6.coords.heading: 宿主设备当前移动的角度方向,相对于正北方向顺时针计算

7.coords.speed:以米每秒为单位的设备的当前对地速度


errorCallback 定位失败时执行的回调函数

    //code:返回获取位置的状态
    //0:不包括其他错误编号中的错误
    //1:用户拒绝浏览器获取位置信息
    //2:尝试获取用户信息,但失败了
    //3:设置了timeout值,获取位置超时了


positionOptions配置项

enableHighAccuracy 【true or false(默认)】是否返回更详细更准确的结构,默认为false不启用,选择true则启用,但是会导致较长的响应时间及增加功耗,这种情况更多的用在移动设备上。


timeout 设备位置获取操作的超时时间设定(不包括获取用户权限时间),单位为毫秒,如果在设定的timeout时间内未能获取位置定位,则会执行errorCallback()返回code(3)。如果未设定timeout,那么timeout默认为无穷大,如果timeout为负数,则默认timeout为0。


maximumAge 设定位置缓存时间,以毫秒为单位,如果不设置该值,该值默认为0,如果设定负数,则默认为0。该值为0时,位置定位时会重新获取一个新的位置对象;该值大于0时,即从上一次获取位置时开始,缓存位置对象,如果再次获取位置时间不超过maximumAge,则返回缓存中的位置,如果超出maximumAge,则重新获取一个新的位置。


@lockdata.cn


相关文章
|
2月前
|
移动开发 监控 定位技术
HTML5 Geolocation(地理定位)6
`getCurrentPosition()` 方法用于获取设备当前地理位置,成功时返回包含多个属性的对象,如纬度、经度、精度等。`watchPosition()` 持续监控位置变化,适合移动应用;`clearWatch()` 则停止位置监控。示例代码展示了如何使用 `watchPosition()` 获取并显示当前位置信息。
|
2月前
|
传感器 移动开发 定位技术
HTML5 Geolocation(地理定位)2
`getCurrentPosition()`方法的第二个参数用于处理获取用户位置时可能出现的错误。示例中的`showError`函数通过`error.code`区分不同类型的错误,并显示相应的提示信息。错误类型包括:用户拒绝、位置不可用、请求超时和未知错误。此外,还展示了如何使用返回的经纬度在谷歌地图中显示位置的示例。
|
2月前
|
移动开发 定位技术 iOS开发
HTML5 Geolocation(地理定位)3
本页介绍如何在地图上显示用户位置,并利用地理定位提供给定位置的相关信息,如更新本地信息、显示周边兴趣点等。通过 `getCurrentPosition()` 方法可获取用户当前位置的详细数据,包括经纬度、精度等。此外,`watchPosition()` 和 `clearWatch()` 方法分别用于持续跟踪用户位置变化和停止位置跟踪。示例代码展示了如何使用这些方法实现位置跟踪功能。
|
2月前
|
移动开发 定位技术 HTML5
HTML5 Geolocation(地理定位)5
本示例展示了如何利用获取的经纬度数据,在谷歌地图中以静态图片形式显示用户位置。此方法可扩展用于更新本地信息、展示周边兴趣点及实现车载导航系统等应用。
|
2月前
|
移动开发 定位技术 HTML5
HTML5 Geolocation(地理定位)4
`getCurrentPosition()` 方法的第二个参数用于处理获取用户位置时可能出现的错误。通过定义 `showError` 函数,可以根据不同的错误代码(如权限被拒、位置不可用、超时等)显示相应的错误信息。
|
2月前
|
Web App开发 移动开发 定位技术
HTML5 Geolocation(地理定位)1
HTML5 Geolocation API 用于获取用户的地理位置,需用户同意才可使用。支持的浏览器包括IE9+、Firefox、Chrome、Safari 和 Opera。此API在GPS设备上定位更精准。示例代码展示了如何使用getCurrentPosition()方法获取并显示用户的位置信息。
|
4月前
|
存储 移动开发 定位技术
HTML5 Geolocation(地理定位)优化到最高精度
HTML5 Geolocation API 可让网页访问用户的地理位置信息。为优化地理定位精度,需考虑设备、浏览器设置、网络状况及编码实现。使用 `enableHighAccuracy` 选项请求高精度,并确保设备开启 GPS,网络良好。结合多种数据源(如 GPS、Wi-Fi)可提高准确性。利用 `watchPosition` 定期更新位置,并妥善处理定位错误。务必遵循用户隐私原则,获取同意并遵守相关法规。这样可有效提升地理定位的精度与用户体验。
|
8月前
|
传感器 移动开发 定位技术
Geolocation
地理位置(Geolocation)是指确定一个设备在地球上的具体位置,通常通过设备上的 GPS 传感器或其他定位技术来实现。地理位置信息可以用于许多应用程序中,例如地图和导航应用程序、社交媒体应用程序、天气预报应用程序等。
88 10
|
缓存 移动开发 JavaScript
网页|通过geolocation获取地理位置信息
网页|通过geolocation获取地理位置信息
332 0
|
定位技术 API 开发工具
iOS开发-百度地图基本定位和罗盘跟随的使用,附加地理编码和反地理编码
iOS开发-百度地图基本定位和罗盘跟随的使用,附加地理编码和反地理编码
191 0
iOS开发-百度地图基本定位和罗盘跟随的使用,附加地理编码和反地理编码

热门文章

最新文章

下一篇
开通oss服务