|
導讀微信小程序,簡稱小程序,英文名Mini Program,是一種不需要下載安裝即可使用的應用,它實現了應用“觸手可及”的夢想,用戶掃一掃或搜一下即可打開應用。小程序是一種不用下載就能使用的應用,也是一... 微信小程序,簡稱小程序,英文名Mini Program,是一種不需要下載安裝即可使用的應用,它實現了應用“觸手可及”的夢想,用戶掃一掃或搜一下即可打開應用。小程序是一種不用下載就能使用的應用,也是一項門檻非常高的創新,經過將近兩年的發展,已經構造了新的小程序開發環境和開發者生態。 這篇文章主要介紹了關于微信小程序之獲取當前位置經緯度以及地圖顯示,有著一定的參考價值,現在分享給大家,有需要的朋友可以參考一下最近剛開始接觸微信小程序,在弄懂其結構以及相關接口之后,準備著手實現一個小程序,功能包括--獲取用戶當前位置的經緯度,在地圖上查看位置,通過地圖獲取不同位置的經緯度。 最近剛開始接觸微信小程序,在弄懂其結構以及相關接口之后,準備著手實現一個小程序,功能包括--獲取用戶當前位置的經緯度,在地圖上查看位置,通過地圖獲取不同位置的經緯度。 微信小程序的主體部分包括:
新增頁面需要在app.json進行配置: "pages":[ "pages/index/index", "pages/location/location", "pages/logs/logs" ] 通過在視圖層調用bindtap與邏輯層中的方法匹配--實現頁面跳轉: 視圖層 <view class="location" bindtap="locationViewTap"> <button>獲取用戶當前位置</button> </view> 邏輯層
locationViewTap: function(){
wx.navigateTo({
url: '../location/location'
})
}通過在視圖層調用bindtap與邏輯層中的方法匹配--實現方法調用: 視圖層 <button bindtap="mapViewTap" style="margin:10px">查看地圖</button> <button bindtap="chooseMapViewTap" style="margin:10px">選擇位置</button> 邏輯層
mapViewTap:function(){
wx.getLocation({
type: 'gcj02', //返回可以用于wx.openLocation的經緯度
success: function(res) {
console.log(res)
wx.openLocation({
latitude: res.latitude,
longitude: res.longitude,
scale: 28
})
}
})
}有關地圖位置的三個接口: (1) wx.getLocation(OBJECT) 獲取當前的地理位置、速度 success返回參數:
(2) wx.openLocation(OBJECT) 使用微信內置地圖查看位置 OBJECT參數說明:
(3) wx.chooseLocation(OBJECT) 打開地圖選擇位置 success返回參數:
實現效果 利用getLocation獲取當前位置的經緯度坐標,openLocation打開微信內置地圖查看
利用chooseLocation選取位置,并將位置信息的經緯度實時響應顯示
注意事項: (1) 利用getLocation()獲得的地圖參數信息只有兩個 利用chooselocation返回的參數如下: (2) this.setData修改json里面的值 邏輯層中的json數據可以通過WXML文件{{json}}顯示出來: 以上就是本文的全部內容,希望對大家的學習有所幫助,更多相關內容請關注PHP中文網! 相關推薦: 以上就是微信小程序之獲取當前位置經緯度以及地圖顯示的詳細內容,更多請關注php中文網其它相關文章! 小程序是一種不需要下載安裝即可使用的應用,它實現了應用“觸手可及”的夢想,用戶掃一掃或者搜一下即可打開應用。 |
溫馨提示:喜歡本站的話,請收藏一下本站!