百度地图定位偏差了吗？用微信定位完美解决。

博客好久没更新了，可能是我懒了，也可能是最近太忙了。最近项目中有个需求，需要用到定位来查看用户的位置。
于是乎。。。。。

成功的流程

通过微信定位获取经纬度坐标 ==》拿到坐标后通过百度地图的坐标转换方法，最终获取精准定位显示在百度地图上。

百度地图定位，（失败）
百度地图api给的文档很清楚，直接拷贝复制，更改成自己的秘钥就可以看到效果了，但是。。。

我在福田，你却定到农林*（苹果手机定位是OK的，需求不能满足。需要继续解决。）*，难道是基站问题，疯狂查阅，疯狂百度，没一个方法是OK的，
换高德地图（失败）
空余时间我研究了一下高德地图，后来也是偏差好远。在此就不赋图片了。
后来后来想到了微信的内置方法，调微信的定位，于是乎。。。。。。
1. 调微信定位首先要签名，于是就开始先调后端给的签名接口。

 getWx(){let url = window.location.href.split('#')[0];this.axios.post(this.basURL.votUrl+'/home/getWx',{"data":{"url":url,},"token": this.$store.state.token,}).then(res=>{if(res.data.errorinfo == null){this.sellq = res.data.data;wx.config({debug:false,            // 因为在手机上测试没法打印，当debug为true时，所有的返回值都会在手机上alert出来appId:this.sellq.appId, // 必填，公众号唯一标识timestamp:this.sellq.timestamp, // 必填，生成签名的时间戳nonceStr:this.sellq.nonceStr, // 必填，生成签名的随机串signature:this.sellq.signature,// 必填，签名jsApiList: [   'getLocation'] // 必填，需要使用的JS接口列表，需要用到什么接口就去开发者文档查看相应的字段名});wx.error(function(res){alert("签名失败");// config信息验证失败会执行error函数，如签名过期导致验证失败，具体错误信息可以打开config的debug模式查看，也可以在返回的res参数中查看，对于SPA可以在这里更新签名。});wx.ready(function(res){console.log('签名成功');})}}).catch(error=>{console.log(error);})},

调定位方法（此处结合了百度地图转化坐标的方法。）
点击查看百度地图案例文档
点击查看微信定位文档

vue 获取微信定位方法，
签名通过之后，我们就能调微信定位的方法了，微信定位成功会返回经纬度坐标，这时拿到经纬度坐标通过百度地图转换坐标，就可以在百度地图上显示了，

 getaddress(){let that = this;wx.getLocation({type: "wgs84", // 默认为wgs84的gps坐标，如果要返回直接给openLocation用的火星坐标，可传入'gcj02'success: function(res) {that.latitude = res.latitude;     // 赋值微信的经纬度that.longitude = res.longitude;var speed = res.speed; // 速度，以米/每秒计var accuracy = res.accuracy; // 位置精度// 坐标转换var gpsPoint = new BMap.Point(that.longitude,that.latitude);// 创建地图var map = new BMap.Map("allmap");  map.centerAndZoom(gpsPoint,15);       // 用城市名设置地图中心点 map.enableScrollWheelZoom();     //启动滚轮放大缩小，默认禁用map.enableContinuousZoom();       //连续缩放效果，默认禁用//坐标转换完之后的回调函数var translateCallback = function (data){// console.log(data)if(data.status === 0) {let succlng = data.points[0];//获取转化后的坐标传入vuex里面。that.$store.state.lng = succlng.lng;that.$store.state.lat = succlng.lat;map.centerAndZoom(data.points[0],15);       // 用城市名设置地图中心点 var marker = new BMap.Marker(data.points[0]);  // 创建标注，为要查询的地址对应的经纬度map.addOverlay(marker);// console.log(succlng) // 通过经纬度反查 获取地址   重要误删//  var geoc = new BMap.Geocoder();//  geoc.getLocation(new BMap.Point(data.points[0].lng,data.points[0].lat), function(result){//     if (result){//         // address=result.address;//          console.log(JSON.stringify(result));//     }//  });}}setTimeout(function(){var convertor = new BMap.Convertor();var pointArr = [];pointArr.push(gpsPoint);convertor.translate(pointArr, 1, 5, translateCallback)}, 800);},// 用户拒绝定位cancel: function() {Dialog.confirm({title: '定位拒绝。',message: '您好！由于您拒绝获取地理位置。我们将无法获取您的位置。',}).then(() => {that.$router.back()}).catch(() => {that.$router.back()});  },// 定位失败fail: (error) => {console.log('失败了');},});wx.error(function(res) {console.log("wx-js初始化: " + res);}); },

通过微信定位转化百度地图，成功效果图。

百度地图定位偏差了吗？用微信定位完美解决。相关推荐

android百度地图定位自定义图标,百度地图SDK集成及根据坐标实现定位(android studio开发)...
百度地图SDK集成及根据坐标实现定位(android studio开发) 百度地图SDK集成及根据坐标实现定位(android studio开发) 1.下载百度地图SDK 链接:http://lbsy ...
android开发百度地图坐标偏差,利用百度地图Android sdk高仿微信发送位置功能及遇到的问题...
接触了百度地图开发平台半个月了,这2天试着模仿了微信给好友发送位置功能,对百度地图的操作能力又上了一个台阶我在实现这个功能的时候,遇到一些困难,可能也是别人将会遇到的困难,特在此列出 1.在微信发送 ...
百度地图开发：调用jsAPI实现实时定位的解决方案及常见问题
项目说明建议使用异步加载,避免F12控制台出现阻塞等提示: 电脑使用浏览器定位时,由于没有GPS,会出现无法定位(fail8)等错误提示,属于正常: 手机端时候,尤其是华为系列(安卓系统)无法正常定 ...
百度地图jar包冲突，特别是定位包冲突com/baidu/location/Address/$a.class。
本人在使用百度地图基础定位sdk时发现一个问题,jar包冲突于是通过网上找到解决答案 defaultConfig { multiDexEnabled true } 在6.0以上版本,得到完美解决. 当 ...
百度地图开发参数设置正确，却定位到大西洋海域去了，定位失败解决方案
我在做百度地图定位时直接定位到大西洋海域去了,查看定位经纬度是,其他地址参数为空,后来才清楚是经纬度获取失败,原因在于百度地图API在 android 6.0以上机型上需要申请权限官方百度地图定位 ...
百度地图后台获取数据，根据经纬度定位标记点，弹出通知窗口
通过ajax获取后台的经纬度信息和其他信息,根据经纬度信息在地图上显示标记点,点击标记点显示通知窗口 <body> <div id="allmap">< ...
关于百度地图 BMap.InfoWindow 只显示最后一条信息解决方法
转摘:http://blog.csdn.net/guo_love_peng/article/details/8674230 今天遇到这个问题了.后面再网上搜搜,发现都是你抄我,我转载你的,后来无意看到 ...
百度地图路线规划onchange事件触发两次冲突解决
var map = new BMap.Map("allmap",{enableMapClick:false}); map.centerAndZoom("福州市&q ...
android 微信回弹,完美解决safari、微信浏览器下拉回弹效果。
完美解决safari.微信浏览器下拉回弹效果,只保留局部回弹效果. CSS代码 .box{ overflow: auto; -webkit-overflow-scrolling: touch; } H ...
百度地图使用，小车，图标的定位
小车图标的定位问题 <script type="text/javascript"> var map = new BMap.Map("container&quo ...

百度地图定位偏差了吗？用微信定位完美解决。

成功的流程

百度地图定位偏差了吗？用微信定位完美解决。相关推荐

最新文章

热门文章