微信小程序如何获取地址


Posted in Javascript onDecember 24, 2019

本文实例为大家分享了微信小程序获取地址的具体代码,供大家参考,具体内容如下

微信小程序如何获取地址

wxml

<map id="map" longitude="{{data.longitude}}" latitude="{{data.latitude}}" scale="14" markers="{{markers}}" polyline="{{polyline}}" show-location style="width: 100%; height: 500px;"></map>
<text>
 {{data.longitude}}
 {{data.latitude}}
 {{address}}
</text>
<!-- longitude 中心经度 -->
<!-- latitude 中心纬度 -->
<!-- scale 缩放级别,取值范围为3-20 -->
<!-- markers 标记点 -->

js

var QQMapWX = require('../js/qqmap-wx-jssdk.js');
var qqmapsdk;
Page({
 data:{
  data:"",
  str:"",
  address:""
 },
 onLoad: function () {
  let _this = this;
  // 实例化API核心类
  qqmapsdk = new QQMapWX({
   key: 'key'
  });
  // Promise 获取地址
  let gets = new Promise((resolve, reject) => {
   wx.getLocation({
    type: 'wgs84',
    success:resolve
   })
  }).then(function(res){
   console.log(res)
   _this.setData({
    data:res
   })
  })

  // 正常方式获取地址
  wx.getLocation({
   type: 'wgs84',
   success:function(res){
    _this.setData({
     str: _this.res
    })
    console.log(res)
    var demo = new QQMapWX({
     key: 'key'
    });
    // 解析地址
    demo.reverseGeocoder({//地址解析
     location: {
      latitude: res.latitude,
      longitude: res.longitude
     },
     success: function (res) {//转为具体地址
      console.log(res);
      //获得地址
      _this.setData({
       address: res.result.address
      })
     },
     fail: function (res) {
      console.log(res);
     }
    });
   }
  })
 },

为大家推荐现在关注度比较高的微信小程序教程一篇:《微信小程序开发教程》小编为大家精心整理的,希望喜欢。

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

Javascript 相关文章推荐
常用参考资料(手册)下载或者链接
Jul 22 Javascript
在Javascript中定义对象类别
Dec 22 Javascript
获取焦点时,利用js定时器设定时间执行动作
Apr 02 Javascript
Jquery知识点一 Jquery的ready和Dom的onload的区别
Jan 15 Javascript
关于jQuery中的each方法(jQuery到底干了什么)
Mar 05 Javascript
如何调试异步加载页面里包含的js文件
Oct 30 Javascript
JS基于clipBoard.js插件实现剪切、复制、粘贴
May 03 Javascript
BootStrap3学习笔记(一)之网格系统
May 20 Javascript
利用canvas实现的加载动画效果实例代码
Jul 05 Javascript
基于Require.js使用方法(总结)
Oct 26 Javascript
javaScript之split与join的区别(详解)
Nov 08 Javascript
vue-star评星组件开发实例
Mar 01 Javascript
浅析vue-router中params和query的区别
Dec 24 #Javascript
JavaScript实现英语单词题库
Dec 24 #Javascript
iSlider手机端图片滑动切换插件使用详解
Dec 24 #Javascript
微信小程序自定义模态弹窗组件详解
Dec 24 #Javascript
js实现鼠标点击页面弹出自定义文字效果
Dec 24 #Javascript
javascript实现鼠标点击生成文字特效
Dec 24 #Javascript
Javascript实现鼠标点击冒泡特效
Dec 24 #Javascript
You might like
php获取$_POST同名参数数组的实现介绍
2013/06/30 PHP
php多层数组与对象的转换实例代码
2013/08/05 PHP
PHP基于php_imagick_st-Q8.dll实现JPG合成GIF图片的方法
2014/07/11 PHP
PHP实现将视频转成MP4并获取视频预览图的方法
2015/03/12 PHP
Laravel中如何增加自定义全局函数详解
2017/05/09 PHP
PHP+Redis 消息队列 实现高并发下注册人数统计的实例
2018/01/29 PHP
Thinkphp5框架使用validate实现验证功能的方法
2019/08/27 PHP
laravel框架使用FormRequest进行表单验证,验证异常返回JSON操作示例
2020/02/18 PHP
写出更好的JavaScript程序之undefined篇(中)
2009/11/23 Javascript
javascript面向对象的方式实现的弹出层效果代码
2010/01/28 Javascript
jquery jqPlot API 中文使用教程(非常强大的图表工具)
2011/08/15 Javascript
简单几行JS Code实现IE邮件转发新浪微博
2013/07/03 Javascript
jQuery如何实现点击页面获得当前点击元素的id或其他信息
2014/01/09 Javascript
javascript获取本机操作系统类型的方法
2015/08/13 Javascript
详解Vue-cli webpack移动端自动化构建rem问题
2018/04/07 Javascript
JavaScript类的继承方法小结【组合继承分析】
2018/07/11 Javascript
详解vue-cli官方脚手架配置
2018/07/20 Javascript
JavaScript设计模式之单例模式原理与用法实例分析
2018/07/26 Javascript
javascript数据类型中的一些小知识点(推荐)
2019/04/18 Javascript
ES6 Array常用扩展的应用实例分析
2019/06/26 Javascript
javascript实现一款好看的秒表计时器
2020/09/05 Javascript
jQuery实现手风琴特效
2021/01/11 jQuery
[02:28]PWL开团时刻DAY3——Ink Ice与DeMonsTer之间的勾心斗角
2020/11/03 DOTA
python bmp转换为jpg 并删除原图的方法
2018/10/25 Python
详解python 破解网站反爬虫的两种简单方法
2020/02/09 Python
Python3读写Excel文件(使用xlrd,xlsxwriter,openpyxl3种方式读写实例与优劣)
2020/02/13 Python
环境科学毕业生自荐信
2013/11/21 职场文书
《晏子使楚》教学反思
2014/02/08 职场文书
员工三分钟演讲稿
2014/08/19 职场文书
如何写股份合作协议书
2014/09/11 职场文书
2014年合同管理工作总结
2014/12/02 职场文书
党员干部廉洁自律承诺书
2015/04/28 职场文书
医院病假条范文
2015/08/17 职场文书
大学生创业,为什么都会选择快餐饮?
2019/08/08 职场文书
从贫穷到富有,是知识技能和学习力的差别
2019/08/20 职场文书
nginx处理http请求实现过程解析
2021/03/31 Servers