网站没内容 可以备案么,网站地图抓取,网站被k还能不能在百度做推广,9w域名文章目录一、小程序1. 安装vue-jsonp2. 引入腾讯sdk3. 实例化4. 二点求距离5. 多点求距离文档地址#xff1a;https://lbs.qq.com/service/webService/webServiceGuide/webServiceDistance申请开发者密钥#xff08;key#xff09;#xff1a;
申请密钥一、小程序
1. 安装… 文章目录一、小程序1. 安装vue-jsonp2. 引入腾讯sdk3. 实例化4. 二点求距离5. 多点求距离文档地址https://lbs.qq.com/service/webService/webServiceGuide/webServiceDistance申请开发者密钥key
申请密钥一、小程序
1. 安装vue-jsonp npm i -S vue-jsonpmain.js
//解决跨域
import {VueJsonp} from vue-jsonp
Vue.use(VueJsonp)2. 引入腾讯sdk 直接使用小程序的sdk会有跨域问题因此此sdk根据小程序sdk修改而成的 下载链接qqmap-wx-jssdk1.2.zip
引入qqmap-wx-jssdk.js
// 根据自己实际项目的位置引用文件
import qqmapsdk from ../../utils/qqmap-wx-jssdk.min.js;3. 实例化
再具体的方法内部声明
// 实例化腾讯地图API核心类
const QQMapWX new qqmapsdk({key: 腾讯申请的key // 必填
});4. 二点求距离 //计算二点之间的距离calculateTwoPlaceDistance() {// 实例化腾讯地图API核心类const QQMapWX new qqmapsdk({key: 腾讯申请的key // 必填});const _this this;//调用距离计算接口QQMapWX.calculateDistance({//mode: driving,//可选值driving驾车、walking步行不填默认walking,可不填//from参数不填默认当前地址//获取表单提交的经纬度并设置from和to参数示例为string格式// from: e.detail.value.start || , //若起点有数据则采用起点坐标若为空默认当前地址// to: e.detail.value.dest, //终点坐标mode: straight,from: 39.77466,116.55859, //当前位置的经纬度to: 39.775091,116.56107, //办公地点经纬度 北京市通州区经海三路137号success: (res) { //成功后的回调// debugger// console.log(res);let hw res.result.elements[0].distance; //拿到距离(米)// console.log(hw, hw);if (hw hw ! -1) {if (hw 1000) {hw hw m;}//转换成公里else {hw (hw / 2 / 500).toFixed(2) km;}} else {hw 距离太近或请刷新重试;}// console.log(当前位置与办公地点距离: hw);alert(当前位置与办公地点距离: hw)},});},5. 多点求距离
多点与当前经纬度之间的距离计算当前经纬度和多地打卡地经纬度之间的距离
//多点与当前经纬度之间的距离计算当前经纬度和多地打卡地经纬度之间的距离calculateMorePlaceDistance() {// 实例化腾讯地图API核心类const QQMapWX new qqmapsdk({key: 腾讯申请的key // 必填});const that this;//调用距离计算接口QQMapWX.calculateDistance({from: {latitude: that.latitude,longitude: that.longitude},to: that.moreWorkPlace, //strs为字符串末尾的“”要去掉success: function(res) {// console.log(多地求距离-, res)const moreWorkDistanceList [];const distanceList res.result.elements;for (var i 0; i distanceList.length; i) {const distAddress distanceList[i].distance;// 把计算出来的距离放到数组容器中等会统一计算moreWorkDistanceList.push(distAddress)// console.log(多地打卡数组追加元素-, moreWorkDistanceList);}/*** 转换单位不利于计算统一用m单位一起计算求出数组中最小的一个最后和设定的办公距离愿比较大小* 1.如果小于设置距离属于考勤范围内* 2.如果大于设置距离属于外勤范围*/that.moreWorkDistanceListTemp moreWorkDistanceList// console.log(多地打卡地与当前位置距离数组: that.moreWorkDistanceListTemp);alert(多地打卡地与当前位置距离容器: that.moreWorkDistanceListTemp)},fail: function(res) {// console.log(求距离发生异常-, res);},complete: function(res) {// console.log(求距离执行完成-, res)}})},