小程序調用騰訊地圖如何實現
2020-09-27|HiShop
導讀：很多情況我們在開發小程序時，需要調用騰訊地圖的數據，來作為地圖導航。那么該如何實現？...
很多情況我們在開發小程序時，需要調用騰訊地圖的數據，來作為地圖導航。那么該如何實現？
騰訊地圖提供了供小程序使用的SDK，可結合地圖組件和api進行快速調用，訪問地址為http://lbs.qq.com/qqmap_wx_jssdk/index.html。首次使用需要申請秘鑰，下載sdk文件qqmap-wx-jssdk.js。需要設置安全域名https://apis.map.qq.com
index.wxml文件如下
<view><text>經度{{jd}}</text></view>
<view><text>緯度{{wd}}</text></view>
<view><text>地點{{address}}</text></view>
index.js文件如下
varQQMapWX= require('../libs/qqmap-wx-jssdk.js');
var qqmapsdk;
Page({
data:{
},
onLoad:function(options){
qqmapsdk =newQQMapWX({
key:'22VBZ-REEK5-WVSI7-QKCOP-QPM6E-W7BPO'
});
},
onReady:function(){
var that=this
wx.getLocation({
type:'wgs84',
success:function(res){
console.log(res)
var latitude1= res.latitude
var longitude1= res.longitude
qqmapsdk .reverseGeocoder({
location:{
latitude: latitude1,
longitude: longitude1
},
success:function(res){
console.log(res);
var add= res.result.address
that.setData({
wd: latitude1,
jd: longitude1,
address: add
})
}
});
}
在這里調用了逆地理解析reverseGeocoder，對地理解析結果讀取獲取當前位置。
HiShop小程序工具提供多類型商城/門店小程序制作，可視化編輯 1秒生成5步上線。通過拖拽、拼接模塊布局小程序商城頁面，所看即所得，只需要美工就能做出精美商城。
更多小程序開發案例，盡在：http://www.gstsqh.com.cn/xiaocx/kaifa.html
您可能感興趣:定位
上一篇：微信小程序貓眼api，下拉加載 下一篇：小程序video控件的使用
- 關注官方公眾號 -
提供多種電商軟件及解決方案