微信小程序——实现打开地图选择自身位置

在小程序开发中,可能很多时候我们都需要实现地理位置的选择定位,翻看其他大佬的文档基本都选用wx.getLocation来获取自身位置的经纬度,然后通过高德、百度等实现对经纬度的解析来实现定位。
小编的这个方法倒不需要那么麻烦,不清楚和大佬们的方案之间的优劣,感兴趣的可以两种方式都尝试。

因为是模块化开发,所以在wxml这里各位只需要将事件绑定和数据绑定复制到自己代码里就可以了

<view class="cu-form-group" bindtap="openmap">//事件绑定
    <view class="title">地址view>
    <text class="dztext">{{ugetaddress}}text>//数据绑定,选择地址后将位置信息存贮展现在这
    <text class="icon-locationfill text-orange">text>
  view>

js代码,通过wx.getLocation来获取经纬度,成功后将数据传入到wx.chooseLocation进行位置选择

data:{
	ugetaddress:"请选择地址"//默认是选择地址,位置选择后将具体位置存储到这里
}
openmap: function (e) {
    var that = this;
    wx.getLocation({
      type: 'gcj02', //返回可以用于wx.openLocation的经纬度
      success: function (res) {
        var latitude = res.latitude
        var longitude = res.longitude
        var ugetaddress = 'userData.ugetaddress'
        wx.chooseLocation({
          success: function (res) {
            var address_name = res.name;
            var address_info = res.address;
            that.setData({
              latitude: res.latitude,
              longitude: res.longitude,
              ugetaddress: address_info//将解析后的地址进行存储
            })
          },
          fail: function () {
            console.log(res);
          },
          complete: function () {
            // complete
          }
        })
      }
    })
  }

微信小程序——实现打开地图选择自身位置_第1张图片

你可能感兴趣的:(微信小程序)