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 相关文章推荐
一个对于js this关键字的问题
Jan 09 Javascript
use jscript Create a SQL Server database
Jun 16 Javascript
jquery插件jbox使用iframe关闭问题
Feb 09 Javascript
jquerymobile checkbox及时刷新才能获取其准确值
Apr 14 Javascript
jquery1.83 之前所有与异步列队相关的模块详细介绍
Nov 13 Javascript
JS中令人发指的valueOf方法介绍
Feb 22 Javascript
JS正则验证邮箱的格式详细介绍
Nov 19 Javascript
Ionic项目中Native Camera的使用方法
Jun 07 Javascript
vue.js实现备忘录功能的方法
Jul 10 Javascript
微信小程序冒泡事件及其阻止方法实例分析
Dec 06 Javascript
JavaScript 中的六种循环方法
Jan 06 Javascript
Javascript之datagrid查询详解
Sep 15 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
实现复选框全选/全不选切换
2006/12/23 Javascript
基于jquery的textarea发布框限制文字字数输入(添加中文识别)
2012/02/16 Javascript
Javascript跨域请求的4种解决方式
2013/03/17 Javascript
javascript中的toFixed固定小数位数 简单实例分享
2013/07/12 Javascript
自己使用js/jquery写的一个定制对话框控件
2014/05/02 Javascript
jquery实现预览提交的表单代码分享
2014/05/21 Javascript
深入理解javascript严格模式(Strict Mode)
2014/11/28 Javascript
jQuery实现感应鼠标动画效果自动伸长的输入框实例
2015/02/24 Javascript
手机端页面rem宽度自适应脚本
2015/05/20 Javascript
jQuery插件Slider Revolution实现响应动画滑动图片切换效果
2015/06/05 Javascript
jquery+css实现的红色线条横向二级菜单效果
2015/08/22 Javascript
关于Vue.js一些问题和思考学习笔记(2)
2016/12/02 Javascript
Avalonjs 实现简单购物车功能(实例代码)
2017/02/07 Javascript
浅谈angular2路由预加载策略
2017/10/04 Javascript
Vue表单demo v-model双向绑定问题
2018/06/29 Javascript
jsonp跨域及实现百度首页联想功能的方法
2018/08/30 Javascript
JS实现的Object数组去重功能示例【数组成员为Object对象】
2019/02/01 Javascript
vue中datepicker的使用教程实例代码详解
2019/07/08 Javascript
微信公众号获取用户地理位置并列出附近的门店的示例代码
2019/07/25 Javascript
Node.js中的异步生成器与异步迭代详解
2021/01/31 Javascript
[06:49]2018DOTA2国际邀请赛寻真——VirtusPro傲视群雄
2018/08/12 DOTA
通过python下载FTP上的文件夹的实现代码
2013/02/10 Python
深入浅析Python传值与传址
2018/07/10 Python
Python3.6简单的操作Mysql数据库的三个实例
2018/10/17 Python
python dlib人脸识别代码实例
2019/04/04 Python
画pytorch模型图,以及参数计算的方法
2019/08/17 Python
Python的对象传递与Copy函数使用详解
2019/12/26 Python
前端水印的简单实现代码示例
2020/12/02 HTML / CSS
办理暂住证介绍信
2014/01/11 职场文书
公务员更新知识培训实施方案
2014/03/31 职场文书
劳动竞赛活动总结
2014/05/05 职场文书
教师竞聘上岗演讲稿
2014/09/03 职场文书
幼师辞职信怎么写
2015/02/27 职场文书
被告代理词范文
2015/05/25 职场文书
Django使用channels + websocket打造在线聊天室
2021/05/20 Python
JavaScript阻止事件冒泡的方法
2021/12/06 Javascript