前言
目前騰訊位置服務(wù)提供路線規(guī)劃纹安、地圖選點(diǎn)单寂、地鐵圖、城市選擇器插件四款插件產(chǎn)品腻格，本篇博客主要針對(duì)地圖選點(diǎn)功能進(jìn)行實(shí)現(xiàn)诊赊。
開(kāi)通騰訊位置服務(wù)
1匹颤、進(jìn)入微信公眾平臺(tái)
2、登錄進(jìn)入小程序后臺(tái)托猩，選擇 “開(kāi)發(fā) - 開(kāi)發(fā)工具 - 騰訊位置服務(wù)”
3印蓖、點(diǎn)擊 “開(kāi)通”，進(jìn)入授權(quán)掃碼界面
4京腥、使用微信掃碼進(jìn)行授權(quán)
5赦肃、綁定開(kāi)發(fā)者賬號(hào)
接入插件
1、在小程序后臺(tái)公浪，選擇 “設(shè)置 - 第三方設(shè)置 - 插件管理”他宛，點(diǎn)擊 “添加插件”
2、搜索 “騰訊位置服務(wù)地圖選點(diǎn)” 進(jìn)行添加
開(kāi)發(fā)者密鑰配置
2堕汞、設(shè)置KEY的 “啟用產(chǎn)品”
a、勾選微信小程序晃琳，設(shè)置授權(quán) APP ID
授權(quán) APP ID 可以通過(guò) “設(shè)置 - 基本設(shè)置” 的賬號(hào)信息進(jìn)行查看
b讯检、勾選 “WebService API”
小程序插件需要使用WebService API的部分服務(wù)，所以需要給使用該功能的KEY配置相應(yīng)權(quán)限卫旱。
如果填寫(xiě)了域名白名單人灼，需要把servicewechat.com域名添加進(jìn)域名白名單中，否則小程序下將無(wú)法正常使用WebServiceAPI服務(wù)顾翼。
插件的使用
1投放、引入插件
地圖選點(diǎn)appId： wx76a9a06e5b4e693e
// app.json
{
"plugins": {
"chooseLocation": {
"version": "1.0.5",
"provider": "wx76a9a06e5b4e693e"
}
}
}
2、設(shè)置定位授權(quán)
地圖選點(diǎn)插件需要小程序提供定位授權(quán)才能夠正常使用定位功能
// app.json
{
"permission": {
"scope.userLocation": {
"desc": "你的位置信息將用于小程序定位"
}
}
}
3适贸、代碼實(shí)現(xiàn)
a灸芳、js代碼
"use strict";
const chooseLocation = requirePlugin('chooseLocation');
Page({
data: {
address: "",
locationName: ""
},
onShow: function () {
// 從地圖選點(diǎn)插件返回后，在頁(yè)面的onShow生命周期函數(shù)中能夠調(diào)用插件接口拜姿，取得選點(diǎn)結(jié)果對(duì)象
// 如果點(diǎn)擊確認(rèn)選點(diǎn)按鈕烙样，則返回選點(diǎn)結(jié)果對(duì)象，否則返回null
const location = chooseLocation.getLocation();
if(location){
this.setData({
address: location.address?location.address : "",
locationName: location.name?location.name : ""
});
}
},
//顯示地圖
showMap() {
//使用在騰訊位置服務(wù)申請(qǐng)的key（必填）
const key = "";
//調(diào)用插件的app的名稱（必填）
const referer = "";
wx.navigateTo({
url: 'plugin://chooseLocation/index?key=' + key + '&referer=' + referer
});
}
});
plugin://chooseLocation/index 接口參數(shù)說(shuō)明：
b蕊肥、wxml代碼
<!--index.wxml-->
<view class="container">
<button bindtap="showMap">選擇位置</button>
<view style="margin-top:10px">地址：{{address?address:"暫無(wú)"}}</view>
<view style="margin-top:10px">名稱：{{locationName?locationName:"暫無(wú)"}}</view>
</view>
4谒获、效果實(shí)現(xiàn)
作者：盛夏溫暖流年
鏈接：https://blog.csdn.net/j1231230/article/details/112352787
來(lái)源：CSDN
著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請(qǐng)聯(lián)系作者獲得授權(quán)壁却，非商業(yè)轉(zhuǎn)載請(qǐng)注明出處批狱。
