信小程序 使用腾讯地图SDK详解及实现步骤

   微信小程序JavaScript SDK:

  官方文档:http://lbs.qq.com/qqmap_wx_jssdk/index.html

步骤:

1.申请开发者密钥(key):申请密匙

2.下载微信小程序JavaScriptSDK,微信小程序JavaScriptSDK v1.0

3.安全域名设置,需要在微信公众平台添加域名地址https://apis.map.qq.com

4.小程序示例

  1. /**
  2. * 获取当前坐标
  3. */
  4. wx.getLocation({
  5. success: function (res) {
  6. self.setData({
  7. hasLocation: true,
  8. })
  9. showAddress(res.longitude, res.latitude, self);
  10. },
  11. cancel: function (res) {
  12. alert('对不起,请允许获取您的地理位置');
  13. wx.closeWindow();
  14. },
  15. fail: function (res) {
  16. alert('系统检测到微信没有获取位置权限,请先开启再来哦')
  17. }
  18. })
  19.  
  20. //经纬度解析
  21. function showAddress(longitude, latitude, self) {
  22. // 实例化腾讯地图API核心类
  23. qqmapsdk = new QQMapWX({
  24. key: 'DPEBZ-SXF6X-IDK45-7O6JH-LJZZE-KIB42'//此处使用你自己申请的key
  25. });
  26. // 腾讯地图调用接口
  27. qqmapsdk.reverseGeocoder({
  28. location: {
  29. latitude: latitude,
  30. longitude: longitude
  31. },
  32. success: function (res) {
  33. self.setData({
  34. address: res.result.address
  35. })
  36. },
  37. fail: function (res) {
  38. console.log(res);
  39. },
  40. complete: function (res) {
  41. }
  42. });
  43. }
  44. },

结果效果图:

微信小程序 使用腾讯地图SDK详解及实现步骤的更多相关文章

  1. 微信小程序引入腾讯地图API方法

    微信小程序大热,在小程序过程中,我们很多时候都会用到地图.不管是企业的地址,还是商家的配送都会用到地图: 我在刚写地图这一块时,在网上也参考了很多网友的方法,始终有Bug(类似于地图拖拽是画面抖动,无 ...

  2. [原创] 分享我们自己搭建的微信小程序开发框架——wframe及设计思想详解

    wframe不是控件库,也不是UI库,她是一个微信小程序面向对象编程框架,代码只有几百行.她的主要功能是规范小程序项目的文件结构.规范应用程序初始化.规范页面加载及授权管理的框架,当然,wframe也 ...

  3. 微信小程序 - 调用腾讯地图插件

    1. 登录公众号平台 https://mp.weixin.qq.com/ 2. 设置->第三方服务->添加插件->输入插件名称->申请 3. 项目中使用 3.1 app.jso ...

  4. 微信小程序集成腾讯云 IM SDK

    微信小程序集成腾讯云 IM SDK 1.背景 因业务功能需求需要接入IM(即时聊天)功能,一开始想到的是使用 WebSocket 来实现这个功能,然天意捉弄(哈哈)服务器版本太低不支持 wx 协议(也 ...

  5. 微信小程序语音与讯飞语音识别接口(Java)

    项目需求,需要使用讯飞的语音识别接口,将微信小程序上传的录音文件识别成文字返回 而微信小程序上传的文件格式是silk的,而讯飞接口能识别wav 格式的文件,所以需要将小程序上传的silk文件转成wav ...

  6. 微信小程序基于腾讯云对象存储的图片上传

    在使用腾讯云对象存储之前,公司一直使用的是传统的FTP的上传模式,而随着用户量的不断增加,FTP所暴露出来的问题也越来越多,1.传输效率低,上传速度慢.2.时常有上传其他文件来攻击服务器,安全上得不到 ...

  7. 微信小程序语音与讯飞语音识别接口(Java),Kronopath/SILKCodec,ffmpeg处理silk,pcm,wav转换

    项目需求,需要使用讯飞的语音识别接口,将微信小程序上传的录音文件识别成文字返回 首先去讯飞开放平台中申请开通语音识别功能 在这里面下载sdk,然后解压,注意appid与sdk是关联的,appid在初始 ...

  8. 如何开发一款堪比APP的微信小程序(腾讯内部团队分享)

    一夜之间,微信小程序刷爆了行业网站和朋友圈,小程序真的能如张小龙所说让用户"即用即走"吗? 其功能能和动辄几十兆安装文件的APP相比吗? 开发小程序,是不是意味着移动应用开发的一次 ...

  9. 微信小程序城市定位(百度地图API)

    概述 微信小程序提供一些API(地址)用于获取当前用户的地理位置等信息,但无论是wx.getLocation,还是wx.chooseLocation均没有单独的字段表示国家与城市信息,仅有经纬度信息. ...

随机推荐

  1. expr判断整数是相加的值,返回命令的返回值$? 是0,但是少数情况是1,例如1 + -1 ,$? 的结果是1 ,判断要大于1最准确

    [root@m01 ~]# expr 1 + 12[root@m01 ~]# echo $?0[root@m01 ~]# echo 1 - 51 - 5[root@m01 ~]# expr 1 - 5 ...

  2. 用e2fsck修复受损的linux文件系统

    今天想尝试直接从linux deepin拷贝一些文件到windows 10而不重启电脑,所以就安装Ext2Mgr了并加载了linux的几个磁盘: / /home 再次重启系统想进入linux的时发现系 ...

  3. sqlserver更新表脚本

    --增加项目字段,门店信息,所在省份,所在市,所在区县,提供服务ALTER TABLE [dbo].[school_base_info]ADD [store_information] varchar( ...

  4. java需要掌握内容、核心不断更新中

    1.你需要精通面向对象分析与设计(OOA/OOD).涉及模式(GOF,J2EEDP)以及综合模式.你应该十分了解UML,尤其是class,object,interaction以及statediagra ...

  5. Windows Azure 系列-- 使用Azure + Web API实现图片上传

    1. 创建1个Azure账号,登录之后创建1个AzureStorage.左下方点Manage Access会看到Primary Access Key和Storage Account,记住它们的位置,等 ...

  6. 安装tomcat出现failed to install tomcat6 service错误及解决方法(转载)

    安装安装版tomcat会出现failed to install tomcat6 service ,check your setting and permissio的概率是非常低的,但是最近楼主就老出现 ...

  7. HBase的多节点集群详细启动步骤(3或5节点)(分为Zookeeper自带还是外装)

    HBase的多节点集群详细启动步骤(3或5节点)分为: 1.HBASE_MANAGES_ZK的默认值是false(zookeeper外装)(推荐) 2.HBASE_MANAGES_ZK的默认值是tru ...

  8. 上传文件ie7

    https://www.cnblogs.com/front-end-develop/p/6214818.html 第一步:html中引入jQuery-1.7.1.js和ajaxFileUpload.j ...

  9. 分享申请IDP账号的过程,包含duns申请的分享

    本文转载至 http://www.cocoachina.com/ios/20140325/8038.html 5月份接到公司要申请开发者账号的任务,就一直在各个论坛找申请的流程,但都是一些09年10年 ...

  10. c++ 流继承关系