微信小程序点击按钮出现地图界面获取当前位置/指定位置

200 阅读1分钟

微信小程序点击按钮获取当前位置/指定位置

使用请自行加加减减哦!

首先需要先在app.json中配置一下permission字段 (getLocation需要在app.json中声明permission字段)

app.json

    "permission": {
        "scope.userLocation": {
          "desc": "你的位置信息将用于小程序位置接口的效果展示"
      }}

wxml

 <view class="dhadd" bindtap="location" data-lat="{{list.coordinate}}" data-city="{{list.city}}" data-district="{{list.district}}"  data-add="{{list.address}}" >导航</view>

js(获取当前位置)

   location: function () {
          wx.getLocation({	 //获取当前的地理位置
                type: 'gcj02',  //wgs84 返回 gps 坐标,gcj02 返回可用于 wx.openLocation 的坐标
                success: function (res) {
                      var latitude = res.latitude
                      var longitude = res.longitude
                      wx.openLocation({			
                            latitude: latitude,		//纬度
                            longitude: longitude,	//经度
                            scale: 28			//缩放比例
                      })
                }
          })
      },

js(获取后端返回的位置)

 location: function (e) {
    // console.log(e);return;
   var add =  e.currentTarget.dataset.add;
   var city =  e.currentTarget.dataset.city;
   var district =  e.currentTarget.dataset.district;
   var lat =  e.currentTarget.dataset.lat;
   var str = lat.split(',');
   var latitude = Number(str[1]);
   var longitude = Number(str[0]);
   console.log(latitude);
   console.log(longitude);
    wx.openLocation({
        latitude:latitude,//39.915122, // 纬度
        longitude:longitude,//116.403959, // 经度
        scale: 8, // 缩放比例
        name: add,
        address: city+district+add,
        success: function (r) {
          console.log(r)
        }
    })