JavaScript微信定位功能实现方法


Posted in Javascript onNovember 29, 2016

分享下微信是如何定位的:

本文主要讲解如何利用微信定位,如何将定位到的经纬度转换为百度地图对应的经纬度,以及处理定位失败、取消及错误时的默认做法。

//获取地理位置信息start
//封装成一个函数
 function getPosition() {
 //用ajax请求
  $.ajax({
   url: "/wechat/jssdk",//请求地址
   type: 'post',//post请求
   dataType: 'json',
   contentType: "application/x-www-form-urlencoded; charset=utf-8",
   data: {
    'url': location.href.split('#')[0]//将第一个#号前的地址传递
   },
//请求成功的函数
   success: function (data) {
    wx.config({
     // debug: true,
     appId: data.data.appId,
     timestamp: data.data.timestamp,
     nonceStr: data.data.nonceStr,
     signature: data.data.signature,
     jsApiList: ['checkJsApi', 'getLocation']
    });
    wx.ready(function () {
     wx.getLocation({
     //获得定位成功
      success: function (res) {
      //这是微信返回的真正经纬度
       var oldLat = res.latitude; // 纬度,浮点数,范围为90 ~ -90
       var oldLng = res.longitude; // 经度,浮点数,范围为180 ~ -180。
       /*下面是为了将获得的真正经纬度转换为对应的百度经纬度,因为是利用百度地图的经纬度去查询数据的,数据库中存的也是百度的经纬度*/
       //创建一个百度地图的点
       var customerPoint = new BMap.Point(oldLng, oldLat);
       //
       var convertor = new BMap.Convertor();

       var pointArr = [];//创建一个数组
       pointArr.push(customerPoint);//将刚才的点放进去
       convertor.translate(pointArr, 1, 5, initMap); //转换坐标
       function initMap(data) {
        if (data.status === 0) {//转换成功
         var point = data.points[0];//得到后的点
         var lng = point.lng;//获得转换后的经度
         var lat = point.lat;//获得转换后的纬度
         toDoFunction(lng, lat);//将经纬度传入到要运用的函数中
        } else {
        //下面两行是默认定位到西湖的经纬度
         lng = 120.141375;
         lat = 30.257806;
         toDoFunction(lng, lat);//将经纬度传入到要运用的函数中
        }
       }

      },
      //取消定位
      cancel: function () {
      //下面两行是默认定位到西湖的经纬度
       var lng = 120.141375;
       var lat = 30.257806;
       toDoFunction(lng, lat);//将经纬度传入到要运用的函数中
      },
      //定位失败
      fail: function () {
      //下面两行是默认定位到西湖的经纬度
       var lng = 120.141375;
       var lat = 30.257806;
       toDoFunction(lng, lat);//将经纬度传入到要运用的函数中
      }

     });
     //定位发生错误
     wx.error(function () {
     //下面两行是默认定位到西湖的经纬度
      var lng = 120.141375;
      var lat = 30.257806;
      toDoFunction(lng, lat);//将经纬度传入到要运用的函数中
     });

    });
   }
  });
 }

以上代码,如果可以定位到就用定位到的真正的经纬度,再转换成百度地图对应的经纬度,如果定位失败或者是点击取消或者发生错误,则默认定位到西湖的经纬度。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
ajaxControlToolkit AutoCompleteExtender的用法
Oct 30 Javascript
修改jquery里的dialog对话框插件为框架页(iframe) 的方法
Sep 14 Javascript
jQuery中ajax和post处理json的不同示例对比
Nov 02 Javascript
JavaScript使用指针操作实现约瑟夫问题实例
Apr 07 Javascript
jQuery实现仿美橙互联两级导航菜单效果完整实例
Sep 17 Javascript
JS使用cookie实现DIV提示框只显示一次的方法
Nov 05 Javascript
JavaScript函数的一些注意要点小结及js匿名函数
Nov 10 Javascript
AngularJS 使用 UI Router 实现表单向导
Jan 29 Javascript
JavaScript表单验证完美代码
Mar 02 Javascript
使用Angular CLI生成路由的方法
Mar 24 Javascript
Javascript实现秒表倒计时功能
Nov 17 Javascript
在Vue中使用antv的示例代码
Jun 29 Javascript
jQuery中的select操作详解
Nov 29 #Javascript
微信小程序加载更多 点击查看更多
Nov 29 #Javascript
AngularJs表单验证实例代码解析
Nov 29 #Javascript
AngularJS 获取ng-repeat动态生成的ng-model值实例详解
Nov 29 #Javascript
jQuery Easy UI中根据第一个下拉框选中的值设置第二个下拉框是否可以编辑
Nov 29 #Javascript
JavaScript获取服务器端时间的方法
Nov 29 #Javascript
微信小程序链接传参并跳转新页面
Nov 29 #Javascript
You might like
网页游戏开发入门教程二(游戏模式+系统)
2009/11/02 PHP
php修改上传图片尺寸的方法
2015/04/14 PHP
Ubuntu 16.04下安装PHP 7过程详解
2017/03/28 PHP
PHP解析url并得到url参数方法总结
2018/10/11 PHP
PHP递归统计系统中代码行数
2019/09/19 PHP
[原创]图片分页查看
2006/08/28 Javascript
SOSO地图API使用(一)在地图上画圆实现思路与代码
2013/01/15 Javascript
如何实现修改密码时密码框显示保存到cookie的密码
2013/12/10 Javascript
详谈JavaScript内存泄漏
2014/11/14 Javascript
jQuery使用之处理页面元素用法实例
2015/01/19 Javascript
jQuery中next方法用法实例
2015/04/24 Javascript
JavaScript操作XML文件之XML读取方法
2015/06/09 Javascript
跟我学习javascript的垃圾回收机制与内存管理
2015/11/23 Javascript
JS动态遍历json中所有键值对的方法(不知道属性名的情况)
2016/12/28 Javascript
JavaScript实现256色转灰度图
2017/02/22 Javascript
微信小程序中多个页面传参通信的学习与实践
2017/05/05 Javascript
详解JavaScript原生封装ajax请求和Jquery中的ajax请求
2019/02/14 jQuery
node.js使用express框架进行文件上传详解
2019/03/03 Javascript
浅谈vue项目利用Hbuilder打包成APP流程,以及遇到的坑
2020/09/12 Javascript
[01:34]2014DOTA2展望TI 剑指西雅图VG战队专访
2014/06/30 DOTA
[01:16]2014DOTA2 TI专访C9战队EE:中国五强中会占三席
2014/07/10 DOTA
flask中使用SQLAlchemy进行辅助开发的代码
2013/02/10 Python
python实现简易内存监控
2018/06/21 Python
python判断输入日期为第几天的实例
2018/11/13 Python
python 列表转为字典的两个小方法(小结)
2019/06/28 Python
django-rest-framework解析请求参数过程详解
2019/07/18 Python
Opencv python 图片生成视频的方法示例
2020/11/18 Python
CSS3 实现时间轴动画
2020/11/25 HTML / CSS
Html5实现iPhone开机界面示例代码
2013/06/30 HTML / CSS
布里斯班女装时尚品牌:Adrift
2017/12/28 全球购物
国际政治个人自荐信范文
2013/11/26 职场文书
优秀党员获奖感言
2014/02/18 职场文书
2014年基层党组织公开承诺书
2014/03/29 职场文书
大学生活动总结模板
2014/07/02 职场文书
离婚协议书格式
2015/01/26 职场文书
Redis实现主从复制方式(Master&Slave)
2022/06/21 Redis