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

    参考:

    HTML5 地理定位

    Web API 地理定位

    应用场景

    • 更新本地信息
    • 显示用户周围的兴趣点
    • 交互式车载导航系统 (GPS)

    Geolocation 对象

    创建

    • 内置创建

      var geolocation = navigater.geolocation

    • 引用百度地图创建

      引用:

      <!--引入百度 API,"ak=" 后面一串码是密钥,最好自己申请-->
          <script type="text/javascript" src="https://api.map.baidu.com/api?v=2.0&ak=7a6QKaIilZftIMmKGAFLG7QT1GLfIncg"></script>
      

      创建:

      var geolocation = new BMap.Geolocation()

    方法 描述
    getCurrentPosition(successCallback[, errorCallback, options]) 返回用户当前位置。
    watchPosition(successCallback[, errorCallback, options]) 返回用户的当前位置,并继续返回用户移动时的更新位置
    clearWatch() 停止 watchPosition() 方法

    Geolocation 对象方法的回调函数

    1. options

      一个可选的PositionOptions 对象。

      属性 类型 描述
      enableHighAccuracy boolean 是否使用其最高精度来表示结果。这会导致较慢的响应时间或者增加电量消耗
      timeout long 设置设备必须在多长时间(单位毫秒)内返回一个位置
      maxmumAge long 设置可以返回多长时间(即最长年龄,单位毫秒)内的可获取的缓存位置。设置为 0, 说明设备不能使用一个缓存位置。
    2. successCallback(position)

      成功得到位置信息时的回调函数,使用Position 对象作为唯一的参数。

      属性 描述
      coords.latitude 十进制的纬度
      coords.longitude 十进制的经度
      coords.accuracy 位置精度
      coords.altitude 海拔,海平面以上以米计
      coords.altitudeAccuracy 位置的海拔精度
      coords.heading 方向,以正北开始以度计
      coords.speed 速度,以米/秒计
      timestamp 响应的日期/时间
    3. errorCallback(error)

      获取位置信息失败时的回调函数,使用 PositionError 对象作为唯一的参数,这是一个可选项。

      属性 描述
      PERMISSION_DENIED 1 用户拒绝使用地理位置
      POSITION_UNAVAILABLE 2 无法获取当前位置
      TIMEOUT 3 超时
      UNKNOWN_ERROR 未知错误
      code 错误码,对应值等于 上面四个静态属性对应的值
      message 提示信息

    示例

    // 获取地理位置
    if(navigater.geolocation){
       	// 获取Geolocation 对象
        let geolocation = navigater.geolocation
        // 获取当前地理位置
        geolocation.getCurrentPosition(
            // 获取用户地理位子成功回调
            (position) => {
                console.log('地理位置:', position)
                console.log('地理位置 纬度:', position.latitude)
            },
            // 获取用户地理位子失败回调:可选
            (error) => {
                switch(error.code){
                    case error.PERMISSION_DENIED:
                        console.log("用户拒绝使用地理位置")
                        break;
                    case error.POSITION_UNAVAILABLE:
                        console.log("无法获取当前位置")
                        break;
                    case error.TIMEOUT:
                        console.log("操作超时")
                        break;
                    case error.UNKNOWN_ERROR:
                        console.log("未知错误")
                        break;
                }
                 
            },
            // 配置:可选
            {
                enableHighAccuracy: true,		// 最高精度返回位置值
                timeout: 1,						// 1s 内返回一个位置
                maxmumAge: 2000					// 2s 内可返回缓存的位置的值
    		}
        )
        
    }else{
        var geolocation = new BMap.Geolocation()
        geolocation.getCurrentPosition(function(e) {
            if(this.getStatus() == BMAP_STATUS_SUCCESS){
                // 百度 geolocation 的经纬度属性不同,此处是 point.lat 而不是 coords.latitude
                console.log( '纬度:' + e.point.lat + ', 经度:' + e.point.lng)
            } else {
                console.log( 'failed' + this.getStatus())
            }
        })
        document.getElementById('location').innerText = '您的浏览器不支持内置获取地理位置'
    }
    
  • 相关阅读:
    南昌大学2021年数学分析考研试卷
    南昌大学2021年高等代数考研试卷
    吉林大学2021年数学分析考研试卷
    吉林大学2021年高等代数与解析几何考研试卷
    华中师范大学2021年高等代数考研试卷
    华中农业大学2021年数学分析考研试卷
    2021年清华大学丘成桐数学领军计划综合测试数学试题参考解析
    华中科技大学2021年数学分析考研试卷
    华中科技大学2021年高等代数考研试卷
    华东师范大学2021年数学分析考研试卷
  • 原文地址:https://www.cnblogs.com/ting-hui/p/14982043.html
Copyright © 2011-2022 走看看