新建一个项目。
配置uniapp配置文件设置小程序的appid
注意：匿名用户可能存在地理定位失效。
查uniapp官网
官网->api
uni.getLocation(OBJECT)
获取当前的地理位置、速度。属性：
success匿名函数返回值：
uni.getLocation({
type: 'gcj02',
success: function (res) {
console.log('当前位置的经度：' + res.longitude);
console.log('当前位置的纬度：' + res.latitude);
}
});注意：
项目中实现自动定位
在应用级生命周期位置书写定位功能
h5端配置的位置
小程序（wx）
腾讯地图开放平台申请sdk
https://lbs.qq.com/
登录开放平台——-进入控制台
申请key完成之后 赋值key密钥备用。
到公众号配置安全域名
腾讯服务器：
https://apis.map.qq.com
port default {
methods: {
getUserLocation() {
console.log("111222");
//使用定位api
uni.getLocation({
type: "gcj02",
success(res) {
console.log(res);
},
fail(err) {
console.log(err);
}
})
},
},
onLaunch: function() {
console.log('App Launch', this)
this.getUserLocation();
},
注意：小程序端 版本库太高也不支持 定位api。
下载腾讯sdk
下载之后解压缩 放置项目
使用qqmapsdk 将经纬度转化为中文数据。
1.引入
//引入qqmap sdk
import QQMapSdk from '../../common/qqmap-wx-jssdk.js'
//2.实例化对象
//调用 qqmapsdk
getUserLocationInfo() {
//实例化qqmap
this.QQMap = new QQMapSdk({
key: "OCXBZ-BSUCV-SO3PY-UYLK6-A7IJE-MJBAJ"//密钥
});
//在调用qqmap 对应的API
}
3.执行对应的api
//在调用qqmap 对应的API
this.QQMap.reverseGeocoder({
location: {
latitude: this.lat,
longitude: this.long
},
success(res) {
console.log(res);
let {
address,
ad_info
} = res.result;
that.address = ad_info.city ? ad_info.city : '定位失败';
}
});使用map地图组件
map
地图组件。文章来源：https://www.toymoban.com/news/detail-801051.html
地图组件用于展示地图，而定位API只是获取坐标，请勿混淆两者。文章来源地址https://www.toymoban.com/news/detail-801051.html
<map class="map" :markers="mks" :enable-3D="true" :longitude="long" :latitude="lat"></map>
详细属性看官网到了这里，关于uniapp小程序接入腾讯地图sdk的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
