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 相关文章推荐
验证用户是否修改过页面的数据的实现方法
Sep 26 Javascript
Javascript读取cookie函数代码
Oct 16 Javascript
基于jquery的弹出提示框始终处于窗口的居中位置(类似于alert弹出框的效果)
Sep 28 Javascript
jQuery实现表头固定效果的实例代码
May 24 Javascript
JavaScript中的定时器之Item23的合理使用
Oct 30 Javascript
每天一篇javascript学习小结(String对象)
Nov 18 Javascript
jQuery EasyUI Tab 选项卡问题小结
Aug 16 Javascript
详解js的事件处理函数和动态创建html标记方法
Dec 16 Javascript
vue2.0 keep-alive最佳实践
Jul 06 Javascript
详解vue-meta如何让你更优雅的管理头部标签
Jan 18 Javascript
在vue项目创建的后初始化首次使用stylus安装方法分享
Jan 25 Javascript
vue动态循环出的多个select出现过的变为disabled(实例代码)
Nov 10 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
PHP5.3的垃圾回收机制(动态存储分配方案)深入理解
2012/12/10 PHP
php去除换行符的方法小结(PHP_EOL变量的使用)
2013/02/16 PHP
php实现文件下载代码分享
2014/08/19 PHP
Php-Redis安装测试笔记
2015/03/05 PHP
PHP记录和读取JSON格式日志文件
2016/07/07 PHP
Jquery实现侧边栏跟随滚动条固定(兼容IE6)
2014/04/02 Javascript
详解JavaScript中的异常处理方法
2015/06/16 Javascript
Angular JS数据的双向绑定详解及实例
2016/12/31 Javascript
jQuery中 bind的用法简单介绍
2017/02/13 Javascript
详解javascript立即执行函数表达式IIFE
2017/02/13 Javascript
jQuery 开发之EasyUI 添加数据的实例
2017/09/26 jQuery
Vue 实现点击空白处隐藏某节点的三种方式(指令、普通、遮罩)
2019/10/23 Javascript
vue动态禁用控件绑定disable的例子
2019/10/28 Javascript
Vue实现点击按钮复制文本内容的例子
2019/11/09 Javascript
nodemon实现Typescript项目热更新的示例代码
2019/11/19 Javascript
[52:15]2014 DOTA2国际邀请赛中国区预选赛5.21 HGT VS LGD-GAMING
2014/05/23 DOTA
Ubuntu 14.04+Django 1.7.1+Nginx+uwsgi部署教程
2014/11/18 Python
使用Python来开发Markdown脚本扩展的实例分享
2016/03/04 Python
django drf框架中的user验证以及JWT拓展的介绍
2019/08/12 Python
Python数据可视化:泊松分布详解
2019/12/07 Python
django使用JWT保存用户登录信息
2020/04/22 Python
如何解决cmd运行python提示不是内部命令
2020/07/01 Python
浅谈pandas dataframe对除数是零的处理
2020/07/20 Python
详解CSS3 弹性布局快速入门
2019/06/06 HTML / CSS
size?荷兰官方网站:英国高级运动鞋精品店
2020/07/24 全球购物
Juice Beauty官网:有机美容产品,护肤与化妆品
2020/06/13 全球购物
大学生专科毕业生自我评价
2013/11/17 职场文书
趣味体育活动方案
2014/02/08 职场文书
感恩教育月活动总结
2014/07/07 职场文书
计生工作先进事迹
2014/08/15 职场文书
个人三严三实对照检查材料思想汇报
2014/09/22 职场文书
监护人证明
2015/06/19 职场文书
学雷锋广播稿大全
2015/08/19 职场文书
Python实战之用tkinter库做一个鼠标模拟点击器
2021/04/27 Python
《勇者辞职不干了》上卷BD发售宣传CM公开
2022/04/08 日漫
Golang bufio详细讲解
2022/04/21 Golang