微信小程序 使用騰訊地圖SDK詳解及實現步驟

信小程序 使用騰訊地圖SDK詳解及實現步驟

   微信小程序JavaScript SDK：

　　官方文檔：http://lbs.qq.com/qqmap_wx_jssdk/index.html

步驟：

   1.申請開發者密鑰（key）：申請密匙

   2.下載微信小程序JavaScriptSDK，微信小程序JavaScriptSDK v1.0

   3.安全域名設置，須要在微信公衆平臺添加域名地址https://apis.map.qq.com  

    4.小程序示例

    /**
    * 獲取當前座標 
    */
    wx.getLocation({
      success: function (res) {
        self.setData({
          hasLocation: true,
        })
        showAddress(res.longitude, res.latitude, self);
      },
      cancel: function (res) {
        alert('對不起,請容許獲取您的地理位置');
        wx.closeWindow();
      },
      fail: function (res) {
        alert('系統檢測到微信沒有獲取位置權限,請先開啓再來哦')
      }
    })

//經緯度解析
 function showAddress(longitude, latitude, self) {
      // 實例化騰訊地圖API核心類  
      qqmapsdk = new QQMapWX({
        key: 'DPEBZ-SXF6X-IDK45-7O6JH-LJZZE-KIB42'//此處使用你本身申請的key  
      });
      // 騰訊地圖調用接口  
      qqmapsdk.reverseGeocoder({
        location: {
          latitude: latitude,
          longitude: longitude
        },
        success: function (res) {
          self.setData({
            address: res.result.address
          })
        },
        fail: function (res) {
          console.log(res);
        },
        complete: function (res) {
        }
      });
    }
  },

結果效果圖：