这是我参与8月更文挑战的第22天,活动详情查看:8月更文挑战
简介
腾讯位置服务为微信小程序提供了基础的标点能力、线和圆的绘制接口等地图组件和位置展示、地图选点等地图API位置服务能力支持,使得开发者可以自由地实现自己的微信小程序产品。 在此基础上,腾讯位置服务微信小程序JavaScript SDK是专为小程序开发者提供的LBS数据服务工具包,可以在小程序中调用腾讯位置服务的POI检索、关键词输入提示、地址解析、逆地址解析、行政区划和距离计算等数据服务,让您的小程序更强大!
操作:
-
申请开发者密钥(key):申请密钥
-
开通webserviceAPI服务:控制台 ->应用管理 -> 我的应用 ->添加key-> 勾选WebServiceAPI -> 保存
-
(小程序SDK需要用到webserviceAPI的部分服务,所以使用该功能的KEY需要具备相应的权限) -
下载微信小程序JavaScriptSDK,微信小程序JavaScriptSDK v1.1 JavaScriptSDK v1.2
-
安全域名设置,在小程序管理后台 -> 开发 -> 开发管理 -> 开发设置 -> “服务器域名” 中设置request合法域名,添加apis.map.qq.com
小程序示例
首先我们要去把下载的小程序JavaScriptSDK,引入到项目中
然后在需要使用的界面进入js文件
const QQMapWX = require('../../assets/js/qqmap-wx-jssdk')
const qqmapsdk = new QQMapWX({
key: '应用密钥'
})
功能使用
地点搜索与地址解析
关键词输入搜索提示
逆地址解析
const QQMapWX = require('../../../../assets/js/qqmap-wx-jssdk')
const qqmapsdk = new QQMapWX({
key: '创建应用的key'
})
//先获取坐标值,然后再根据坐标值获取地址名称
getAddressLocation(){
let that = this
wx.getLocation({
type: 'gcj02',
success (res) {
const latitude = res.latitude
const longitude = res.longitude
that.getAddress(latitude, longitude)
}
})
},
getAddress(latitude, longitude) {
qqmapsdk.reverseGeocoder({
location: {latitude,longitude},
success(res) {
that.setData({
oneTitle:res.result.ad_info.city + res.result.ad_info.district
})
}
})
},
tip
1、在开发测试的时候会发现获取的定位不准确,其实没事的!!!!!是电脑测试的问题,到了手机测试就会准确了的
2、坐标系最好采用gcj02坐标系,会准确