效果:我在手机上打开微信小程序,自动显示出我当前所在的地理位置:

具体步骤:

1. 使用微信jssdk提供的getLocation API拿到经纬度;

2. 调用高德地图的api使用经纬度去换取地址的文字描述。


wx.ready(() => {wx.getLocation({type: "gcj02",success: function(res) {var location ="&location=" + res.longitude + "," + res.latitude;ReservationService.getGeocode(location).then(response => {if (response.data.status === "1" &&response.data.info === "OK") {self.country =response.data.regeocode.addressComponent.country;self.city = response.data.regeocode.addressComponent.city;var express ="/" +self.country +"|" +response.data.regeocode.addressComponent.province +"|" +self.city +"|" +response.data.regeocode.addressComponent.district +"|" +response.data.regeocode.addressComponent.township +"/g";self.address = response.data.regeocode.formatted_address.replace(eval(express),"");} else {// get location error, plz input addressalert("无法获取地址信息,请稍后再试");}});}});

ReservationService.getGeocode的实现:

getGeocode(location) {

const key = '此处填入您高德地图app的key';

return axios.post('https://restapi.amap.com/v3/geocode/regeo?key=' + key + location);

}

看下面一个使用高德地图API将经纬度转换成文字描述的地址的例子,使用postman发送请求:

API响应:


{"status": "1","regeocode": {"addressComponent": {"city": [],"province": "北京市","adcode": "110101","district": "东城区","towncode": "110101001000","streetNumber": {"number": "44号","location": "116.39795,39.9097239","direction": "东北","distance": "117.874","street": "广场东侧路"},"country": "中国","township": "东华门街道","businessAreas": [{"location": "116.3998109423077,39.90717459615385","name": "天安门","id": "110101"},{"location": "116.39981058278138,39.92383706953642","name": "景山","id": "110101"},{"location": "116.4118112683418,39.91461494422115","name": "王府井","id": "110101"}],"building": {"name": "天安门","type": "风景名胜;风景名胜相关;旅游景点"},"neighborhood": {"name": [],"type": []},"citycode": "010"},"formatted_address": "北京市东城区东华门街道天安门"},"info": "OK","infocode": "10000"}

要获取更多Jerry的原创文章,请关注公众号"汪子熙":

转载于:https://www.cnblogs.com/sap-jerry/p/9831508.html

在微信小程序里自动获得当前手机所在的经纬度并转换成地址相关推荐

  1. 如何刷新微信服务器小程序版本,微信小程序版本自动更新

    最近在做一个小程序每次更新版本之后都需要删除小程序,再次扫码进入才可以看到新版本,接下来吾爱编程为大家介绍一下微信小程序版本自动更新的方法,有需要的小伙伴可以参考一下: 1.启动机制: (1).热启动 ...

  2. 微信小程序里的block

    1 并不是一个组件,它仅仅是一个包装元素,不会在页面中做任何渲染,只接受控制属性. 2 因为wx:if是一个控制属性,需要将它添加到一个标签上.如果要一次性判断多个组件标签,可以使用 标签将多个组件包 ...

  3. 微信小程序:自动采集头像大全微信小程序源码

    这是一款以头像为主的一款微信小程序源码 该小程序内包含了各种分类,各种样式都有 可以说是目前最全的一款头像小程序源码 五大分类情侣,女生,男生,卡通,风景 每大分类下面都有N个小分类,每个小分类下面有 ...

  4. 微信小程序上传图片到html,在微信小程序里上传图片

    在微信小程序里上传图片. 上传图片 JS//index.js Page({ data:{ tempFilePaths:[], uploadLinks:[], }, uploadImg() { var  ...

  5. 微信小程序之自动跳转页面

    微信小程序之自动跳转页面: 页面.wxml文件中定义桌面的程序: <scroll-view> < image src="../../images/first.png&quo ...

  6. 微信小程序版本自动更新用户感知提示方案总结

    微信小程序版本自动更新用户感知提示方案总结 需求背景 最近基于uniapp开发微信小程序上线后,在迭代版本后期望自动更新提示. 使感知. 解决方案 使用全局唯一的对象: updateManager. ...

  7. 微信小程序:设置字体跟随手机系统

    小程序开发:全局设置跟随手机系统默认字体 前言 最近在开发一款微信小程序,发现字体不是跟随手机系统设置的字体,这样对用户很不友好,通过下面这行代码,就可以将页面的字体搞成系统默认字体了. 提示:要设置 ...

  8. 微信小程序上传后 进行性手机扫码阅览 发现白屏的解决

    目录 问题: 微信小程序上传后 进行性手机扫码阅览 发现白屏的解决 1.上传时没有勾选保护 2.请求的域名没有配置 问题: 微信小程序上传后 进行性手机扫码阅览 发现白屏的解决 1.上传时没有勾选保护 ...

  9. 微信小程序外卖点餐系统酒店点菜系统加PHP后端接口地址完整项目thinkphp5.1外卖小程序

    微信小程序开发,这是一套,微信小程序外卖点餐系统酒店点菜系统加PHP后端接口地址完整项目. 前端打开授权登录机制,选择食物,加入购物车,堂食或打包,支付. 很适合初学者学习,微信小程序 开发者V:ha ...

最新文章

  1. CISCO 路由器(2)
  2. 比较MongoDB在公有云上的性能:AWS、Azure和Digital Ocean
  3. 意念打字、梦境重现如何成真,张钹、李路明等知名专家共话脑机接口最新进展 | 首届脑科学开放日...
  4. vivo的android是什么手机图片,vivo iQOO配置好不好 vivo iQOO手机参数和外观图赏
  5. Redis学习之复制(三)
  6. Nginx的异步非阻塞
  7. ABP Framework 5.0 RC.1 新特性和变更说明
  8. 描述符演练-01-完善代码,使得对象添加属性的行为可以成功
  9. android 导入modoule_android studio如何创建一个子module并引入主工程
  10. JAVA---事件适配器----用内部类,匿名类实现事件处理
  11. 【Linux】【Services】【Cache】使用Sentinel搭建高可用Redis
  12. OpenGL加载纹理glGenTextures——内存优化(OpenGL内存泄漏)
  13. C陷阱与缺陷阅读笔记(上)
  14. npm是什么,用来干嘛的
  15. 以非泛型方式调用泛型方法
  16. 慕课软件工程(第二十章.ISO9000标准)
  17. GAMES101-现代计算机图形学入门-闫令琪 - lecture11 几何3(Geometry 3) - 课后笔记
  18. C++异常机制的实现方式和开销分析
  19. MyBatisPlus 查询selectOne方法
  20. tf.expand_dims用法详解

热门文章

  1. 小区的足球场地实地拍摄
  2. php ajax轮询推送,[PHP]PHP+AJAX实现轮询代码
  3. DOM方式动态加载数据
  4. 洛谷 P1101 单词方阵
  5. 在路上---学习篇(一)Python 数据结构和算法 (4) --希尔排序、归并排序
  6. Node.js Express 框架 GET方法
  7. javaweb学习总结(三十七)——获得MySQL数据库自动生成的主键
  8. centos 6.5 配置LDAP服务器+客户端!
  9. SQL存储过程rollback tran的使用
  10. Red Hat Enterprise Linux 5.4安装GCC