微信js-sdk地理位置接口用法示例


Posted in Javascript onOctober 12, 2016

本文实例讲述了微信js-sdk地理位置接口用法。分享给大家供大家参考,具体如下:

前提,已经在wx.config()中权限验证通过,官方文档地址

官方api

使用微信内置地图查看位置接口

wx.openLocation({
  latitude: 0, // 纬度,浮点数,范围为90 ~ -90
  longitude: 0, // 经度,浮点数,范围为180 ~ -180。
  name: '', // 位置名
  address: '', // 地址详情说明
  scale: 1, // 地图缩放级别,整形值,范围从1~28。默认为最大
  infoUrl: '' // 在查看位置界面底部显示的超链接,可点击跳转
});

获取地理位置接口

wx.getLocation({
  type: 'wgs84', // 默认为wgs84的gps坐标,如果要返回直接给openLocation用的火星坐标,可传入'gcj02'
  success: function (res) {
    var latitude = res.latitude; // 纬度,浮点数,范围为90 ~ -90
    var longitude = res.longitude; // 经度,浮点数,范围为180 ~ -180。
    var speed = res.speed; // 速度,以米/每秒计
    var accuracy = res.accuracy; // 位置精度
  }
});

实例说明:

1.目前两种类型没有太大区别,经纬度的小数部分稍有点偏差
2.查看位置的infoUrl,测试连接似乎无效

//获取地理位置接口
//wgs84 返回4个值,
//gcj02 返回4个值 ,目前两种类型没有太大区别,经纬度的小数部分稍有点偏差
wx.getLocation({
  type:'wgs84',//默认为wgs84的gps坐标,
  //如果要返回直接给openLocation用的火星坐标,可传入'gcj02'
  success:function(res){
    var latitude=res.latitude;
    var longitude=res.longitude;
    var speed=res.speed;
    var accuracy=res.accuracy;
    appendText('经度:'+latitude+',纬度:'+longitude);
  }
});
wx.getLocation({
  type:'gcj02',
  success:function(res){
    //方法1
    wx.openLocation(res);
    //方法2,详细制定内容
    ////使用微信内置地图查看位置接口
    //wx.openLocation({
    //  latitude: res.latitude, // 纬度,浮点数,范围为90 ~ -90
    //  longitude: res.longitude, // 经度,浮点数,范围为180 ~ -180。
    //  name: '当前位置', // 位置名
    //  address: '当前地址', // 地址详情说明
    //  scale: 1, // 地图缩放级别,整形值,范围从1~28。默认为最大
    //  infoUrl: 'http://www.gongjuji.net' // 在查看位置界面底部显示的超链接,可点击跳转(测试好像不可用)
    //});
  }
});

位置显示如下:

微信js-sdk地理位置接口用法示例

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
js客户端快捷键管理类的较完整实现和应用
Jun 08 Javascript
jquery+ajax每秒向后台发送请求数据然后返回页面的代码
Jan 17 Javascript
jquery ajax 局部无刷新更新数据的实现案例
Feb 08 Javascript
javascript 模拟坦克大战游戏(html5版)附源码下载
Apr 08 Javascript
js图片实时加载提供网页打开速度
Sep 11 Javascript
Javascript aop(面向切面编程)之around(环绕)分析
May 01 Javascript
基于Datatables跳转到指定页的简单实例
Nov 09 Javascript
浅谈webpack 自动刷新与解析
Apr 09 Javascript
Auto.js自动收取自己和好友蚂蚁森林能量脚本
Jun 28 Javascript
使用vue-cli脚手架工具搭建vue-webpack项目
Jan 14 Javascript
如何实现双向绑定mvvm的原理实现
May 28 Javascript
javascript中正则表达式语法详解
Aug 07 Javascript
vue.js表格组件开发的实例详解
Oct 12 #Javascript
JavaScript实现页面定时刷新(定时器,meta)
Oct 12 #Javascript
基于Javascript实现文件实时加载进度的方法
Oct 12 #Javascript
Vue.js中数组变动的检测详解
Oct 12 #Javascript
有关文件上传 非ajax提交 得到后台数据问题
Oct 12 #Javascript
jquery动态创建div与input的实例代码
Oct 12 #Javascript
javascript加载xml 并解析各节点的值(实现方法)
Oct 12 #Javascript
You might like
咖啡界又出新概念,无需咖啡豆的分子咖啡
2021/03/03 咖啡文化
php4的session功能评述(三)
2006/10/09 PHP
Thinkphp实现MySQL读写分离操作示例
2014/06/25 PHP
php支持中文字符串分割的函数
2015/05/28 PHP
再谈PHP中单双引号的区别详解
2016/06/12 PHP
PHP 传输会话curl函数的实例详解
2017/09/12 PHP
Domino中运用jQuery读取视图内容的方法
2009/10/21 Javascript
document.documentElement和document.body区别介绍
2013/09/16 Javascript
js实现键盘控制DIV移动的方法
2015/01/10 Javascript
js判断手机号运营商的方法
2015/10/23 Javascript
jquery.form.js框架实现文件上传功能案例解析(springmvc)
2016/05/26 Javascript
javascript基础语法——全面理解变量和标识符
2016/06/02 Javascript
Angularjs中使用轮播图指令swiper
2017/05/30 Javascript
AngularJS 打开新的标签页实现代码
2017/09/07 Javascript
浅谈angular.copy() 深拷贝
2017/09/14 Javascript
利用Three.js如何实现阴影效果实例代码
2017/09/26 Javascript
React Native 自定义下拉刷新上拉加载的列表的示例
2018/03/01 Javascript
Angular5.0 子组件通过service传递值给父组件的方法
2018/07/13 Javascript
Jquery获取radio选中值实例总结
2019/01/17 jQuery
vue+ESLint 配置保存 自动格式化代码
2020/03/17 Javascript
Vue文本模糊匹配功能如何实现
2020/07/30 Javascript
Python中类的继承代码实例
2014/10/28 Python
你应该知道的python列表去重方法
2017/01/17 Python
python基本语法练习实例
2017/09/19 Python
python多继承(钻石继承)问题和解决方法简单示例
2019/10/21 Python
python加载自定义词典实例
2019/12/06 Python
使用python 将图片复制到系统剪贴中
2019/12/13 Python
Python动态声明变量赋值代码实例
2019/12/30 Python
Python中的整除和取模实例
2020/06/03 Python
KLOOK客路:发现更好玩的世界,预订独一无二的旅行体验
2016/12/16 全球购物
印度网上药店:1mg
2017/10/13 全球购物
《都江堰》教学反思
2014/02/07 职场文书
市场拓展计划书
2014/05/03 职场文书
2014年重阳节敬老活动方案
2014/09/16 职场文书
护士实习自荐信
2015/03/06 职场文书
maven依赖的version声明控制方式
2022/01/18 Java/Android