微信小程序 location API实例详解


Posted in Javascript onOctober 02, 2016

微信小程序 location API实例详解

location API也就分这里分两种wx.getLocation(object)获取当前位置和wx.openLocation(object)通过经纬度打开内置地图。其中定位获取位置信息返回参数是有问题的speed,accuracy这两个是没有的。还有一个就是打开内置地图之后再返回会报一个错误(Page route错误—WAService.js:2 navigateBack 一个不存在的webviewId0)如果有知道的可告知,我找到解决方式也会补充下!

主要属性:

wx.getLocation(object)获取当前位置

微信小程序 location API实例详解

成功之后返回参数

微信小程序 location API实例详解

wx.openLocation(object)打开微信内置地图

微信小程序 location API实例详解

这里直接进入微信内置应用,当使用导航返回键时是内部写的外界无法干预所以WAService.js:2 navigateBack 一个不存在的webviewId0这个错估计也带等小程序修复吧!!

wxml

<button id="0" type="primary" bindtap="listenerBtnGetLocation">定位当前位置并打开内置地图</button>

js

Page({
 data:{
  text:"Page location"
 },
 onLoad:function(options){
  // 页面初始化 options为页面跳转所带来的参数
 },

 /**
  * 监听定位到当前位置
  */
 listenerBtnGetLocation: function() {
  wx.getLocation({
   //定位类型 wgs84, gcj02
   type: 'gcj02',
   success: function(res) {
    console.log(res)
    wx.openLocation({
     //当前经纬度
     latitude: res.latutude,
     longitude: res.longitude,
     //缩放级别默认28
     scale: 28,
     //位置名
     name: '测试地址',
     //详细地址
     address: '火星路24号',
     //成功打印信息
     success: function(res) {
      console.log(res)
     },
     //失败打印信息
     fail: function(err) {
      console.log(err)
     },
     //完成打印信息
     complete: function(info){
      console.log(info)
     },
    })

   },
   fail: function(err) {
    console.log(err)
   },
   complete: function(info) {
    console.log(info)
   },
  })
 },

 onReady:function(){
  // 页面渲染完成
 },
 onShow:function(){
  // 页面显示
 },
 onHide:function(){
  // 页面隐藏
 },
 onUnload:function(){
  // 页面关闭
 }
})

 感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!

Javascript 相关文章推荐
JavaScript 组件之旅(一)分析和设计
Oct 28 Javascript
jQuery EasyUI中对表格进行编辑的实现代码
Jun 10 Javascript
详解参数传递四种形式
Jul 21 Javascript
jquery实现经典的淡入淡出选项卡效果代码
Sep 22 Javascript
详解基于javascript实现的苹果系统底部菜单
Dec 02 Javascript
javascript 显示全局变量与隐式全局变量的区别
Feb 09 Javascript
走进AngularJs之过滤器(filter)详解
Feb 17 Javascript
详解react-router如何实现按需加载
Jun 15 Javascript
Vue+webpack项目基础配置教程
Feb 12 Javascript
8个有意思的JavaScript面试题
Jul 30 Javascript
前端如何实现动画过渡效果
Feb 05 Javascript
JS前端可视化canvas动画原理及其推导实现
Aug 05 Javascript
微信小程序 Storage API实例详解
Oct 02 #Javascript
微信小程序 Video API实例详解
Oct 02 #Javascript
老生常谈JavaScript中的this关键字
Oct 01 #Javascript
ES6新特征数字、数组、字符串
Oct 01 #Javascript
使用PBFunc在Powerbuilder中支付宝当面付款功能
Oct 01 #Javascript
ros::spin() 和 ros::spinOnce()函数的区别及详解
Oct 01 #Javascript
javascript代码调试之console.log 用法图文详解
Sep 30 #Javascript
You might like
php中去除所有js,html,css代码
2010/10/12 PHP
php笔记之:有规律大文件的读取与写入的分析
2013/04/26 PHP
php5.4以上版本GBK编码下htmlspecialchars输出为空问题解决方法汇总
2015/04/03 PHP
PHP使用mongoclient简单操作mongodb数据库示例
2019/02/08 PHP
jquery插件之文字间歇自动向上滚动效果代码
2016/02/25 Javascript
使用jQuery监听扫码枪输入并禁止手动输入的实现方法(推荐)
2017/03/21 jQuery
Omi v1.0.2发布正式支持传递javascript表达式
2017/03/21 Javascript
详解axios在node.js中的post使用
2017/04/27 Javascript
深入理解Webpack 中路径的配置
2017/06/17 Javascript
vue使用中的内存泄漏【推荐】
2018/07/10 Javascript
python实现人人网登录示例分享
2014/01/19 Python
Python3导入自定义模块的三种方法详解
2018/04/13 Python
python数字图像处理之骨架提取与分水岭算法
2018/04/27 Python
Python实现的当前时间多加一天、一小时、一分钟操作示例
2018/05/21 Python
python3学习之Splash的安装与实例教程
2018/07/09 Python
Python中正则表达式的用法总结
2019/02/22 Python
搞定这套Python爬虫面试题(面试会so easy)
2019/04/03 Python
Dlib+OpenCV深度学习人脸识别的方法示例
2019/05/14 Python
如何通过安装HomeBrew来安装Python3
2020/12/23 Python
Python接口自动化系列之unittest结合ddt的使用教程详解
2021/02/23 Python
eBay澳大利亚站:eBay.com.au
2018/02/02 全球购物
SQL里面如何插入自动增长序列号字段
2012/03/29 面试题
自我鉴定思想方面
2013/10/07 职场文书
校园新闻广播稿
2014/01/10 职场文书
总会计师岗位职责
2014/02/19 职场文书
医德医风自我评价
2014/09/19 职场文书
小学教师2014年度工作总结
2014/12/03 职场文书
青年岗位能手事迹材料
2014/12/23 职场文书
城管个人总结
2015/02/28 职场文书
叶问观后感
2015/06/15 职场文书
2015年环卫处个人工作总结
2015/07/27 职场文书
护士爱岗敬业心得体会
2016/01/25 职场文书
话题作文之呼唤
2019/12/18 职场文书
为什么node.js不适合大型项目
2021/04/28 Javascript
python中opencv实现图片文本倾斜校正
2021/06/11 Python
Redis性能监控的实现
2021/07/09 Redis