微信小程序调用地图
// 在需要添加地图的.js文件中头部加上下面这句话
const chooseLocation = requirePlugin('chooseLocation');
// 需要在app.json中配置
"plugins": {
"chooseLocation": {
"version": "1.0.5", // 不需要修改
"provider": "wx76a9a06e5b4e693e" // 不需要修改,需要到小程序后台设置->第三方设置->插件管理->添加插件->腾讯位置服务地图选点
}
},
// 在data页面的初始数据加上下面两个字符串, 方便选择地址时的经纬度
data: {
latitude : '',
longitude: '',
name: '',
address: '',
province: '',
city: '',
district: ''
},
// 在前台添加一个点击事件触发选择地址函数 map
<view class="locationWidth icon-weibiaoti-" bindtap="map" >定位</view>
// 添加到调用地图的.js文件中
map(){//选地址
const key = '6OIBZ-VZP6J-VMOF6-FU5DI-NXVP6-MTBTO'; //使用在腾讯位置服务申请的key
const referer = 'wx76a9a06e5b4e693e'; //调用插件的app的名称
const location = JSON.stringify({
latitude: this.data.latitude,
longitude: this.data.longitude
});
const category = '生活服务,娱乐休闲';
wx.navigateTo({
url: `plugin://chooseLocation/index?key=${key}&referer=${referer}&location=${location}&category=${category}`
});
},
// 页面跳转的时候触发该函数,放到调用地图的.js文件中
onShow: function() {
// 调用到
const location = chooseLocation.getLocation(); // 如果点击确认选点按钮，则返回选点结果对象，否则返回null
console.log(location)
if(location){
this.setData({
name : location.name,
address: location.address,
province: location.province,
city: location.city,
district: location.district,
})
}
},
// 进入当前页面就自动执行该函数获取当前微信用户的经纬度,给data中的latitude , longitude
onLoad: function (res) {
var that = this;
wx.getLocation({
type: 'wgs84',
success (res) {
that.setData({
latitude : res.latitude,
longitude : res.longitude
})
}
})
}