整合營銷服務(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í)有所幫助,也希望大家多多支持腳本之家。


          主站蜘蛛池模板: 亚洲欧洲无码一区二区三区| 麻豆果冻传媒2021精品传媒一区下载 | 日产精品久久久一区二区| 无码一区二区三区爆白浆| 视频一区视频二区日韩专区| 亚洲精品一区二区三区四区乱码| asmr国产一区在线| 国产激情一区二区三区小说 | 日韩欧国产精品一区综合无码| 99精品国产高清一区二区| 一区精品麻豆入口| 国产乱人伦精品一区二区在线观看| 免费一区二区三区| 一区二区三区四区无限乱码 | 亚洲av综合av一区| 免费一区二区无码视频在线播放 | 一区二区三区无码视频免费福利 | 无码乱人伦一区二区亚洲| 一区二区三区在线播放| 日韩精品免费一区二区三区| 精品熟人妻一区二区三区四区不卡| 国产免费无码一区二区 | 久久亚洲一区二区| 中文字幕在线播放一区| 杨幂AV污网站在线一区二区| 国产精品无码AV一区二区三区| 亚洲性日韩精品国产一区二区| 亚洲午夜日韩高清一区| 国产精品一区二区久久沈樵| 亚洲av无码一区二区三区人妖| 精品国产一区二区三区无码| 亚洲一区二区在线免费观看| 亚洲AV本道一区二区三区四区| 亚洲日本一区二区三区在线| 少妇人妻偷人精品一区二区| 亚洲国产精品一区二区第四页| 亚洲第一区精品日韩在线播放| 一区二区三区中文字幕| 久久se精品一区精品二区国产| 亚洲午夜日韩高清一区| 亚洲日本一区二区三区在线|