微信小程序如何获取地址


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 相关文章推荐
关于Blog顶部的滚动导航条代码
Sep 25 Javascript
解决表单中第一个非隐藏的元素获得焦点的一个方案
Oct 26 Javascript
Javascript跨域请求的4种解决方式
Mar 17 Javascript
JavaScript学习笔记之JS对象
Jan 22 Javascript
jQuery判断指定id的对象是否存在的方法
May 22 Javascript
js实现全国省份城市级联下拉菜单效果代码
Sep 07 Javascript
javascript设计模式--策略模式之输入验证
Nov 27 Javascript
bootstrap——bootstrapTable实现隐藏列的示例
Jan 14 Javascript
Vue刷新修改页面中数据的方法
Sep 16 Javascript
基于jquery实现九宫格拼图小游戏
Nov 30 jQuery
ES6知识点整理之模块化的应用详解
Apr 15 Javascript
axios封装,使用拦截器统一处理接口,超详细的教程(推荐)
May 02 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+redis在实际项目中HTTP 500: Internal Server Error故障排除
2017/02/05 PHP
PHP生成短网址的思路以及实现方法的详解
2019/03/25 PHP
JavaScript 以对象为索引的关联数组
2010/05/19 Javascript
Jquery 切换不同图片示例代码
2013/12/05 Javascript
jQuery获取节点和子节点文本的方法
2014/07/22 Javascript
jQuery 复合选择器应用的几个例子
2014/09/11 Javascript
浅谈Javascript中深复制
2014/12/01 Javascript
JS获取中文拼音首字母并通过拼音首字母快速查找页面内对应中文内容的方法【附demo源码】
2016/08/19 Javascript
Bootstrap学习笔记之环境配置(1)
2016/12/07 Javascript
Node.js 的模块知识汇总
2017/08/16 Javascript
详解vue-meta如何让你更优雅的管理头部标签
2018/01/18 Javascript
js提取中文拼音首字母的封装工具类
2018/03/12 Javascript
vue实现禁止浏览器记住密码功能的示例代码
2021/02/03 Vue.js
[02:49]2018DOTA2亚洲邀请赛主赛事决赛日战况回顾 Mineski鏖战5局夺得辉耀
2018/04/10 DOTA
Python入门篇之文件
2014/10/20 Python
PyCharm使用教程之搭建Python开发环境
2016/06/07 Python
Python 提取dict转换为xml/json/table并输出的实现代码
2016/08/28 Python
python技能之数据导出excel的实例代码
2017/08/11 Python
python之virtualenv的简单使用方法(必看篇)
2017/11/25 Python
11个Python Pandas小技巧让你的工作更高效(附代码实例)
2019/04/30 Python
关于Python 的简单栅格图像边界提取方法
2019/07/05 Python
Django文件存储 自己定制存储系统解析
2019/08/02 Python
Python关于反射的实例代码分享
2020/02/20 Python
Django admin管理工具TabularInline类用法详解
2020/05/14 Python
Python判断变量是否是None写法代码实例
2020/10/09 Python
基于HTML5陀螺仪实现ofo首页眼睛移动效果的示例
2017/07/31 HTML / CSS
车工岗位职责
2013/11/26 职场文书
三好学生自我鉴定
2013/12/17 职场文书
乔迁之喜主持词
2014/03/27 职场文书
保护环境建议书300字
2014/05/13 职场文书
小学教师培训方案
2014/06/09 职场文书
企业安全生产月活动总结
2014/07/05 职场文书
房产授权委托书范本
2014/09/22 职场文书
领导班子个人查摆问题对照检查材料
2014/10/02 职场文书
2015年乡镇信访工作总结
2015/04/07 职场文书
《亲亲我的妈妈》观后感(3篇)
2019/09/26 职场文书