1、微信小程序提供了几个方式,引入地图,

wx.getLocation(OBJECT)
获取当前的地理位置、速度。当用户离开小程序后,此接口无法调用;当用户点击“显示在聊天顶部”时,此接口可继续调用 wx.chooseLocation(OBJECT)
打开地图选择位置。 wx.openLocation(OBJECT)
​使用微信内置地图查看位置。

2、如果想解析地址的话,微信小程序没有提供地址解析,所以必须引入地图插件,看了高德、百度和腾讯的地图,发现腾讯地图对小程序,支持的功能多,最方便。

3、申请一个腾讯地图的开发者账号,需要密匙

4、思路是:用腾讯地图插件,解析你想查询的地址,解析为经度和纬度,然后用小程序的 wx.openLocation(OBJECT),它会跳转到一个新页面,定位到解析的经纬度的位置,这样就OK了

<view  bindtap="seeMap" >{{adrr}}</view>
var QQMapWX  = require("../libs/qqmap-wx-jssdk.min.js")
var demo = new QQMapWX({
key: '申请的密匙' // 必填
});
Page({
data: {},
onLoad: function (options) {
this.setData({
adrr:options.adrr
})
}, seeMap: function () {
demo.geocoder({
address: this.data.adrr,
success: res => {
wx.openLocation({
latitude: res.result.location.lat,
longitude: res.result.location.lng,
scale: 28
})
},
fail: function(res) {
console.log(res);
},
complete: function(res) {
console.log(res);
}
}); })

5、看看效果图

微信小程序 地图地址解析的更多相关文章

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

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

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

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

  3. 微信小程序地图总结

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

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

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

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

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

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

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

  7. 微信小程序地图模块

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

  8. 微信小程序地图之逆地理编码

    首先说一下,我微信自带map的api中并没有相关接口可调用.文中的方法建立于高德地图.(顺便吐槽,微信开发文档相比支付宝家的显得好烂!) 最近做项目用到地图定位相关的需求,为了搞定需求看了下相关的文档 ...

  9. 微信小程序——地图

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

随机推荐

  1. ubuntu下core file文件生成及调试

    1.简介:corefile 是Linux下程序崩溃时生成的文件,可以用来分析程序崩溃的原因,因为它内部包含了程序崩溃时的堆栈信息. 2.corefile的设置 默认情况下,程序崩溃是不会生成coref ...

  2. java jdk 打开出错 Failed to load the JNI shared library

    ``` Failed to load the JNI shared library 解决方法 换了JDK 32位x86的 打开32位 eclipse 2017 oxygen 出现这个问题,修改 配置文 ...

  3. Vim文档编辑

    >##一.vim重复命令       ###1.重复执行上次命令       在普通模式下`.`(小数点)表示重复上一次的命令操作       拷贝测试文件到本地目录       ```   $ ...

  4. redis数据操作笔记

    redis是key-value的数据结构,每条数据都是一个键值对键的类型是字符串 注意:键不能重复,值的类型分为五种:字符串string 哈希hash 列表list 集合set 有序集合zset 一. ...

  5. Psi Probe 安装及使用说明

    这是一款 Tomcat 管理和监控工具,前身是 Lambda Probe.由于 Lambda Probe 2006不再更新,所以 PSI Probe 算是对其的一个 Fork 版本并一直更新至今. g ...

  6. ThinkPHP3.2.3中M()和D()的区别详解

    在实例化的过程中,经常使用D方法和M方法, 区别在于:M方法实例化模型无需用户为每个数据表定义模型类,如果D方法没有找到定义的模型类,则会自动调用M方法. 通俗一点说:1.M实例化参数是数据库的表名, ...

  7. vue-cli创建第一个项目(用git bash解决上下键移动选择问题)

    我电脑是windows:(nodejs已经有了) 1 下载vue-cli cmd 打开命令行,或者是gitbash.最好是用cnpm比较快. 2   创建项目: dos命令,cd 你的希望创建的文件夹 ...

  8. 五子棋棋盘布局 table和ul哪个好

    想要在页面布局以上棋盘,可以用ul li 布局,但却有明显的缺点: 1.两行两列:ul li 下面如果再放li 会出错,只能是放其他的,比如div. 或者放li *行*列: 但是这样有两个明显缺陷: ...

  9. 剑指offer——python【第44题】翻转单词顺序

    题目描述 牛客最近来了一个新员工Fish,每天早晨总是会拿着一本英文杂志,写些句子在本子上.同事Cat对Fish写的内容颇感兴趣,有一天他向Fish借来翻看,但却读不懂它的意思.例如,“student ...

  10. 自己配置 vue 项目 知识体系(自己写脚手架 类似 vue-cli )

    简单的目录结构: |-index.html |-main.js 入口文件 |-App.vue vue文件,官方推荐命名法 |-package.json 工程文件(项目依赖.名称.配置) npm ini ...