美文网首页
uniapp中微信小程序获取位置信息

uniapp中微信小程序获取位置信息

作者: 周星星的学习笔记 | 来源:发表于2021-10-04 23:47 被阅读0次

    一、配置manifest.json

    示意图

    二、腾讯位置服务平台申请密钥并下载SDK(详细文档)

    三、代码接入

    1.导入下载的sdk

    import QQMapWX from "../services/sdk/qqmap-wx-jssdk.min.js";
    

    2.获取位置信息的方法

    //获取位置信息
      async getLocationInfo() {
        return new Promise((resolve) => {
          //位置信息默认数据
          let location = {
            longitude: 0,
            latitude: 0,
            province: "",
            city: "",
            area: "",
            street: "",
            address: "",
          };
          uni.getLocation({
            type: "gcj02",
            success(res) {
              location.longitude = res.longitude;
              location.latitude = res.latitude;
              // 腾讯地图Api
              const qqmapsdk = new QQMapWX({
                key: 'xxxxxxxxxx'  //申请的key
              });
              qqmapsdk.reverseGeocoder({
                location,
                success(response) {
                  let info = response.result;
                  location.province = info.address_component.province;
                  location.city = info.address_component.city;
                  location.area = info.address_component.district;
                  location.street = info.address_component.street;
                  location.address = info.address;
                  resolve(location);
                },
              });
            },
            fail(err) {
              resolve(location);
            },
          });
        });
      },
    

    3.调用方法

    async onLoad() {
        //获取地理位置
        const location = await this.getLocationInfo();
      },
    

    4.返回的数据结构

    数据样例

    相关文章

      网友评论

          本文标题:uniapp中微信小程序获取位置信息

          本文链接:https://www.haomeiwen.com/subject/nilwnltx.html