首先说一下,我微信自带map的api中并没有相关接口可调用。文中的方法建立于高德地图。(顺便吐槽,微信开发文档相比支付宝家的显得好烂!)

最近做项目用到地图定位相关的需求,为了搞定需求看了下相关的文档。最后选择高德地图小程序api,腾讯、百度地图应该也可以并且相似但是我没有深入研究。

首先看到的是逆地理编码的api,看到注释不免小小的兴奋了一下。

但是看到了api,瞬间感觉不和谐,指定位置在哪呢?怎么传入经纬度?

最后研究高德插件的js文件的方法,提取出了相关方法:
  1. AMapWX.prototype.getRegeo = function(a) {
  2. function c(c) {
  3. var d = b.requestConfig;
  4. wx.request({
  5. url: "https://restapi.amap.com/v3/geocode/regeo",
  6. data: {
  7. key: b.key,
  8. location: c,
  9. extensions: "all",
  10. s: d.s,
  11. platform: d.platform,
  12. appname: b.key,
  13. sdkversion: d.sdkversion,
  14. logversion: d.logversion
  15. },
  16. method: "GET",
  17. header: {
  18. "content-type": "application/json"
  19. },
  20. success: function(b) {
  21. var d, e, f, g, h, i, j, k, l;
  22. b.data.status && "1" == b.data.status ? (d = b.data.regeocode, e = d.addressComponent, f = [], g = "", d && d.roads[0] && d.roads[0].name && (g = d.roads[0].name + "附近"), h = c.split(",")[0], i = c.split(",")[1], d.pois && d.pois[0] && (g = d.pois[0].name + "附近", j = d.pois[0].location, j && (h = parseFloat(j.split(",")[0]), i = parseFloat(j.split(",")[1]))), e.provice && f.push(e.provice), e.city && f.push(e.city), e.district && f.push(e.district), e.streetNumber && e.streetNumber.street && e.streetNumber.number ? (f.push(e.streetNumber.street), f.push(e.streetNumber.number)) : (k = "", d && d.roads[0] && d.roads[0].name && (k = d.roads[0].name), f.push(k)), f = f.join(""), l = [{
  23. iconPath: a.iconPath,
  24. width: a.iconWidth,
  25. height: a.iconHeight,
  26. name: f,
  27. desc: g,
  28. longitude: h,
  29. latitude: i,
  30. id: 0,
  31. regeocodeData: d
  32. }], a.success(l)) : a.fail({
  33. errCode: b.data.infocode,
  34. errMsg: b.data.info
  35. })
  36. },
  37. fail: function(b) {
  38. a.fail({
  39. errCode: "0",
  40. errMsg: b.errMsg || ""
  41. })
  42. }
  43. })
  44. }
  45. var b = this;
  46. a.location ? c(a.location) : b.getWxLocation(a, function(a) {
  47. c(a)
  48. })
  49. }
提取出的方法如下
  1. wx.request({
  2. url: 'https://restapi.amap.com/v3/geocode/regeo',
  3. data: {
  4. key: key,
  5. location: that.data.longitude + "," + that.data.latitude ,
  6. extensions:"all",
  7. s:"rsx",
  8. sdkversion:"sdkversion",
  9. logversion:"logversion"
  10. },
  11. success: function (res) {
  12. that.setData({
  13. textData: {
  14. name: res.data.regeocode.pois[0].name,
  15. desc: res.data.regeocode.formatted_address
  16. }
  17. })
  18. console.log(JSON.stringify(res.data.regeocode.formatted_address));
  19. },
  20. fail: function (res) {
  21. }
  22. })

   

   

高德地图demo地址

   

   

   

友情链接:

技术博客        简书主页

