整合營銷服務(wù)商

          電腦端+手機端+微信端=數(shù)據(jù)同步管理

          免費咨詢熱線:

          微信小程序之獲取當(dāng)前位置經(jīng)緯度以及地圖顯示詳解

          更新時間:2017年05月09日 11:29:02 作者:Junsept

          最近剛開始接觸微信小程序,在弄懂其結(jié)構(gòu)以及相關(guān)接口之后,準(zhǔn)備著手實現(xiàn)一個小程序,功能包括--獲取用戶當(dāng)前位置的經(jīng)緯度,在地圖上查看位置,通過地圖獲取不同位置的經(jīng)緯度。

          最近剛開始接觸微信小程序,在弄懂其結(jié)構(gòu)以及相關(guān)接口之后,準(zhǔn)備著手實現(xiàn)一個小程序,功能包括--獲取用戶當(dāng)前位置的經(jīng)緯度,在地圖上查看位置,通過地圖獲取不同位置的經(jīng)緯度。

          微信小程序的主體部分包括:

          調(diào)用地圖微信程序小程序下載_小程序打開地圖_微信小程序調(diào)用地圖

          新增頁面需要在app.json進行配置:

           "pages":[
            "pages/index/index",
            "pages/location/location",
            "pages/logs/logs"
           ]

          通過在視圖層調(diào)用bindtap與邏輯層中的方法匹配--實現(xiàn)頁面跳轉(zhuǎn):

          視圖層

           
            
           

          邏輯層

           locationViewTap: function(){
            wx.navigateTo({
             url: '../location/location'
            })
           }

          通過在視圖層調(diào)用bindtap與邏輯層中的方法匹配--實現(xiàn)方法調(diào)用:

          視圖層

            
            

          邏輯層

           mapViewTap:function(){
              wx.getLocation({
               type: 'gcj02', //返回可以用于wx.openLocation的經(jīng)緯度
               success: function(res) {
                console.log(res)
                wx.openLocation({
                 latitude: res.latitude,
                 longitude: res.longitude,
          

          微信小程序調(diào)用地圖_調(diào)用地圖微信程序小程序下載_小程序打開地圖

          scale: 28 }) } }) }

          有關(guān)地圖位置的三個接口:

          (1) wx.(OBJECT) 獲取當(dāng)前的地理位置、速度

          success返回參數(shù):

          緯度,浮點數(shù),范圍為-90~90,負數(shù)表示南緯

          經(jīng)度,浮點數(shù),范圍為-180~180,負數(shù)表示西經(jīng)

          speed

          速度,浮點數(shù),單位m/s

          位置的精確度

          (2) wx.(OBJECT) 使用微信內(nèi)置地圖查看位置

          OBJECT參數(shù)說明:

          參數(shù)類型必填說明

          Float

          緯度,范圍為-90~90,負數(shù)表示南緯

          Float

          經(jīng)度,范圍為-180~180,負數(shù)表示西經(jīng)

          scale

          INT

          縮放比例,范圍5~18,默認為18

          name

          String

          位置名

          address

          String

          地址的詳細說明

          微信小程序調(diào)用地圖_調(diào)用地圖微信程序小程序下載_小程序打開地圖

          success

          接口調(diào)用成功的回調(diào)函數(shù)

          fail

          接口調(diào)用失敗的回調(diào)函數(shù)

          接口調(diào)用結(jié)束的回調(diào)函數(shù)(調(diào)用成功、失敗都會執(zhí)行)

          (3) wx.(OBJECT) 打開地圖選擇位置

          success返回參數(shù):

          name

          位置名稱

          address

          詳細地址

          緯度,浮點數(shù),范圍為-90~90,負數(shù)表示南緯

          經(jīng)度,浮點數(shù),范圍為-180~180,負數(shù)表示西經(jīng)

          實現(xiàn)效果

          利用獲取當(dāng)前位置的經(jīng)緯度坐標(biāo),打開微信內(nèi)置地圖查看

          調(diào)用地圖微信程序小程序下載_微信小程序調(diào)用地圖_小程序打開地圖

          調(diào)用地圖微信程序小程序下載_小程序打開地圖_微信小程序調(diào)用地圖

          利用選取位置,并將位置信息的經(jīng)緯度實時響應(yīng)顯示

          調(diào)用地圖微信程序小程序下載_微信小程序調(diào)用地圖_小程序打開地圖

          調(diào)用地圖微信程序小程序下載_微信小程序調(diào)用地圖_小程序打開地圖

          注意事項:

          (1) 利用()獲得的地圖參數(shù)信息只有兩個

          利用返回的參數(shù)如下:

          調(diào)用地圖微信程序小程序下載_微信小程序調(diào)用地圖_小程序打開地圖

          (2) this.setData修改json里面的值

          邏輯層中的json數(shù)據(jù)可以通過WXML文件{{json}}顯示出來:

          小程序打開地圖_調(diào)用地圖微信程序小程序下載_微信小程序調(diào)用地圖

          以上就是本文的全部內(nèi)容,希望對大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。


          主站蜘蛛池模板: 精品视频一区二区| 国产亚洲福利一区二区免费看| 蜜臀Av午夜一区二区三区| 国产精品免费视频一区| 91精品一区二区综合在线| 亚洲综合国产一区二区三区| 正在播放国产一区| 亚洲国产欧美一区二区三区 | 3d动漫精品啪啪一区二区中| 精品亚洲一区二区三区在线播放| 国产av一区最新精品| 一区二区和激情视频| 在线播放国产一区二区三区| 少妇无码一区二区三区免费| a级午夜毛片免费一区二区| 精品一区二区三区免费观看| 成人国产精品一区二区网站| 波多野结衣精品一区二区三区| 久久精品无码一区二区三区不卡| 无码人妻精品一区二区三区99性| 亚洲视频一区二区三区| 亚洲欧洲精品一区二区三区| 精品国产aⅴ无码一区二区| 精品女同一区二区三区免费站| 文中字幕一区二区三区视频播放 | 成人精品一区二区户外勾搭野战 | 性色AV一区二区三区无码| 亚洲AV无码一区二区三区网址| 亚洲AV无码一区二区三区网址| 亚洲AV无码片一区二区三区| 天天视频一区二区三区| 国产成人久久一区二区三区| 天天爽夜夜爽人人爽一区二区| 久久无码精品一区二区三区| 国产亚洲情侣一区二区无| 久久久久人妻精品一区蜜桃| 老熟妇仑乱一区二区视頻| 精品一区二区三人妻视频| 国产日韩精品一区二区在线观看| 亚洲毛片不卡av在线播放一区| 伊人久久大香线蕉av一区|