前言
最近在搗騰小程序，想開發一個自己的小程序，過一把獨立開發的癮。
自己設計，自己搞數據，自己找圖標，自己決定要或者不要什么功能，完全跟著心走，目前體驗下來，感覺還是蠻爽的。比在公司產品要你做什么你就得做什么舒服多了，巴適的很（假裝自己是四川人），哈哈
雖然我是一個App開發，但我還是蠻注重用戶體驗的，我會去考慮應用的使用場景，使用習慣，不斷的去調整，去優化。這次開發的小程序，從配色、圖標選擇、UI設計，到頁面結構、功能等都花了很多心思。歡迎體驗，吐槽。
呀！一不小心扯遠了，回歸主題！
小程序地圖SDK原理 （注意：這一段要仔細看哦，很多人問我為什么你寫的是高德地圖SDK，卻用的是騰訊地圖，答案就在這里）
微信小程序開發，可以使用地圖組件map，來進行地圖顯示、定位、顯示大頭針等基本功能，具體可以看官方文檔：微信小程序map組件。
map組件只提供一些基本的“硬件”，還需要“大腦”來驅動這些“硬件”。這個“大腦”就是騰訊地圖、百度地圖和高德地圖提供的小程序SDK。其實這些SDK只是提供了一些網絡請求接口，請求這些接口，能獲得對應結構的網絡數據，再驅動map組件來渲染。
比如線路規劃：從A到B，只要確定起點經緯度和終點經緯度，傳給SDK，SDK里就會發起網絡請求，獲得最佳路線，返回給你從A到B所途經的轉折點經緯度數組，你把得到的經緯度數組傳給map組件，map就能繪制路線。
高德SDK接口列表
高德地圖提供的接口有：
| 方法 | 用途 |
|---|---|
| getPoiAround(Object) | 獲取周邊的POI。 querykeywords、location、querytypes 字段于 1.1.0 版本新增。 |
| getRegeo(Object) | 獲取地址描述信息。 location 字段于 1.1.0 版本新增。 |
| getWeather(Object) | 獲取天氣情況（實時和預報）。type、city字段于 1.1.0 版本新增。 |
| getStaticmap(Object) | 獲取靜態的地圖圖片。 getStaticmap(Object) 方法于 1.1.0 版本新增。 |
| getInputtips(Object) | 獲取提示詞。 getInputtips(Object) 方法于 1.2.0 版本新增。 |
| getDrivingRoute(Object) | 獲取駕車路線。 getDrivingRoute(Object) 方法于 1.2.0 版本新增。 |
| getWalkingRoute(Object) | 獲取步行路線。 getWalkingRoute(Object) 方法于 1.2.0 版本新增。 |
| getTransitRoute(Object) | 獲取公交路線。 getTransitRoute(Object) 方法于 1.2.0 版本新增。 |
| getRidingRoute(Object) | 獲取騎行路線。 getRidingRoute(Object) 方法于 1.2.0 版本新增。 |
具體接口用法，參考高德官方文檔: AMapWX基本方法
接入SDK：
首先：下載SDK下載地址
下載完后，直接將amap-wx.js文件拖到工程libs目錄下，這個目錄隨便建的，一定要放到miniprogram文件夾內，任何位置都可以，不然找不到。如圖：
引用：
1.在js文件開頭引入并聲明SDK對象
2.我把不相關代碼刪掉后，獲得高德當前位置天氣情況，大概就是這樣子的：
// miniprogram/pages/home/home.js
var amapFile = require('../../libs/amap-wx.js');
Page({
/**
* 頁面的初始數據
* 本地圖："../../images/hz_metro_map.png"
* 網絡圖：
*/
data: {
weatherInfo: null,
},
/**
* 生命周期函數--監聽頁面顯示
*/
onShow: function() {
this._getWeather();
},
/**
* 獲取天氣信息
*/
_getWeather: function() {
var that = this;
var myAmapFun = new amapFile.AMapWX({ key: '高德地圖key' });
myAmapFun.getWeather({
success: function (data) {
//成功回調
console.log(data)
},
fail: function (info) {
//失敗回調
console.log(info)
}
})
}
})
這樣就拿到了高德的數據，超級簡單有木有。
遇到的坑
雖然很簡單，但是使用起來，還是發現有坑。使用getPoiAround接口時，發現沒有分頁功能。其實高德服務度接口是有分頁功能的，但是小程序SDK里并沒有把page參數暴露出來，坑啊。我使用的SDK版本是:sdkversion: "1.2.0"
解決辦法：在amap-wx.js文件里，找到getPoiAround接口，往參數里添加一個page字段即可，如下圖：
這樣就能正常分頁了。
最后
高德地圖的每日可調用次數上限，比騰訊地圖的多一些。
到此就說完了，也就那么回事。
歡迎掃上面小程序碼，體驗我的小程序，多多吐槽，我將繼續優化。謝謝！