微信小程序地图之逆地理编码的更多相关文章

  1. 微信小程序--地图上添加图片

    如何在微信小程序地图添加上,添加图片? 在微信小程序中,地图的层级最高,所以我们没有办法,通过定位,在地图上添加图片等信息; 处理办法: 添加控件:controls; 其中有个属性position,进 ...

  2. 微信小程序地图开发总结

    最近在做一个微信小程序地图插件,通过传入起始位置名称和经纬度信息,就可以跳转到路线规划插件页面中,在该页面中,可以根据起始位置查询自驾,公共交通,步行等方式的路线信息,并且在地图上显示路线信息,在这个 ...

  3. 微信小程序--地图组件与api-模拟器上返回的scale 与真机上不同--bindregionchange触发图标一直闪现问题

    场景:根据地理定位获取不同地区的充电桩位置,要求 1.平移的时候,跟随坐标变化展示不同区域的坐标点信息 2.不同的缩放等级,14以下,展示聚合点数据,14以上,展示真正的站点信息: 3.点击聚合点的时 ...

  4. 微信小程序地图总结

    小程序官方的 map地图说明文档已经非常详细了,但是鉴于如果没有一个合适的使用场景,对于刚接触 map 的初级开发,看着这些繁杂又贼多的属性名和字段,外加急切的开发需求,晕头转向是不可避免的了.接下来 ...

  5. 微信小程序地图控件篇 ---自定义图标被地图覆盖的问题

    今天在做微信小程序的时候遇到这个这样的问题  需要在地图上加个一个自定义的图标控件 类似这样的 刚开始的时候怎图片一直会被地图组件覆盖  ,要怎么解决这个问题  我去翻了下小程序的文档 有个cover ...

  6. 微信小程序 地图地址解析

    1.微信小程序提供了几个方式,引入地图, wx.getLocation(OBJECT) 获取当前的地理位置.速度.当用户离开小程序后,此接口无法调用:当用户点击“显示在聊天顶部”时,此接口可继续调用 ...

  7. 百度地图坐标偏移,微信小程序地图偏移问题,腾讯地图坐标偏移

    解决方案: 如果用百度的地图获取的坐标点,在微信小程序内使用,就会出现偏移 算法(lat和lng是经纬度,球面坐标): To_B是转到百度,To_G是转到GCJ-02(谷歌,高德,腾讯) var TO ...

  8. 微信小程序地图模块

    微信小程序的地图模块官方提供的API比较少,详情请见   官方文档 以下为一个示例                               <!--pages/location/locati ...

  9. 微信小程序——地图

    一:如何标点问题 地图模块需要用标点:官网API里面的wx.createMapContext(mapId, this)接口,且用官网Demo,小程序运行报错此时需要在wxml里面给map标签添加属性m ...

随机推荐

  1. VC++ 6.0 sqlite3 配置、测试

    /************************************************************************************* * VC++6.0 sql ...

  2. CSS元素、边框、背景、列表样式

    一.元素样式 1.width控制元素宽度 2.height控制元素宽度 3.padding控制元素内边距 内容与边框之间的距离 4.margin控制元素外边距 元素边框与其他元素边框之间的距离,如果两 ...

  3. Redis学习笔记-事务控制篇(Centos7)

    一.事务控制 1.简单事务控制 redis可以使用mult命令将之后的命令都存放在队列中,只有使用exec命令时才全部执行. 127.0.0.1:6379> multi OK 127.0.0.1 ...

  4. 在C#中调用Java生成的jar包文件的方法

    C#工程调用Java已生成的jar包步骤如下: 一.使用IKVM.NET组件 首先到IKVM官网(http://www.ikvm.net)下载组件,下载地址:https://sourceforge.n ...

  5. FTP非交互式远程上传文件

    由于项目需要,每月定时上传一份备份文件到远程备份机器. 机器拓扑结构如下: backup机器上启动ftp server,server1和server2分别安装ftp客户端 定时执行脚本如下: uplo ...

  6. odoo 数据库选择的随笔

    odoo 数据库选择的随笔 看到有人讨论 odoo 是否可以使用 SQL Server(MS SQL). 原来 odoo 使用的是 PostgreSQL,PostgreSQL 是很先进的关系性数据库, ...

  7. nginx 正则

    syntax: location [=|~|~*|^~] /uri/ { … }语法:location [=|~|~*|^~] /uri/ { … } 优先级从高到低:=.~ .~*.^~.空 def ...

  8. Phonegap 开发环境搭建

    以Android为例介绍Phonegap开发环境搭建 一. 软件下载 1. JDK 8 下载 http://www.oracle.com/technetwork/java/javase/downloa ...

  9. 微信小程序详解——页面之间的跳转方式【路由】和参数传递

    微信小程序拥有web网页和Application共同的特征,我们的页面都不是孤立存在的,而是通过和其他页面进行交互,来共同完成系统的功能.今天我们来研究小程序页面之间的跳转方式. 1.先导 在Andr ...

  10. JS 奇淫巧技 转

    1. 在 String.prototype.replace 方法中使用 /g 和 /i 标志位 令很多 JavaScript 初学者意外的是,字符串的 replace 方法并不会 替换所有匹配的子串— ...