小程序獲取地理定位并顯示城市名稱的方法是什么

這篇文章給大家分享的是有關(guān)小程序獲取地理定位并顯示城市名稱的方法是什么的內(nèi)容。小編覺(jué)得挺實(shí)用的，因此分享給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧。

最近在看微信小程序，遇到地理定位顯示城市名稱的問(wèn)題。本文就是記錄一下解決這一問(wèn)題的過(guò)程。

解決方案  

小程序的wx.getLocation()獲得是經(jīng)緯度并不包含地名，所以要通過(guò)經(jīng)緯度用相應(yīng)的地圖轉(zhuǎn)換出地名（本文使用的是百度地圖）。

過(guò)程  

1、代 碼：

1）、代碼詳解：

wx.getLocation(object)：獲取當(dāng)前的地理位置、速度。

注意：需要用戶授權(quán)地理定位權(quán)限。

詳細(xì)參數(shù)說(shuō)明請(qǐng)查看小程序API：https://developers.weixin.qq.com/miniprogram/dev/api/location.html#wxgetlocationobject

讓我們看看wx.getLocation()成功后獲得到的數(shù)據(jù)：

從獲得到的數(shù)據(jù)我們可以看到并沒(méi)有我們想要的地名，因此就需要我們把經(jīng)緯度轉(zhuǎn)換成相應(yīng)的地名，本文使用的是百度地圖相應(yīng)功能轉(zhuǎn)換出相應(yīng)地名。

2）、 百度地圖的準(zhǔn)備工作

①、在使用百度地圖API之前，首先要獲得百度地圖的密鑰ak，ak由百度地圖方生成；

②、打開(kāi)百度地圖開(kāi)放平臺(tái)，導(dǎo)航欄處選擇 “開(kāi)發(fā)文檔” > “微信小程序JavaScript API”，在“入門(mén)指南”處有詳細(xì)介紹怎么生成密鑰ak，本文不再介紹。

參考文檔：http://lbsyun.baidu.com/index.php?title=wxjsapi/guide/key

③、復(fù)制生成好的ak,把a(bǔ)k粘貼到小程序中。其實(shí)，百度地圖有提供小程序使用的地圖api的壓縮包，但是出于小程序發(fā)布時(shí)對(duì)大小的限制，我選擇了使用鏈接。

百度地圖線上轉(zhuǎn)換鏈接地址：https://api.map.baidu.com/geocoder/v2/?ak=獲得的AK&location=' + latitude + ',' + longitude + '&output=json'

④、使用小程序的賬號(hào)登錄微信公眾平臺(tái)(https://mp.weixin.qq.com/)，在“設(shè)置” 中選擇 “開(kāi)發(fā)設(shè)置”，把百度地圖api的url添加到request合法域名中。

注意：百度地圖提供的有關(guān)于小程序API的下載包，不想使用鏈接地址的可以使用下載包，出于小程序發(fā)布時(shí)對(duì)大小的限制，本文使用的是鏈接地址未使用下載包。　　

⑤、此時(shí)準(zhǔn)備工作完成，便可以直接在小程序中根據(jù)經(jīng)緯度轉(zhuǎn)換出相應(yīng)的地名了，代碼如下圖。

讓我們看看success里的參數(shù)輸出：

獲取的參數(shù)中肯定有一款適合你~~~

2、附完整代碼：

wxml中進(jìn)行數(shù)據(jù)綁定。

感謝各位的閱讀！關(guān)于小程序獲取地理定位并顯示城市名稱的方法是什么就分享到這里了，希望以上內(nèi)容可以對(duì)大家有一定的幫助，讓大家可以學(xué)到更多知識(shí)。如果覺(jué)得文章不錯(cuò)，可以把它分享出去讓更多的人看到吧！