微信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 相关文章推荐
Javascript 圆角div的实现代码
Oct 15 Javascript
JQuery 选项卡效果(JS与HTML的分离)
Apr 01 Javascript
一个可绑定数据源的jQuery数据表格插件
Jul 17 Javascript
PHP开发者必须掌握的6个关键字
Apr 14 Javascript
js如何判断用户是否是用微信浏览器
Jun 05 Javascript
JavaScript判断变量是对象还是数组的方法
Aug 28 Javascript
js实现使用鼠标拖拽切换图片的方法
May 04 Javascript
javascript实现倒计时(精确到秒)
Jun 26 Javascript
四种参数传递的形式——URL,超链接,js,form表单
Jul 24 Javascript
iframe中子父类窗口调用JS的方法及注意事项
Aug 25 Javascript
快速解决js中window.location.href不工作的问题
Nov 02 Javascript
原生js实现图片放大缩小计时器效果
Jan 20 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
php若干单维数组遍历方法的比较
2011/09/20 PHP
如何设置mysql允许外网访问
2013/06/04 PHP
PHP实现链表的定义与反转功能示例
2018/06/09 PHP
对象无length属性时IE6/IE7中无法将其转换成伪数组(ArrayLike)
2011/07/31 Javascript
下载文件个别浏览器文件名乱码解决办法
2013/03/19 Javascript
javascript类型转换使用方法
2014/02/08 Javascript
jquery中toggle函数交替使用问题
2015/06/22 Javascript
JavaScript实现in-place思想的快速排序方法
2016/08/07 Javascript
jQuery  ready方法实现原理详解
2016/10/19 Javascript
jQuery插件HighCharts实现的2D回归直线散点效果示例【附demo源码下载】
2017/03/09 Javascript
js实现彩色条纹滚动条效果
2017/03/15 Javascript
ReactNative中使用Redux架构总结
2017/12/15 Javascript
在 webpack 中使用 ECharts的实例详解
2018/02/05 Javascript
vue 组件 全局注册和局部注册的实现
2018/02/28 Javascript
Vue3.0结合bootstrap创建多页面应用
2019/05/28 Javascript
了解在JavaScript中将值转换为字符串的5种方法
2019/06/06 Javascript
js实现九宫格布局效果
2020/05/28 Javascript
vue3自定义dialog、modal组件的方法
2021/01/04 Vue.js
python操作xml文件详细介绍
2014/06/09 Python
python中from module import * 的一个坑
2014/07/20 Python
Python用Bottle轻量级框架进行Web开发
2016/06/08 Python
Python实现邮件的批量发送的示例代码
2018/01/23 Python
Scrapy-Redis结合POST请求获取数据的方法示例
2019/05/07 Python
Python调用C/C++的方法解析
2020/08/05 Python
使用css3制作动感导航条示例
2014/01/26 HTML / CSS
css3 实现圆形旋转倒计时
2018/02/24 HTML / CSS
英国儿童鞋和靴子:Start-Rite
2019/05/06 全球购物
一道SQL存储过程面试题
2016/10/07 面试题
班主任工作年限证明
2014/01/12 职场文书
党的群众路线教育实践活动总结材料
2014/10/30 职场文书
2014年乡镇个人工作总结
2014/12/03 职场文书
党校个人总结
2015/03/04 职场文书
2019行政前台转正申请书范文3篇
2019/08/15 职场文书
2019年教师节:送给所有老师的祝福语
2019/09/05 职场文书
HashMap实现保存两个key相同的数据
2021/06/30 Java/Android
MySQL 四种连接和多表查询详解
2021/07/16 MySQL