uniapp H5 获取当前定位

最新推荐文章于 2024-07-26 20:46:33 发布

vue练习时长两年半的个人实习生

最新推荐文章于 2024-07-26 20:46:33 发布

阅读量597

点赞数

分类专栏： uniapp 文章标签： javascript 前端

本文链接：https://blog.csdn.net/o_o1996/article/details/126275453

版权

uniapp 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

    /** 需要安装 vue-baidu-map   vue-jsonp插件 **/

    // vue-baidu-map 初始化  

   mapReady({ BMap, map }) {
            this.initPoint()
            this.idDefaultVal = 1
        },

    // uniapp 自带获取经纬度 不准确需要转换

     /* lon 经度 114.360243   lat纬度 30.560407  初始化*/
        async initPoint() {
            let _this = this
            await uni.getLocation({
                isHighAccuracy: true,
                success: function (res) {
                    _this.loading = false
                    _this.pointTransition(res.longitude, res.latitude)
                },
            })
        },
    

   /* 百度地图 坐标转换，不同地图坐标都不一样，需要转换*/
        async pointTransition(lng, lat) {
            let url = 'https://api.map.baidu.com/geoconv/v1/?'
            await this.$jsonp(url, {
                coords: lat + ',' + lng,
                ak: '自己的ak',
                from: 3,
                to: 3,
                output: 'jsonp',
            })
                .then(res => {
                    // x lon y lat
                    this.getUserLocation(res.result[0].y, res.result[0].x)
                })
                .catch(err => {
                    console.log(err)
                })
        },


        /* 百度 逆地址解析，获取精确定位*/
        getUserLocation(lat, lng) {
            let ak = '自己的ak'
            let url = `https://api.map.baidu.com/reverse_geocoding/v3/?ak=${ak}&output=json&coordtype=wgs84ll&location=${lng},${lat}`
            this.$jsonp(url)
                .then(res => {
                    this.keyword = res.result.formatted_address
                    this.markerPoint.lng = res.result.location.lng
                    this.markerPoint.lat = res.result.location.lat
                })
                .catch(err => {
                    console.log(err)
                })
        },