微信小程序实现地图导航功能
目录
微信小程序实现地图导航功能
先获取当前地址
可参考以下链接
html代码
<!--index.wxml-->
<view bindtap="navigation">微信小程序调起地图</view>js代码
var amapFile = require('../../libs/qqmap-wx-jssdk.min');
Page({
/**
* 页面的初始数据
*/
data: {
// 是否收藏
iscollect:true,
// 公司地址
address:"要去的位置"
},
// 导航
navigation(){
var that = this;
var qqmapsdk = new amapFile({
key: '自己申请的key'
});
let name=this.data.address
let address=this.data.address
qqmapsdk.geocoder({
address: address,
success: function(res) {
// 经度lng 纬度lat
let latitude=res.result.location.lat
let longitude=res.result.location.lng
console.log(res,'res')
wx.getLocation({//获取当前经纬度
type: 'wgs84', //返回可以用于wx.openLocation的经纬度，官方提示bug: iOS 6.3.30 type 参数不生效，只会返回 wgs84 类型的坐标信息
success: function (res) {
console.log(res,'res2')
console.log(latitude,'latitude')
console.log(longitude,'longitude')
wx.openLocation({//使用微信内置地图查看位置。
latitude: latitude,//要去的纬度-地址
longitude: longitude,//要去的经度-地址
name: name,
address:address,
scale:18
})
}
})
},
complete: res => {
console.log(res.result.location)
}
})
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
}
})获取地理位置时候需要权限允许
在app.json中加入以下代码
"permission": {
"scope.userLocation": {
"desc": "你的位置信息将用于小程序定位的使用"
}
},