微信小程序如何获取地址


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 相关文章推荐
硬盘浏览程序,保存成网页格式便可使用
Dec 03 Javascript
javascript函数以及基础写法100多条实用整理
Jan 13 Javascript
用IE重起计算机或者关机的示例代码
Mar 10 Javascript
JS 打印功能代码可实现打印预览、打印设置等
Oct 31 Javascript
Jquery中Event对象属性小结
Feb 27 Javascript
简述AngularJS的控制器的使用
Jun 16 Javascript
Bootstrap实现登录校验表单(带验证码)
Jun 23 Javascript
详解js的异步编程技术的方法
Feb 09 Javascript
微信小程序动态显示项目倒计时效果
Jun 13 Javascript
bootstrap daterangepicker双日历时间段选择控件详解
Jun 15 Javascript
jQuery使用zTree插件实现可拖拽的树示例
Sep 23 jQuery
JavaScript 实现HTML DOM增删改查操作的常见方法详解
Jan 04 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
mysql limit查询优化分析
2008/11/12 PHP
ThinkPHP缓存方法S()概述
2014/06/13 PHP
php之可变函数的实例详解
2017/09/13 PHP
php微信扫码支付 php公众号支付
2019/03/24 PHP
javascript prototype,executing,context,closure
2008/12/24 Javascript
javascript 日历提醒系统( 兼容所有浏览器 )
2009/04/07 Javascript
jQuery实现页面滚动时层智能浮动定位实例探讨
2013/03/29 Javascript
面向对象继承实例(a如何继承b问题)(自写)
2013/07/01 Javascript
jquery实现可拖动DIV自定义保存到数据的实例
2013/11/20 Javascript
javascript模拟命名空间
2015/04/17 Javascript
9个让JavaScript调试更简单的Console命令
2016/11/14 Javascript
详解Angular的双向数据绑定(MV-VM)
2016/12/26 Javascript
Node.js对MongoDB数据库实现模糊查询的方法
2017/05/03 Javascript
基于JS递归函数细化认识及实用实例(推荐)
2017/08/07 Javascript
详解在React里使用&quot;Vuex&quot;
2018/04/02 Javascript
vue-router beforeEach跳转路由验证用户登录状态
2018/12/26 Javascript
Django+vue跨域问题解决的详细步骤
2019/01/20 Javascript
[01:38]2018DOTA2亚洲邀请赛主赛事第二日现场采访 神秘商人痛陈生计不易
2018/04/05 DOTA
Python的Django框架中的select_related函数对QuerySet 查询的优化
2015/04/01 Python
进一步了解Python中的XML 工具
2015/04/13 Python
Python3 循环语句(for、while、break、range等)
2017/11/20 Python
Python与人工神经网络:使用神经网络识别手写图像介绍
2017/12/19 Python
Python实现查找字符串数组最长公共前缀示例
2019/03/27 Python
python对输出的奇数偶数排序实例代码
2020/12/04 Python
分享一个python的aes加密代码
2020/12/22 Python
matplotlib bar()实现多组数据并列柱状图通用简便创建方法
2021/02/24 Python
HTML5制作3D爱心动画教程 献给女友浪漫的礼物
2014/11/05 HTML / CSS
英国剑桥包中文官网:The Cambridge Satchel Company中国
2018/11/06 全球购物
优秀幼教自荐信
2014/02/03 职场文书
电气自动化个人求职信范文
2014/02/03 职场文书
批评与自我批评材料
2014/02/15 职场文书
2014保险公司内勤工作总结
2014/12/16 职场文书
2015年新农合工作总结
2015/03/30 职场文书
小孩不笨观后感
2015/06/03 职场文书
Python字符串的转义字符
2022/04/07 Python
Golang 入门 之url 包
2022/05/04 Golang