taro 微信小程序使用地图逆向解析详细地址 - 新闻资讯 - 云南小程序开发|云南软件开发|云南网站建设-昆明葵宇信息科技有限公司

159-8711-8523

云南网建设/小程序开发/软件开发

知识

不管是网站,软件还是小程序,都要直接或间接能为您产生价值,我们在追求其视觉表现的同时,更侧重于功能的便捷,营销的便利,运营的高效,让网站成为营销工具,让软件能切实提升企业内部管理水平和效率。优秀的程序为后期升级提供便捷的支持!

您当前位置>首页 » 新闻资讯 » 小程序相关 >

taro 微信小程序使用地图逆向解析详细地址

发表时间:2020-10-19

发布人:葵宇科技

浏览次数:109

在微信 小程序中使用定位服务,首先要用户授权,在app.json中加入相应代码,

第一步

在app.config.ts中加入下面代码,弹出用户授权地图权限

  "permission":{
    "scope.userLocation":{
      "desc":"请点击允许"
    }
  },

第二步

在页面中插入wx.authorize开通用户授权

  wx.authorize({//获取权限
    scope: 'scope.userLocation',//位置权限
 	 success (res) {
 	 //授权成功 可进行拿取用户地址
	}

wx.authorize:授权
scope:要授权的功能,可查看微信文档

第三步

去腾讯地图申请开发者权限,获取key创建相应 小程序秘钥
腾讯地图地址
然后配置相应appid

第四步

使用 ‘微信小程序 JavaScriptSDK’ 需要下载微信小程序 JavaScriptSDK v1.2 文件。 然后将 微信小程序 JavaScriptSDK 文件引入到当前页面的 xx.js 中。jsSDK地址

第五步

在所需页面引入文件

 import QQMapWX from "@/lib/qqmap-wx-jssdk.min.js"

第六步

通过wx.getLocation 获取用户地址,也可以用wx.chooseLocation(这个是用户可以选择的),第一个是自动获取的

        wx.getLocation({
          type:'gcj02',//可选值,wgs84 gcj02相对准确一些
          isHighAccuracy:true,//增强经纬度获取
          success(longLat){
            const { latitude,longitude } = longLat;
            //可在此步骤把经纬度存入状态管理仓库
            // QQMapWX刚才引入的下载好js文件
              let qqmapsdk = new QQMapWX({
                  key: '腾讯地图key'
              })
              //通过reverseGeocoder用经纬度获取文字地址信息
              qqmapsdk.reverseGeocoder({
                location: {latitude,longitude},
                success(address) {
                //拿到的信息
                    console.log('addresa--------addresa', address)
                }
            })
          }
        })

相关案例查看更多