微信小程序-定位经纬度和展示内嵌地图

结果展示：

点击获取经纬度：                                                                                                                                                                                        点击展示地图：

                     

 

WXML文件：

<!--pages/location/location.wxml-->
<text>获取地理位置</text>
<view>
  <button bind:tap="getCurrentLocal">点击获取经纬度</button>
  <view>
    <text>纬度：</text>
    {{latitude}}
  </view>
  <view>
    <text>经度：</text>
    {{longitude}}
  </view>

  <view>
    <button bind:tap="getCurrentLocalMap">点击展开地图</button>
    <view> </view> </view
></view>

JS文件：

  getCurrentLocal() {
    wx.getLocation({
      type: "gcj02",
      success: (res) => {
        console.log(res),
          // latitude: res.latitude,
          // longitude: res.longitude,
          this.setData({
            latitude: res.latitude,
            longitude: res.longitude,
          });
        console.log(" latitude:" + res.latitude);
        console.log(" longitude:" + res.longitude);
      },
    });
  },

  getCurrentLocalMap() {
    wx.getLocation({
      type: "gcj02",
      success: (res) => {
        console.log(res),
          wx.chooseLocation({
            latitude: res.latitude,
            longitude: res.longitude,
          });
      },
    });
  },