03
2017
11

微信小程序加载腾讯地图SDK

微信小程序加载腾讯地图SDK 小程序  第1张

在微信小程序开发过程中,不少人肯定遇到过要用到地图。在小程序里,腾讯也给出了相应的SDK供我们来使用.那么接下来,就介绍下如何使用该SDK实现获取经纬度然后显示当前用户所在地址。


第一步:下载腾讯地图SDK,地址:http://lbs.qq.com/qqmap_wx_jssdk/index.html

微信小程序加载腾讯地图SDK 小程序  第2张

或者进入腾讯地图的首页,从菜单中找到小程序SDK。


第二步:申请密钥,大家点击进去,根据流程填好,就可以了!

微信小程序加载腾讯地图SDK 小程序  第3张


第三步:登录小程序微信公众平台,设置合法域名

微信小程序加载腾讯地图SDK 小程序  第4张

微信小程序加载腾讯地图SDK 小程序  第5张

 微信小程序加载腾讯地图SDK 小程序  第6张

注意:服务器域名更改每月5次机会

增加好之后在小程序开发工具里查看

微信小程序加载腾讯地图SDK 小程序  第7张

然后点击项目设置

微信小程序加载腾讯地图SDK 小程序  第8张

如果没有看到重新编译下项目,就会有了!

这样就可以正常访问腾讯地图了

之后申请好了密钥可以在控制台查看到

微信小程序加载腾讯地图SDK 小程序  第9张

然后将下载好的SDK解压到项目的JS目录下

微信小程序加载腾讯地图SDK 小程序  第10张

然后在要加入地图的JS文件里引入SDK

微信小程序加载腾讯地图SDK 小程序  第11张

然后在生命周期onLoad函数中创建地图实例

微信小程序加载腾讯地图SDK 小程序  第12张

之后调用小程序的API(获取经纬度),在调用SDK的API获取具体的地址(逆地址解析);

微信小程序加载腾讯地图SDK 小程序  第13张

wx.getLocation是小程序的API

Maps.reverseGeocoder是SDK的API

在获取经纬度成功的回调中调用地图的逆解析方法来获取具体的地址,详细参数解释:http://lbs.qq.com/qqmap_wx_jssdk/method-reverseGeocoder.html

在回调函数的addressRes参数中,有各种地址参数,大家可以打印出来,拾取自己要的就行!

总体的思路:获取腾讯地图密钥-创建地图实例-获取经纬度-逆解析到具体地址

本文标题:微信小程序加载腾讯地图SDK
本文链接:https://masoft.cn/post/64.html
作者授权:除特别说明外,本文由 智汇软件 原创编译并授权 北京,深圳,重庆,大连,青岛,济南软件设计与定制 刊载发布。
版权声明:本文使用「署名 4.0 国际」创作共享协议,转载或使用请遵守署名协议。
« 上一篇 下一篇 »

发表评论:

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。

分享:

支付宝

微信