微信小程序实现自动定位功能


Posted in Javascript onOctober 31, 2018

本文实例为大家分享了微信小程序实现自动定位的具体代码,供大家参考,具体内容如下

使用了腾讯地图提供的免费api:

需要引入一个js文件:下载地址

js代码:

// 引入SDK核心类
var QQMapWX = require('../../libs/qqmap-wx-jssdk.js');
var qqmap = new QQMapWX({
//在腾讯地图开放平台申请密钥 http://lbs.qq.com/mykey.html
 key: 'your KEY'
});
Page({
 data: {
 myLatitude: "",
 myLongitude: "",
 myAddress: ""
 },
 onLoad: function(){
 var that = this
 //用微信提供的api获取经纬度
 wx.getLocation({
  type: 'wgs84',
  success: function(res){
  that.setData({myLatitude: res.latitude, myLongitude: res.longitude})
  //用腾讯地图的api,根据经纬度获取城市
  qqmap.reverseGeocoder({
   location: {
   latitude: that.data.myLatitude,
   longitude: that.data.myLongitude
   },
   success: function (res) {
   console.log(res)
   var a = res.result.address_component
   //获取市和区(区可能为空)
   that.setData({myAddress: a.city + a.district})
   //控制台输出结果
   console.log(that.data.myAddress)
   }
  })
  }
 })
 } 
})

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript innerHTML、outerHTML、innerText、outerText的区别
Nov 24 Javascript
javascript demo 基本技巧
Dec 18 Javascript
完美解决AJAX跨域问题
Nov 01 Javascript
js动态移动滚动条至底部示例代码
Apr 24 Javascript
JS实现黑客帝国文字下落效果
Sep 01 Javascript
js精准的倒计时函数分享
Jun 29 Javascript
javascript表单正则应用
Feb 04 Javascript
原生js实现打字动画游戏
Feb 04 Javascript
给Easyui-Datebox设置隐藏或者不可用的解决方法
May 26 Javascript
基于Vue过渡状态实例讲解
Sep 14 Javascript
jQuery实现遍历XML节点和属性的方法示例
Apr 29 jQuery
详解微信小程序之提高应用速度小技巧
Jan 07 Javascript
iview在vue-cli3如何按需加载的方法
Oct 31 #Javascript
jQuery+PHP实现上传裁剪图片
Jun 29 #jQuery
vue+iview 实现可编辑表格的示例代码
Oct 31 #Javascript
详解vue 项目白屏解决方案
Oct 31 #Javascript
微信小程序ibeacon三点定位详解
Oct 31 #Javascript
小程序获取周围IBeacon设备的方法
Oct 31 #Javascript
详解js删除数组中的指定元素
Oct 31 #Javascript
You might like
让你同时上传 1000 个文件 (一)
2006/10/09 PHP
PHP5 操作MySQL数据库基础代码
2009/09/29 PHP
php+mysql不用递归实现的无限级分类实例(非递归)
2014/07/08 PHP
Yii2.0多文件上传实例说明
2017/07/24 PHP
JS 图片缩放效果代码
2010/06/09 Javascript
js中setTimeout()与clearTimeout()用法实例浅析
2015/05/12 Javascript
JS实现点击按钮控制Div变宽、增高及调整背景色的方法
2015/08/05 Javascript
jQuery的Ajax用户认证和注册技术实例教程(附demo源码)
2015/12/08 Javascript
谈谈因Vue.js引发关于getter和setter的思考
2016/12/02 Javascript
利用jquery正则表达式在页面验证url网址输入是否正确
2017/04/04 jQuery
nodejs个人博客开发第四步 数据模型
2017/04/12 NodeJs
Vue组件选项props实例详解
2017/08/18 Javascript
js设置默认时间跨度过程详解
2019/07/17 Javascript
微信小程序实现写入读取缓存详解
2019/08/30 Javascript
解决axios post 后端无法接收数据的问题
2019/10/29 Javascript
nodejs实现百度舆情接口应用示例
2020/02/07 NodeJs
vue学习笔记之Vue中css动画原理简单示例
2020/02/29 Javascript
Vue的data、computed、watch源码浅谈
2020/04/04 Javascript
通过实例了解JS执行上下文运行原理
2020/06/17 Javascript
python网络编程之UDP通信实例(含服务器端、客户端、UDP广播例子)
2014/04/25 Python
python数据结构树和二叉树简介
2014/04/29 Python
Python之inspect模块实现获取加载模块路径的方法
2018/10/16 Python
python+webdriver自动化环境搭建步骤详解
2019/06/03 Python
python实现简单贪吃蛇游戏
2020/09/29 Python
CSS3教程(2):网页边框半径和网页圆角
2009/04/02 HTML / CSS
印度最大的时尚购物网站:Myntra
2018/09/13 全球购物
澳大利亚玩具剧场:Toy Playhouse
2019/03/03 全球购物
super()与this()的区别
2016/01/17 面试题
长安大学毕业生自我鉴定
2014/01/17 职场文书
大学生咖啡店创业计划书
2014/01/21 职场文书
致标枪运动员广播稿
2014/02/06 职场文书
交通安全标语
2014/06/06 职场文书
幼儿园大班教师个人工作总结
2015/02/05 职场文书
思想品德课教学反思
2016/02/24 职场文书
《钢铁是怎样炼成的》高中读后感
2019/08/07 职场文书
JavaScript实现音乐播放器
2022/08/14 Javascript