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 相关文章推荐
根据分辩率调用不同的CSS.
Jan 08 Javascript
jQuery获取地址栏参数插件(模仿C#)
Oct 26 Javascript
Javascript查询DBpedia小应用实例学习
Mar 07 Javascript
JS异常处理的一个想法(sofish)
Mar 14 Javascript
angularJS中router的使用指南
Feb 09 Javascript
jQuery中 bind的用法简单介绍
Feb 13 Javascript
Bootstrap Table使用整理(四)之工具栏
Jun 09 Javascript
详解10分钟学会vue滚动行为
Sep 21 Javascript
vue-cli webpack模板项目搭建及打包时路径问题的解决方法
Feb 26 Javascript
详解如何在Vue项目中发送jsonp请求
Oct 25 Javascript
如何使用vue slot创建一个模态框的实例代码
May 24 Javascript
vue实现点击按钮切换背景颜色的示例代码
Jun 23 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
一个显示效果非常不错的PHP错误、异常处理类
2014/03/21 PHP
PHP获取当前相对于域名目录的方法
2015/06/26 PHP
php将数组存储为文本文件方法汇总
2015/10/28 PHP
微信网页授权(OAuth2.0) PHP 源码简单实现
2016/08/29 PHP
Laravel中的Blade模板引擎示例详解
2017/10/10 PHP
thinkPHP5框架中widget的功能与用法详解
2018/06/11 PHP
php反射学习之依赖注入示例
2019/06/14 PHP
List Information About the Binary Files Used by an Application
2007/06/18 Javascript
JS IE和FF兼容性问题汇总
2009/02/09 Javascript
javascript 可以拖动的DIV(二)
2009/06/26 Javascript
jquery JSON的解析方式
2009/07/25 Javascript
javascript给span标签赋值的方法
2015/11/26 Javascript
jquery制做精致的倒计时特效
2016/06/13 Javascript
jQuery animate easing使用方法图文详解
2016/06/17 Javascript
基于BootStrap实现局部刷新分页实例代码
2016/08/08 Javascript
vue实现ajax滚动下拉加载,同时具有loading效果(推荐)
2017/01/11 Javascript
JavaScript实现微信红包算法及问题解决方法
2018/04/26 Javascript
jQuery实现穿梭框效果
2021/01/19 jQuery
用Python和MD5实现网站挂马检测程序
2014/03/13 Python
Python异常学习笔记
2015/02/03 Python
详解Django中Request对象的相关用法
2015/07/17 Python
浅谈django框架集成swagger以及自定义参数问题
2020/07/07 Python
python打包生成so文件的实现
2020/10/30 Python
python 实现socket服务端并发的四种方式
2020/12/14 Python
使用useBean标志初始化BEAN时如何接受初始化参数
2012/02/11 面试题
用C或者C++语言实现SOCKET通信
2015/02/24 面试题
新闻学专业应届生求职信
2013/11/08 职场文书
企划经理的岗位职责
2013/11/17 职场文书
服务生自我鉴定
2014/01/22 职场文书
秋游活动策划方案
2014/02/16 职场文书
电台实习生求职信
2014/02/25 职场文书
《生命的药方》教学反思
2014/04/08 职场文书
项目申报专员岗位职责
2014/07/09 职场文书
超市七夕促销活动方案
2014/08/28 职场文书
2014年党建工作汇报材料
2014/11/02 职场文书
springboot使用Redis作缓存使用入门教程
2021/07/25 Redis