收藏此站 營銷型網站標準 微商城/小程序商城
                    當前位置:首頁>新聞中心>技術日志 > 小程序教程之騰訊地圖及導航的使用

                    小程序教程之騰訊地圖及導航的使用

                    作者: 美橙網 . 閱讀量:388 . 發表時間:2020-08-27 15:59:04

                    首先在wxml文件中輸入地圖代碼,相關內容自行查閱小程序開發教程


                    <map class="maps" id="map" longitude="112.8977300000" latitude="28.2174900000" scale="16" style="width:100%;height:500rpx;" bindtap="mapclick" markers="{{markers}}"></map>

                    longitude:經度

                    latitude:緯度

                    markers:標記(這個要動態的傳遞數值,所以這里就使用{{markers}})

                    下面就是markers的數值傳遞,在page的data中設置markers數組的值

                    Page({
                      data: {
                        markers: [{
                          iconPath: "/images/location.png",//定位圖標
                          id: 0,
                          latitude: 28.2174900000,//緯度
                          longitude: 112.8977300000,//經度
                          width: 50,//圖標寬
                          height: 50,//圖標高
                        }],
                      }, 
                    })

                    這樣前端的地圖組件就定位完成!



                    下一步操作就是怎么進行直接導航,這里使用微信自帶的導航組件wx.openLocation(相關內容自行查閱小程序開發教程)

                    首先在地圖上綁定一個事件,使用bindtap="mapclick" 來綁定點擊地圖的操作事件mapclick,然后就是設置點擊事件。

                    mapclick: function () {
                        wx.openLocation({
                          latitude: 28.2174900000,//緯度
                          longitude: 112.8977300000,//經度
                          scale: 18,//縮放
                          name: '蘇州竹子網絡科技有限公司',
                          address: '蘇州相城區中翔大廈15012'
                        })
                      },



                    來源: www.addaption.com/jsrz/129.html

                    美橙網-banner

                    關鍵詞Tags:

                    想知道您的網站是營銷型網站嗎
                    美橙網免費為您提供專業的網站診斷方案,趕緊預約吧!今天還剩3個名額
                    美橙網產品
                    蘇州五網合一(微信/小程序) 營銷型網站標準 微商城/小程序商城 競價托管
                    美橙網服務
                    7x24小時售后支持 網站免費診斷 技術上門服務 后臺培訓,定期回訪
                    新聞中心
                    公司新聞 網站建設/優化 技術日志
                    關于美橙網
                    美橙網介紹 聯系美橙網 美橙網團隊 誠聘英才
                    咨詢服務電話
                    0512-681375740512-68137574
                    服務熱線:4006-711-886
                    美橙網微信掃一掃
                    COPYRIGHT ? 2011-2020 美橙網 ALL RIGHTS RESERVED
                    地址:蘇州市相城區相城大道666號中翔大廈15樓 | 蘇ICP備20012076號
                    加入收藏 立即咨詢美橙網 聯系美橙網
                    免费三级片福利_免费三级片韩国_免费三级片视频