项目需求
- 获取用户(小程序)位置信息——wgs84 返回 gps 坐标,gcj02 返回国测局坐标系
- 发送位置信息至设备(设备仅支持wgs84 GPS坐标系)
- 设备发送轨迹至小程序,小程序接收轨迹信息并绘制出来(微信内嵌地图仅支持gcj02 国测局坐标系)
坐标转换方案
1、获取用户(小程序)wgs84 GPS坐标系位置信息
2、收到设备轨迹后转换为gcj02 国测局坐标系位置信息再绘制
1、获取用户(小程序)wgs84 GPS坐标系位置信息
微信官方文档 wx.getLocation(Object object)
wx.getLocation({
type: 'wgs84',//wgs84 返回 gps 坐标,gcj02 返回可用于 wx.openLocation 的坐标
altitude:true,//高精度定位
//定位成功,更新定位结果
success: function (res) {
var latitudee = res.latitude
var longitudee = res.longitude
that.setData({
longitude:parseFloat(longitudee),
latitude: parseFloat(latitudee),
})
},
//定位失败回调
fail:function(){
wx.showToast({
title:"定位失败",
icon:"none"
})
},
complete:function(){
//隐藏定位中信息进度
wx.hideLoading()
}
})
2、收到设备轨迹后转换为gcj02 国测局坐标系位置信息再绘制
腾讯位置服务 开发指南-坐标转换
输入的locations的坐标类型,可选值:
- GPS坐标
- sogou经纬度
- baidu经纬度
- mapbar经纬度
- sogou墨卡托
申请开发者密钥(Key):key是调用API的身份标识,作为必填参数之一传递给API接口
配额常见问题:如果显示接口调用已达上限去分配一下key额度即可(配额管理-账号额度-坐标转换-配额分配)
微信官方文档 wx.request(Object object)
// 坐标转换 wgs84TOgcj02
var roadpoint = jsonObj.car.roadpoint//jsonObj.car.roadpoint接收到的路线 数组格式
//处理数据,以便使用参数值进行URL编码
var requestSend = []
//遍历路线中所有点,使其满足 a_lat,a_lng;b_lat,b_lng;c_lat,c_lng...格式
for (var i in roadpoints) {
var requestSend_O = roadpoints[i].latitude+","+roadpoints[i].longitude
requestSend = requestSend.concat(requestSend_O)//组合requestSend和requestSend_O
}
requestSend = requestSend.join(';')//数组转字符串 将数组元素连接起来以构建一个字符串 可以随意设定分隔符 这里按调用需要设置为';'
wx.request({
url: 'https://apis.map.qq.com/ws/coord/v1/translate?locations='+requestSend+'&type=1&key=*****-*****-*****-*****-*****-*****',//请求的接口地址,必须基于https协议
method: 'get', //请求的方式
success: (res) => {//请求成功之后的回调函数
console.log(res)//查看真实数据 console.log(res.data)
var Points_O=[]
for (var i in res.data.locations) {
var points_0={latitude: res.data.locations[i].lat,
longitude: res.data.locations[i].lng},
Points_O = Points_O.concat(points_0)
}
this.setData({
polyline:[{
points:Points_O,
color:"#57b676",
width: 5,
arrowLine: true,//是否带箭头
borderWidth:2
// dottedLine: true
}],
})
}
})