点击以下链接报名体验吧 https://lbs.qq.com?lbs_invite=9QNIFL9 小程序管理后台 -> 开发 -> 开发管理 -> 开发设置 -> “服务器域名” 中设置request合法域名,添加https://apis.map.qq.com 下载地址:https://lbs.qq.com/miniProgram/jsSdk/jsSdkGuide/jsSdkOverview 使用地图map组件,具体参数可查看官方文档 温馨提示:小程序界面默认顶部是白色背景固定高度的标题栏,如果需要隐藏顶部标题栏的方法,那么需要在app.json配置里的window里加"navigationStyle": "custom", 地图组件参数什么也没设置的情况下,默认如下效果图 给默认坐标加个标注,标注可以是数组,坐标点数组值,这样在地图的效果就是多个标注点 marker:标记点用于在地图上显示标记的位置 关键代码:markers:[{longitude:'113.390451',latitude:'23.048914'}] 下面的还有做样式设置,比如:箭头、和线路颜色,以及起点和终点的文本显示等等,纯属默认参数 微信扫码绑定,微信会判断当前小程序是否注册腾讯位置服务,如果提示未注册,那么可以输入已注册的账号,一般是手机号码登录,完成小程序和腾讯位置服务账号的绑定。 有些插件还要另外申请appid 更多完善功能持续更新中…【一起来体验腾讯位置服务功能】
【申请Key】
【设置域名】
【引入js】
// 引入SDK核心类,js文件根据自己业务,位置可自行放置 var QQMapWX = require('../../libs/qqmap-wx-jssdk.js'); var qqmapsdk; Page({ data:{ longitude:'113.390451', latitude:'23.048914' }, onLoad: function () { // 实例化API核心类 qqmapsdk = new QQMapWX({ key: 'XSJBZ-FTRKR-E77WZ-WLE4L-XBGW7-QIFRZ' }); }, onShow: function () { // 调用接口 qqmapsdk.search({ keyword: '广州大学城', success: function (res) { //console.log(res); }, fail: function (res) { //console.log(res); }, complete: function (res) { console.log(res); } }); } })
【使用地图】
<view class='view'> <map longitude="{{longitude}}" latitude="{{latitude}}"></map> </view>
【显示标注】
多个标注:markers:[{longitude:'113.390451',latitude:'23.048914'},{longitude:'113.390451',latitude:'23.048914'}]
// 引入SDK核心类,js文件根据自己业务,位置可自行放置 var QQMapWX = require('../../libs/qqmap-wx-jssdk.js'); var qqmapsdk; Page({ data:{ longitude:'113.390451', latitude:'23.048914', markers:[{longitude:'113.390451',latitude:'23.048914'}] }, onLoad: function () { // 实例化API核心类 qqmapsdk = new QQMapWX({ key: 'XSJBZ-FTRKR-E77WZ-WLE4L-XBGW7-QIFRZ' }); }, onShow: function () { // 调用接口 qqmapsdk.search({ keyword: '广州大学城', success: function (res) { //console.log(res); }, fail: function (res) { //console.log(res); }, complete: function (res) { console.log(res); } }); } })
<view class='view'> <map longitude="{{longitude}}" latitude="{{latitude}}" markers="{{markers}}"></map> </view>
【标注显示文本】
//关键代码 //markers属性下还有属性成员-{label:{content:'广州番禺大学城'} data:{ markers:[{label:{content:'广州番禺大学城'},longitude:'113.390451',latitude:'23.048914'}] },
【WC路线规划】
【开启个性化腾讯地图】
本网页所有视频内容由 imoviebox边看边下-网页视频下载, iurlBox网页地址收藏管理器 下载并得到。
ImovieBox网页视频下载器 下载地址: ImovieBox网页视频下载器-最新版本下载
本文章由: imapbox邮箱云存储,邮箱网盘,ImageBox 图片批量下载器,网页图片批量下载专家,网页图片批量下载器,获取到文章图片,imoviebox网页视频批量下载器,下载视频内容,为您提供.
阅读和此文章类似的: 全球云计算