前言第一次用腾讯定位服务还挺早的，那时候用的是web端。后来慢慢接触到了小程序。有一次，我需要能够显示附近的各种商店，以便快速定位到我周围的好吃的地方。后来，我们每到一个地方旅行，其中一个必不可少的需求就是上厕所。当时我们就在想如何通过一张地图快速定位到周边WC的位置和步行路线。现在好了，有了腾讯位置服务功能就可以直接在小程序上使用了，借助巨人的力量，可以实现需要的功能。因此，写这篇文章也是希望总结一下对接腾讯定位服务的功能步骤和知识点，让开发者能够快速上手使用。申请Key，为自己的业务或某个场景打造Key钥匙。有了这把钥匙，你就可以开始体验地图功能了！只需扫描微信二维码即可授权登录。微信扫码登录腾讯列表功能就方便多了，省去了密码登录的老好办法。点击后台菜单：keyandquota->keymanagement，填写具体开发者密钥申请信息如下。设置域名小程序管理后台->开发->开发管理->开发设置->“服务器域名”设置请求的合法域名，添加https://apis.map.qq.com导入js点击官网开发文档中的微信小程序JavaScriptSDK下载//导入SDK核心类，js文件可以根据自己的业务位置放置varQQMapWX=require('../../libs/qqmap-wx-jssdk.js');varqqmapsdk;Page({data:{longitude:'113.390451',latitude:'23.048914'},onLoad:function(){//示例ModernizationAPI核心类qqmapsdk=newQQMapWX({key:'xxxx-xxxx,你自己申请的key'});},onShow:function(){//调用接口qqmapsdk.search({keyword:'广州大学城',success:function(res){//console.log(res);},fail:function(res){//console.log(res);},complete:function(res){console.log(res);}});}})使用地图使用地图地图组件。具体参数可以登录微信官方文档查看。Tips：小程序界面默认顶部是一个白色背景、固定高度的标题栏。如果需要隐藏顶部标题栏，那么需要在app.json配置中给window加上"navigationStyle":"custom"，默认的渲染地图组件参数什么都没有如果不设置，默认渲染视图代码如下显示标签添加标签到默认坐标。标签可以是一个数组，坐标点数组的值，这样在地图上的效果就是多个标签点。'113.390451',latitude:'23.048914'}]多个标记：markers:[{longitude:'113.390451',latitude:'23.048914'},{longitude:'113.390451',latitude:'23.048914'}]bindmarkertap：点击markerTriggerbindlabeltapwhenclicking:triggerbindcallouttapwhenclickingthemarkpointlabel:当点击标记点对应的气泡时触发默认标注效果。./../libs/qqmap-wx-jssdk.js');varqqmapsdk;Page({data:{longitude:'113.390451',latitude:'23.048914',markers:[{longitude:'113.390451',latitude:'23.048914'}]},onLoad:function(){//实例化API核心类qqmapsdk=newQQMapWX({key:'xxxx-xxxx,你自己申请的key'});},onShow:function(){//调用接口qqmapsdk.search({keyword:'广州大学城',success:function(res){//控制台日志（资源）；},失败:function(res){//console.log(res);},完成:函数(res){console.log(res);}});}})查看代码label展示文字js代码效果js代码//关键代码//markers属性下有属性成员-{label:{content:'广州番禺大学城'}data:{markers:[{label:{content:'广州番禺大学城'},longitude:'113.390451',latitude:'23.048914'}]}，WC路线规划下还有样式设置，比如：箭头，线条颜色，起点终点文字显示等，这些都是默认参数js代码//引入SDK核心类，js文件可以根据自己的业务位置放置varQQMapWX=require('../../libs/qqmap-wx-jssdk.js');varqqmapsdk;Page({data:{longitude:'113.390451',latitude:'23.048914',markers:[{label:{content:'广州番禺大学城'},longitude:'113.390451',latitude:'23.048914'}]},onLoad:function(){//实例化API核心类qqmapsdk=newQQMapWX({key:'xxxx-xxxx，你自己申请的key'});}，展出:function(){//调用接口qqmapsdk.search({keyword:'GoGoToilet',success:function(res){//console.log(res);},fail:function(res){//console.日志（res）；}，完成：函数（res）{console.log（res）；}}）；},//触发表单提交事件，调用接口formSubmit(e){//起点坐标：23.048914,113.390451//终点坐标：23.061793,113.392056//23.061793,113.392056//23.063073,113.391762var_this=this;//调用距离计算接口qqmapsdk.direction({mode:'driving',//可选值：'driving'（驾车），'walking'（步行），'bicycling'（骑车），不填则默认：'driving'，可以留空//from参数不填，默认当前地址from:e.detail.value.start,to:e.detail.value.dest,success:function(res){console.log(res);varret=res;varcoors=ret.result.routes[0].polyline,pl=[];//坐标解压（返回点字符串坐标，前向差分压缩）varkr=1000000;对于(vari=2;i路线规划开启个性化腾讯地图微信扫码绑定，微信会判断当前小程序是否注册了腾讯定位服务，如果提示未注册，则可以输入注册的账号，一般用手机号登录即可完成绑定小程序和腾讯位置服务账号部分插件需要申请appid
