腾讯地图实现定位功能

编程入门 行业动态 更新时间:2024-10-24 02:32:20

<a href=https://www.elefans.com/category/jswz/34/1770070.html style=腾讯地图实现定位功能"/>

腾讯地图实现定位功能

data(){

        return{

            mapUrl:         '.min.js'            

    }

}

this.getLocation() // 执行这个方法

(1)

getLocation(){     // 定义定位成功和失败各个情况将要执行的方法

var _this = this

let localCallback = () => getPosition(data => getGeoData(data), err => getGeoError(err))

        addSrcTag(_this.mapUrl,  localCallback)

        let getGeoData = (data) => {   //当定位成功的时候执行的方法

                         console.log('JS获取定位成功', data)

                          data.province // 省名字

                           data.city        //  城市名字

                           data.lat          //  纬度

                           data.lon         //   经度

        }

        let getGeoError = (err) => {    //当定位失败的时候执行的方法

               console.log('js获取定位失败' ,err)

         }

}

(2)

getPosition (cb, errcb){    // 执行开始定位的方法

   let geolocation = new qq.maps.Geolocation('6IZBZ-JQ4WP-5SMD2-VJKOA-OYGFZ-26F5B', 'myapp')       // key值和申请key值的名字

if(geolocation){    // 当传入值定位成功后

        console.log("getPosition")

        let options = { timeout:9000, failTipFlag:true }   // 给的时间为9000,是否提示为true

        geolocation.getLocation(position => {

                console.log('success定位成功执行的方法', position)

                 let lon = position.lng  // 经度

                 let lat = position.lat   // 纬度

                 let city = position.city //城市名

                 let  province = position.province    // 省名字

                  let location = { lon, lat, city, province }

                  if (typeof cb === 'function') cb(location) 

        }, error => {

                console.log('定位失败执行的方法 error', error)

                if(typeof errcb === 'function') errcb(error) 

      },  options)

} else {

        console.log('未获取位置对象')

}

}

(3)

addSrcTag(src, cb, error) {                 // 添加地址,方法

        let script  = document.createElement('script')     //创建script对象标签

        script.src = src                                  // script的src赋值

        console.log(script.src)

        document.head.appendChild(script)     // head追加script标签

        script.onload = () => cb(error)

}

更多推荐

腾讯地图实现定位功能

本文发布于:2024-02-10 16:34:04,感谢您对本站的认可!
本文链接:https://www.elefans.com/category/jswz/34/1676244.html
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,我们将在24小时内删除。
本文标签:腾讯   功能   地图

发布评论

评论列表 (有 0 条评论)
草根站长

>www.elefans.com

编程频道|电子爱好者 - 技术资讯及电子产品介绍!