微信小程序获取地理位置

最新推荐文章于 2024-08-21 11:10:11 发布

原创最新推荐文章于 2024-08-21 11:10:11 发布 · 248 阅读

0 ·

CC 4.0 BY-SA版权

微信专栏收录该内容

6 篇文章

订阅专栏

在这里插入图片描述
wxml

<map id="map" longitude="{{data.longitude}}" latitude="{{data.latitude}}" scale="14" markers="{{markers}}" polyline="{{polyline}}"  show-location style="width: 100%; height: 500px;"></map>
<text>
  {{data.longitude}}
  {{data.latitude}}
  {{address}}
</text>
<!-- longitude 中心经度 -->
<!-- latitude 中心纬度 -->
<!-- scale 缩放级别，取值范围为3-20 -->
<!-- markers 标记点 -->

var QQMapWX = require('../js/qqmap-wx-jssdk.js');
var qqmapsdk;
Page({
  data:{
    data:"",
    str:"",
    address:""
  },
  onLoad: function () {
    let _this = this;
    // 实例化API核心类
    qqmapsdk = new QQMapWX({
      key: 'key'
    });
    // Promise 获取地址
    let gets = new Promise((resolve, reject) => {
      wx.getLocation({
        type: 'wgs84',
        success:resolve
      })
    }).then(function(res){
      console.log(res)
      _this.setData({
        data:res
      })
    })

    // 正常方式获取地址
    wx.getLocation({
      type: 'wgs84',
      success:function(res){
        _this.setData({
          str: _this.res
        })
        console.log(res)
        var demo = new QQMapWX({
          key: 'key'
        });
        // 解析地址
        demo.reverseGeocoder({//地址解析
          location: {
            latitude: res.latitude,
            longitude: res.longitude
          },
          success: function (res) {//转为具体地址
            console.log(res);
            //获得地址
            _this.setData({
              address: res.result.address
            })
          },
          fail: function (res) {
            console.log(res);
          }
        });
      }
    })
  },