第 1 步：獲取經(jīng)緯度

wx.getLocation(Object object)

調(diào)用前需要 用戶授權(quán) scope.userLocation

獲取當(dāng)前的地理位置、速度。當(dāng)用戶離開(kāi)小程序后，此接口無(wú)法調(diào)用。開(kāi)啟高精度定位，接口耗時(shí)會(huì)增加，可指定 highAccuracyExpireTime 作為超時(shí)時(shí)間。地圖相關(guān)使用的坐標(biāo)格式應(yīng)為 gcj02。

  getAdress: function () {
    let that = this;
    wx.getLocation({
      type: 'gcj02', //返回可以用于wx.openLocation的經(jīng)緯度
      success: function (res) {
        let latitude = res.latitude //維度
        let longitude = res.longitude //經(jīng)度
        // console.log(res);
        that.loadCity(latitude, longitude);
      }
    })
  },

第 2 步：獲取高德Key

第 3 步：下載并安裝微信小程序SDK

從相關(guān)下載頁(yè)面下載開(kāi)發(fā)包并解壓。

解壓后得到 amap-wx.js 文件，在創(chuàng)建的項(xiàng)目中，新建一個(gè)名為 libs 目錄，將 amap-wx.js 文件拷貝到 libs 的本地目錄下，完成安裝。

第 4 步：設(shè)置安全通訊域名

為了保證高德小程序 SDK 中提供的功能的正常使用，需要設(shè)置安全域名。

登錄微信公眾平臺(tái)，在 "設(shè)置"－>"開(kāi)發(fā)設(shè)置" 中設(shè)置 request 合法域名，將 https://restapi.amap.com 中添加進(jìn)去，如下圖所示：

第 5 步：

接下來(lái)我們需要在頁(yè)面的js文件中配置我們需要操作的數(shù)據(jù)

const amapFile = require('../../libs/amap-wx.js');
const markersData = {
  latitude: '', //緯度
  longitude: '', //經(jīng)度
  key: "需要去高德地圖注冊(cè)成為開(kāi)發(fā)者，然后就會(huì)獲得一個(gè)key" //申請(qǐng)的高德地圖key
};

好了，我們配置好外部文件以后，就可以在js里面寫邏輯了，下面貼出我的js代碼。

//index.js
//獲取應(yīng)用實(shí)例
const app = getApp();
const util = require('../../utils/util.js');
const amapFile = require('../../libs/amap-wx.js');
const markersData = {
  latitude: '', //緯度
  longitude: '', //經(jīng)度
  key: "需要去高德地圖注冊(cè)成為開(kāi)發(fā)者，然后就會(huì)獲得一個(gè)key" //申請(qǐng)的高德地圖key
};
Page({
  data: {
    motto: 'Hello World',
    userInfo: {},
    hasUserInfo: false,
    canIUse: wx.canIUse('button.open-type.getUserInfo'),

    countries: ["小型汽車", "大型汽車", "掛車", "大型新能源汽車", "小型型新能源汽車", "其他號(hào)牌"],
    countryIndex: 0,
    nowTime: '',
    adress: ''
  },
  //事件處理函數(shù)
  takePictures: function (options) {
    // wx.showActionSheet({
    //   itemList: ['從手機(jī)相冊(cè)選擇', '拍照'],
    //   success: function(res) {
    //     console.log(res.tapIndex)
    //   },
    //   fail: function(res) {
    //     console.log(res.errMsg)
    //   }
    // })
    wx.chooseImage({
      count: 1,
      sizeType: ['original', 'compressed'],
      sourceType: ['album', 'camera'],
      success(res) {
        // tempFilePath可以作為img標(biāo)簽的src屬性顯示圖片
        var tempFilePaths = res.tempFilePaths
        self.setData({
          tempfilepath: tempFilePaths[0]
        }) //tempFilePaths為一個(gè)數(shù)組，顯示數(shù)組第一個(gè)元素
        //setData 函數(shù)用于將數(shù)據(jù)從邏輯層發(fā)送到視圖層（異步），同時(shí)改變對(duì)應(yīng)的 this.data 的值（同步）。
      }
    })
  },
  bindCountryChange: function (e) {
    console.log('picker country 發(fā)生選擇改變，攜帶值為', e.detail.value);
    this.setData({
      countryIndex: e.detail.value
    })
  },
  getAdress: function () {
    let that = this;
    wx.getLocation({
      type: 'gcj02', //返回可以用于wx.openLocation的經(jīng)緯度
      success: function (res) {
        let latitude = res.latitude //維度
        let longitude = res.longitude //經(jīng)度
        // console.log(res);
        that.loadCity(latitude, longitude);
      }
    })
  },
  //把當(dāng)前位置的經(jīng)緯度傳給高德地圖，調(diào)用高德API獲取當(dāng)前地理位置，天氣情況等信息
  loadCity: function (latitude, longitude) {
    let that = this;
    let myAmapFun = new amapFile.AMapWX({
      key: markersData.key
    });
    myAmapFun.getRegeo({
      location: '' + longitude + ',' + latitude + '', //location的格式為'經(jīng)度,緯度'
      success: function (data) {
        // console.log(data);
        console.log(data[0].desc);
        that.setData({
          adress: data[0].desc
        })
      },
      fail: function (info) {}
    });

    // myAmapFun.getWeather({
    //   success: function (data) {
    //     that.setData({
    //       weather: data
    //     })
    //     console.log(data);
    //     //成功回調(diào)
    //   },
    //   fail: function (info) {
    //     //失敗回調(diào)
    //     console.log(info)
    //   }
    // })
  },
  adressChange:function (e) {
    this.setData({
      adress: e.detail.value
    })
  },


  height="334" src="https://img-blog.csdnimg.cn/20200925162016365.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQzMjU4MjUy,size_16,color_FFFFFF,t_70" width="1200" />