长安镇仿做网站,天津网站建设 企航互联,WordPress 升级 php,关键词投放文章目录一、注册腾讯地图1. 申请开发者密钥#xff08;key#xff09;2. 开通webserviceAPI服务3. 下载SDK二、导入SDK2.1. 解压复制2.2. 页面导入三、实现3.1. 先创建实例。3.2. 获取经纬度3.3. 监控四、计算二点距离4.1. 官网地址4.2. 代码4.3. 测试一、注册腾讯地图
1. …
文章目录一、注册腾讯地图1. 申请开发者密钥key2. 开通webserviceAPI服务3. 下载SDK二、导入SDK2.1. 解压复制2.2. 页面导入三、实现3.1. 先创建实例。3.2. 获取经纬度3.3. 监控四、计算二点距离4.1. 官网地址4.2. 代码4.3. 测试一、注册腾讯地图
1. 申请开发者密钥key
申请密钥
2. 开通webserviceAPI服务 控制台 - key管理 - 设置使用该功能的key- 勾选webserviceAPI- 保存 (小程序SDK需要用到webserviceAPI的部分服务所以使用该功能的KEY需要具备相应的权限)
3. 下载SDK
微信小程序JavaScriptSDK微信小程序JavaScriptSDK v1.2
二、导入SDK
2.1. 解压复制
下载后解压将里面的 qqmap-wx-jssdk.js 文件拷贝到项目里面。
2.2. 页面导入
然后在需要的页面导入。
import qqmapsdk from ../../static/qqmap-wx-jssdk.min.js;三、实现
3.1. 先创建实例。
const QQMapWX new qqmapsdk({key: 在腾讯位置服务申请的key
});3.2. 获取经纬度
然后先调用 uni.getLocation 获取经纬度然后再调用该js的方法去解析地址。
uni.getLocation({type: wgs84,geocode: true,success: (res) {console.log(获取经纬度成功);this.latitude res.latitude;this.longitude res.longitude;},fail: () {console.log(获取经纬度失败);},complete: () {// 解析地址QQMapWX.reverseGeocoder({location: {latitude: this.latitude,longitude: this.longitude},success: function(res) {console.log(解析地址成功);console.log(res);// 省let province res.result.ad_info.province;// 市let city res.result.ad_info.city;console.log(province);console.log(city);},fail: function(res) {uni.showToast({title: 定位失败,duration: 2000,icon: none})console.log(res);},complete: function(res) {console.log(res);}})}
})3.3. 监控
控制台输出如下
如果在手机上定位失败就在 manifest.json 里的指定地方加上两行代码 app-plus : {/* 模块配置 */distribute : {/* 应用发布信息 */android : {/* android打包配置 */permissions : [uses-permission android:name\android.permission.ACCESS_COARSE_LOCATION\/,uses-permission android:name\android.permission.ACCESS_FINE_LOCATION\/]}}}获取一下手机的定位权限。
欢迎指导
四、计算二点距离
uni-app获取腾讯地图计算两经纬度的实际距离可批量
4.1. 官网地址
https://lbs.qq.com/service/webService/webServiceGuide/webServiceDistance
4.2. 代码
getDistance() {uni.request({url: https://apis.map.qq.com/ws/distance/v1/matrix, //仅为示例并非真实接口地址。method: GET,data: {mode: walking,from: 39.071510,117.190091,to: 39.108951,117.279396,key: ..... //获取key},success: (res) {console.log(res);let hw res.data.result.rows[0].elements[0].distance; //拿到距离(米)if (hw hw ! -1) {if (hw 1000) {hw hw m;}//转换成公里else {hw (hw / 2 / 500).toFixed(2) km}} else {hw 距离太近或请刷新重试}console.log(hw);}});
}4.3. 测试
