微信小程序 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 相关文章推荐
js 实现无干扰阴影效果 简单好用(附文件下载)
Dec 27 Javascript
js innerHTML 改变div内容的方法
Aug 03 Javascript
jquery获取html元素的绝对位置和相对位置的方法
Jun 20 Javascript
JavaScript中的DSL元编程介绍
Mar 15 Javascript
在线所见即所得HTML编辑器的实现原理浅析
Apr 25 Javascript
基于jquery实现省市区三级联动效果
Dec 25 Javascript
Angularjs中controller的三种写法分享
Sep 21 Javascript
jQuery Ajax全解析
Feb 13 Javascript
jQuery异步提交表单实例
May 30 jQuery
CSS3结合jQuery实现动画效果及回调函数的实例
Dec 27 jQuery
HTML+JavaScript实现扫雷小游戏
Sep 30 Javascript
原生JS实现音乐播放器的示例代码
Feb 25 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
Get或Post提交值的非法数据处理
2006/10/09 PHP
PHP静态类
2006/11/25 PHP
php学习之运算符相关概念
2011/06/09 PHP
解析thinkphp的左右值无限分类
2013/06/20 PHP
基于php的微信公众平台开发入门实例
2015/04/15 PHP
php的闭包(Closure)匿名函数初探
2016/02/14 PHP
php while循环控制的简单实例
2016/05/30 PHP
JavaScript入门教程(10) 认识其他对象
2009/01/31 Javascript
js实现运动logo图片效果及运动元素对象sportBox使用方法
2012/12/25 Javascript
浅谈JavaScript function函数种类
2014/12/29 Javascript
jquery实现红色竖向多级向右展开的导航菜单效果
2015/08/31 Javascript
jQuery实现图片预加载效果
2015/11/27 Javascript
BootStrap入门教程(三)之响应式原理
2016/09/19 Javascript
jQuery事件用法详解
2016/10/06 Javascript
jQuery加密密码到cookie的实现代码
2017/04/18 jQuery
10种检测Python程序运行时间、CPU和内存占用的方法
2015/04/01 Python
微信小程序跳一跳游戏 python脚本跳一跳刷高分技巧
2018/01/04 Python
python3.6+django2.0开发一套学员管理系统
2018/03/03 Python
Python实现ping指定IP的示例
2018/06/04 Python
python实现高斯判别分析算法的例子
2019/12/09 Python
PYQT5开启多个线程和窗口,多线程与多窗口的交互实例
2019/12/13 Python
Python气泡提示与标签的实现
2020/04/01 Python
Python运算符+与+=的方法实例
2021/02/18 Python
python爬虫scrapy框架之增量式爬虫的示例代码
2021/02/26 Python
韩国CJ食品专卖网:CJonmart
2016/09/11 全球购物
PurCotton全棉时代官网:100%天然棉花生产的生活护理用品
2016/11/18 全球购物
荷兰网上买鞋:MooieSchoenen.nl
2017/09/12 全球购物
汽车专业毕业生自荐信
2013/11/03 职场文书
倡议书范文
2014/04/16 职场文书
市政工程技术专业自荐书
2014/07/06 职场文书
老员工辞职信范文
2015/05/12 职场文书
考生诚信考试承诺书(2016版)
2016/03/25 职场文书
《思路决定出路》读后感3篇
2019/12/11 职场文书
世界十大评分最高的动漫,CLANNAD上榜,第八赚足人们眼泪
2022/03/18 日漫
Python万能模板案例之matplotlib绘制直方图的基本配置
2022/04/13 Python
django项目、vue项目部署云服务器的详细过程
2022/07/23 Servers