微信小程序:獲取地理定位和顯示相應的城市名稱。


 

  最近在看微信小程序,遇到地理定位顯示城市名稱的問題。本文就是記錄這一過程。

  • 解決方案                                                                                                                                            

    小程序的wx.getLocation()獲得是經緯度並不包含地名,所以要通過經緯度用相應的地圖轉換出地名(本文使用的是百度地圖)。

  • 過程                                                                                                                                                   
  1. 代 碼:

      

  1.1 代碼詳解:

  wx.getLocation(object):獲取當前的地理位置、速度。注意:需要用戶授權地理定位權限

    詳細參數說明請查看小程序API:https://developers.weixin.qq.com/miniprogram/dev/api/location.html#wxgetlocationobject

 

 讓我們看看wx.getLocation()成功后獲得到的數據:

  

 從獲得到的數據我們可以看到並沒有我們想要的地名,因此就需要我們把經緯度轉換成相應的地名,本文使用的是百度地圖相應功能轉換出相應地名。

  1.2  百度地圖的准備工作

    1.在使用百度地圖API之前,首先要獲得百度地圖的密鑰ak,ak由百度地圖方生成;

    2.打開百度地圖開放平台,導航欄處選擇 “開發文檔” > “微信小程序JavaScript API”,在“入門指南”處有詳細介紹怎么生成密鑰ak,本文不再介紹。

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

    3.復制生成好的ak,把ak粘貼到小程序中。其實,百度地圖有提供小程序使用的地圖api的壓縮包,但是出於小程序發布時對大小的限制,我選擇了使用鏈接。

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

    4.使用小程序的賬號登錄微信公眾平台(https://mp.weixin.qq.com/),在“設置” 中選擇 “開發設置”,把百度地圖api的url添加到request合法域名中。

     注意:百度地圖提供的有關於小程序API的下載包,不想使用鏈接地址的可以使用下載包,出於小程序發布時對大小的限制,本文使用的是鏈接地址未使用下載包。

    

     

    5.此時准備工作完成,便可以直接在小程序中根據經緯度轉換出相應的地名了,代碼如下圖。

        

     讓我們看看success里的參數輸出:

           

 

    獲取的參數中肯定有一款適合你~~~

   OK,本文僅供參考,轉載本文請注明出處,本文到這就結束了,謝謝。~~~

 

附完整代碼:

  wxml中進行數據綁定。

       

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM