zoukankan      html  css  js  c++  java
  • HTML5 Geolocation(地理定位)

    一、背景

    • 在HTML规范中,增加了获取用户地理信息的API,这样使得可以基于用户位置开发互联网应用,即基于位置服务
    • 鉴于该特性可能侵犯用户的隐私,除非用户同意,否则用户位置信息是不可用的。
    • Internet Explorer 9+, Firefox, Chrome, Safari 和 Opera 支持Geolocation(地理定位).
    • Geolocation(地理定位)对于拥有 GPS 的设备,地理定位更加精确。

    二、获取当前地信息

    navigator.geolocation.getCurrentPosition(successCallback,errorCallback)

    三、重复获取当前地理信息

    navigator.geolocation.watchPosition(successCallback,errorCallback)

    四、使用

    ①当获取地理信息成功后,会调用successCallback,并返回一个包含位置信息的对象position。

    • position.coords.latitude 纬度
    • position.coords.longitude 经度
    • position.coords.accuracy  精度
    • position.coords.altitude   海拔高度

    ②当获取地理信息失败后,会调用errorCallback,返回错误信息error

    <script>
            if(navigator.geolocation){
                navigator.geolocation.getCurrentPosition(function(position){
                    // 获取地理位置成功
                    console.log(position.coords.latitude);//纬度
                    console.log(position.coords.longitude);//经度
                    console.log(position.coords.accuracy);//精度
                    console.log(position.coords.altitude);//海拔高度
                },function(positionError){
                    // 取地理位置失败
                    console.log(positionError);//错误信息
                    // 因为是从谷歌返回的数据,国家政策的原因,无法获取(需要翻墙)
                    // Network location provider at 'https://www.googleapis.com/' : No response received
                })
            }
        </script>

    ③在实际开发中,通过调用第三方API(如百度地图)来实现地理位置定位信息,这些API都是基于用户当前位置(经纬度)当做参数传递,就可以实现相应的功能

    比如:百度地图开放平台

  • 相关阅读:
    node cluster(集群) 模块可以创建共享服务器端口的子进程
    通过 Channel Messaging API的「MessageChannel」,实现iframe与主页面的双通讯
    5.nginx的keepalive和pipe
    4.nginx的server_name正则匹配
    3.nginx的特殊server_name及匹配
    2.nginx的server_name匹配顺序
    1.初识nginx
    flutter pub.get 没有反应
    linux cp拷贝文件时,不确认强制覆盖
    Cocos学习笔记
  • 原文地址:https://www.cnblogs.com/EricZLin/p/9267543.html
Copyright © 2011-2022 走看看