微信小程序 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子类用Object.getPrototypeOf去调用父类方法解析
Dec 05 Javascript
jquery获取元素索引值index()示例
Feb 13 Javascript
鼠标左键单击冲突的问题解决方法(防止冒泡)
May 14 Javascript
在JS数组特定索引处指定位置插入元素
Jul 27 Javascript
javascript使用数组的push方法完成快速排序
Sep 15 Javascript
a标签的href与onclick事件的区别详解
Nov 12 Javascript
jQuery中parentsUntil()方法用法实例
Jan 07 Javascript
jQuery实现可编辑的表格实例讲解(2)
Sep 17 Javascript
使用jQuery制作基础的Web图片轮播效果
Apr 22 Javascript
JavaScript:Date类型全面解析
May 19 Javascript
JS事件添加和移出的兼容写法示例
Jun 20 Javascript
Vue.js每天必学之内部响应式原理探究
Sep 07 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
dedecms系统常用术语汇总
2007/04/03 PHP
第4章 数据处理-php字符串的处理-郑阿奇(续)
2011/07/04 PHP
护卫神php套件 php版本升级方法(php5.5.24)
2015/05/10 PHP
javascript 日期时间函数(经典+完善+实用)
2009/05/27 Javascript
style、 currentStyle、 runtimeStyle区别分析
2010/08/01 Javascript
使用jQuery模板来展现json数据的代码
2010/10/22 Javascript
jquery remove方法应用详解
2012/11/22 Javascript
使用javascript实现ListBox左右全选,单选,多选,全请
2013/11/07 Javascript
laytpl 精致巧妙的JavaScript模板引擎
2014/08/29 Javascript
Jquery实现仿京东商城省市联动菜单
2015/11/19 Javascript
学习JavaScript设计模式(接口)
2015/11/26 Javascript
高性能JavaScript循环语句和条件语句
2016/01/20 Javascript
vue.js实现条件渲染的实例代码
2017/06/22 Javascript
以BootStrap Tab为例写一个前端组件
2017/07/25 Javascript
微信小程序实现折叠面板
2018/01/31 Javascript
Vue js 的生命周期(看了就懂)(推荐)
2019/03/29 Javascript
JavaScript如何把两个数组对象合并过程解析
2019/10/10 Javascript
vue中的mescroll搜索运用及各种填坑处理
2019/10/30 Javascript
Python检测网站链接是否已存在
2016/04/07 Python
Python实现的朴素贝叶斯算法经典示例【测试可用】
2018/06/13 Python
python 将print输出的内容保存到txt文件中
2018/07/17 Python
Flask框架使用DBUtils模块连接数据库操作示例
2018/07/20 Python
PyQt弹出式对话框的常用方法及标准按钮类型
2019/02/27 Python
Python使用Pickle模块进行数据保存和读取的讲解
2019/04/09 Python
python opencv 实现对图像边缘扩充
2020/01/19 Python
matplotlib 三维图表绘制方法简介
2020/09/20 Python
Python __slots__的使用方法
2020/11/15 Python
Python实现Word文档转换Markdown的示例
2020/12/22 Python
证券期货行业个人的自我评价
2013/12/26 职场文书
大学生毕业鉴定
2014/01/31 职场文书
《果园机器人》教学反思
2014/04/13 职场文书
学校节能减排方案
2014/06/13 职场文书
2015年度质量工作总结报告
2015/04/27 职场文书
城南旧事电影观后感
2015/06/16 职场文书
学术会议领导致辞
2015/07/29 职场文书
FP-growth算法发现频繁项集——发现频繁项集
2021/06/24 Python