From e3be7edc5564f1723b87ec82442a3877be894c22 Mon Sep 17 00:00:00 2001
From: liuyg <376836862@qq.com>
Date: Fri, 02 Jul 2021 19:04:32 +0800
Subject: [PATCH] +
---
xcxMapJQLG/js/vueMain.js | 336 +++++++++++++++++++++++++++++++-------------------------
1 files changed, 186 insertions(+), 150 deletions(-)
diff --git a/xcxMapJQLG/js/vueMain.js b/xcxMapJQLG/js/vueMain.js
index 8ffeb42..91b99d6 100644
--- a/xcxMapJQLG/js/vueMain.js
+++ b/xcxMapJQLG/js/vueMain.js
@@ -24,6 +24,14 @@
shipingM3u8Url: '',
resultFeedbackPopupShow: false,
popupDisplay: "none",
+
+ haveShishiweizhi: 1,
+ isFromJQ: false,
+ chulijieguo: '',
+ wentifankui: '',
+ oldlat: '',
+ oldlng: '',
+
},
methods: {
getDataList() {
@@ -37,26 +45,58 @@
"state": '0',
"dtype": '0',
"size": '300',
- "jd": "115.822311",
- "wd": "28.646341"
+ "jd": "114.91385",
+ "wd": "25.81051"
}]
//url解码
- // this.getdata = this.getQueryVariable('data') || data;
- this.getdata = data;
+ this.getdata = this.getQueryVariable('data') || data;
+ // this.getdata = data;
+ this.changeDom(this.getdata[0]);
this.map = this.beginMap(this.map, this.getdata); //创建并接受map
// this.move = new myDomMove('#seedata', '.title', '#map');
this.map.invalidateSize(true); //应用地图高度
// this.move.followFinger(this.map, 'down');
this.lat = data[0].wd;
this.lng = data[0].jd;
+ this.oldlat = data[0].wd;
+ this.oldlng = data[0].jd;
+ },
+ changeDom(data) {
+ console.log(data, 'changeDom');
+
+ function changeDoms(dom, item) {
+ $(dom).empty();
+ $(dom).append(item);
+ }
+ changeDoms('#um-m-t-bz', data.bz);
+ changeDoms('#um-m-t-dz', data.place);
+ // console.log(data.jtype, data.securityId, '11111111111')
+ if (data.jtype == 2) {
+ changeDoms('#um-m-t-states', '已处理');
+
+ } else if (data.jtype == 1) {
+ changeDoms('#um-m-t-states', '处理中');
+ $('#jieshou').hide();
+ $('#wanchen').show();
+ } else {
+ changeDoms('#um-m-t-states', '未处理');
+ $('#jieshou').show();
+ $('#wanchen').hide();
+ }
+ // if (this.isFromJQ == false) {
+ // $('#wanchen').show();
+ // }
+
},
//url解码
getQueryVariable(variable) {
+ var that = this;
var query = window.location.search.substring(1);
var vars = query.split("&");
for (var i = 0; i < vars.length; i++) {
var pair = vars[i].split("=");
if (pair[0] == variable) {
+ that.isFromJQ = true; //确认是警情进来
return JSON.parse(decodeURI(pair[1]));
} //解码url 和 JSON
}
@@ -103,14 +143,14 @@
var transportIcon = L.Icon.extend({ //图标初始化
options: {
- iconSize: [30, 30], // 图标尺寸
+ iconSize: [50, 30], // 图标尺寸
}
});
var carIcon = new transportIcon({ //引入图标
iconUrl: './img/gray.png'
}),
planeIcon = new transportIcon({
- iconUrl: './img/green.png'
+ iconUrl: './img/zd.png'
}),
busIcon = new transportIcon({
iconUrl: './img/red.png'
@@ -131,7 +171,6 @@
console.log('没有坐标', i)
} else {
setData(a);
- that.getDHLine(a.jd, a.wd);
}
markers.addLayer(marker);
}
@@ -140,26 +179,116 @@
markers.on('click', function(a) {
if (i == 0) {
-
-
console.log(that.getdata)
-
- i = 1
} else if (i == 1) {
- i = 0
+ i = -1
}
+ i++
});
- console.log(markers)
+ // console.log(markers)
this.nowPosition = center;
return map; //抛出map
},
- Submit(){
- this.$message({
- message: '恭喜你，这是一条成功消息',
- type: 'success',
- center: true
- });
+ Submit() {
+ $('#loding').show();
+ var time = setTimeout(() => {
+ $('#loding').hide();
+ }, 2000)
+
+ },
+ SubmitDown() {
+ $('#SubmitDown').show();
+ },
+ SubmitSD() {
+ console.log(this.chulijieguo, 'chulijieguo')
+ console.log(this.wentifankui, 'wentifankui')
+ },
+
+ showPolyLine(xy) {
+ var that = this;
+ that.LxdhLine = L.polyline(xy, {
+ color: 'red'
+ }).addTo(that.map);
+
+ // zoom the map to the polyline
+ that.map.fitBounds(that.LxdhLine.getBounds())
+ },
+ //定位警情位置
+ // titleClick() {
+ // this.map.setView(this.nowPosition, 20);
+ // },
+ //定位当前位置
+ locationMap() {
+ // console.log([this.lat, this.lng])
+ // this.map.setView([this.lat, this.lng], 20);
+ this.getLocationData();
+ },
+ // 获取实时位置
+ getLocationData() {
+
+ var that = this;
+ var geolocation = new qq.maps.Geolocation("T7RBZ-62U3X-RSQ4P-ZZVCB-WE7JT-HRBOG", "mapqq");
+ var positionNum = 0;
+ var options = {
+ timeout: 1000
+ };
+
+ function showPosition(position) {
+ var adCode = position.adCode; //邮政编码
+ var nation = position.nation; //中国
+ var city = position.city; //城市
+ var addr = position.addr; //详细地址
+ that.lat = position.lat; //
+ that.lng = position.lng; //火星坐标 //TODO 实现业务代码逻辑
+ that.haveShishiweizhi++; //控制只执行一次
+ console.log(that.haveShishiweizhi)
+ if (that.haveShishiweizhi == 2) {
+ // console.log(position)
+ if (that.LXdhStart == null) {
+ //点位
+ var position = [that.lat, that.lng];
+
+ //把map定位到点位上，13为地图的级别，也可以直接marker.getLatLng()
+ that.map.setView(position, 15);
+
+ } else {
+ that.map.removeLayer(that.LXdhStart);
+ }
+
+
+ //绘制起点和终点
+ that.LXdhStart = L.markerClusterGroup();
+
+ var transportIcon = L.Icon.extend({ //图标初始化
+ options: {
+ iconSize: [50, 50], // 图标尺寸
+ }
+ });
+
+ var qd = new transportIcon({
+ iconUrl: './img/dingw.gif'
+ });
+
+ that.LXdhStart.addLayer(L.marker([that.lat, that.lng], {
+ icon: qd,
+ }));
+
+ that.map.addLayer(that.LXdhStart);
+ that.getDHLine(+that.oldlng, +that.oldlat)
+ // console.log(that.lat, that.lng);
+ // console.log(+that.oldlat, +that.oldlng);
+
+ };
+ };
+
+ function showErr() {
+ //TODO 如果出错了调用此方法
+ // console.log(15)
+ };
+
+ geolocation.getLocation(showPosition, showErr, options);
+ // console.log(geolocation);
},
getDHLine(x, y) {
@@ -180,17 +309,28 @@
opt: "sf2"
},
}).then((res) => {
- var resdata = res.data.result.coords;
- var err = res.data.result.err;
- var data = [];
- // console.log(err)
- if (!err) {
+ if (res.data.result.coords == undefined) {
+ console.log('目标太远 或不存在路径')
+ } else {
+
+ var resdata = res.data.result.coords;
+ console.log(resdata)
+ var data = [];
for (var i = 0; i < resdata.length; i++) {
var xy = [];
xy.push(resdata[i][1]);
xy.push(resdata[i][0]);
data.push(xy);
}
+ var w = resdata[0][0] - resdata[resdata.length - 1][0];
+ w = Math.abs(w);
+ w = w / 0.00000899;
+ w = w.toFixed(2);
+ console.log(w);
+ $('#t-mi').empty();
+ $('#t-mi').append(w + '米');
+ $('#t-fz').empty();
+ $('#t-fz').append(w / 30 + '分钟');
if (that.LXdhEnd != null) {
that.map.removeLayer(that.LXdhEnd);
@@ -209,7 +349,7 @@
});
var zd = new transportIcon({
- iconUrl: './img/zd.png'
+ iconUrl: './img/zd2.png'
});
// var qd = new transportIcon({
// iconUrl: './img/qd.png'
@@ -220,9 +360,9 @@
var x = resdata[resdata.length - 1][0];
var y = resdata[resdata.length - 1][1];
- that.LXdhEnd.addLayer(L.marker([y, x], {
- icon: zd,
- }));
+ // that.LXdhEnd.addLayer(L.marker([y, x], {//不要图标
+ // icon: zd,
+ // }));
// markers.addLayer(L.marker([qdzb.start.y, qdzb.start.x], {
// icon: qd,
// }));
@@ -230,142 +370,38 @@
that.map.addLayer(that.LXdhEnd);
that.showPolyLine(data);
- } else {
- console.log('请求位置出错');
}
});
},
showPolyLine(xy) {
var that = this;
that.LxdhLine = L.polyline(xy, {
- color: 'red'
+ color: '#169BD5'
}).addTo(that.map);
-
- // zoom the map to the polyline
that.map.fitBounds(that.LxdhLine.getBounds())
},
- //定位警情位置
- // titleClick() {
- // this.map.setView(this.nowPosition, 20);
- // },
- //定位当前位置
- locationMap() {
- console.log([this.lat, this.lng])
- this.map.setView([this.lat, this.lng], 20);
+ refreshMap() {
+ console.log('shuaxin')
+
},
- shipingClick(open) { //打开视频
- if (open) {
- this.openRealVideoBox(this.seedata.serialNumber, this.seedata.channelNumber, this.seedata
- .deviceNumber, this.seedata.manufacturer);
- } else {
- this.shipingPopupShow = false;
- }
- },
- resultFeedbackClick() { //结果反馈跳转小程序
- uni.webView.navigateTo({
- url: `../poput/workbench/policeDetails/policeDetails?id=${this.seedata.id}`
- });
- },
- openRealVideoBox(serialNumber, channelNumber, deviceNumber, manufacturer) { //获取视频地址
- var that = this;
- if (manufacturer == "HK") {
- axios
- .get(
- `/api/equipment/equipment/selectEquimentPlayInfo?number=${deviceNumber}&bmp=m3u8&manufacturer=${manufacturer}`
- )
- .then((result) => {
- that.videoSource = result.data.data.address;
- that.shipingM3u8Url = decodeURIComponent(that.videoSource);
- that.shipingPopupShow = true;
- })
- .ce;
- } else {
- var newAxios = axios.create({
- baseURL: "https://web.byisf.com:18000",
- withCredentials: false,
- headers: {
- "Content-type": "application/x-www-form-urlencoded",
- },
- });
- newAxios
- .post(
- "/api_control", {}, {
- params: {
- param: JSON.stringify({
- PktType: "GetAccessToken"
- }),
- },
- }
- )
- .then((res) => {
- newAxios
- .get(
- `https://web.byisf.com:18000/GetPlayUrl?deviceCode=${serialNumber}&chl=${channelNumber}`
- )
- .then((result) => {
- that.videoSource = result.data.data.m3u8;
- that.shipingM3u8Url = decodeURIComponent(that.videoSource);
- that.shipingPopupShow = true;
- });
- });
- }
- },
- upData() {
- console.log('上传信息成功')
- },
- getLocationData() {
- var that = this;
- var geolocation = new qq.maps.Geolocation("T7RBZ-62U3X-RSQ4P-ZZVCB-WE7JT-HRBOG", "mapqq");
- var positionNum = 0;
- var options = {
- timeout: 8000
- };
-
- function showPosition(position) {
- var adCode = position.adCode; //邮政编码
- var nation = position.nation; //中国
- var city = position.city; //城市
- var addr = position.addr; //详细地址
- that.lat = position.lat; //
- that.lng = position.lng; //火星坐标 //TODO 实现业务代码逻辑
- console.log(position, 1111)
- if (that.LXdhStart != null) {
- that.map.removeLayer(that.LXdhStart);
- }
-
- //绘制起点和终点
- that.LXdhStart = L.markerClusterGroup();
-
- var transportIcon = L.Icon.extend({ //图标初始化
- options: {
- iconSize: [50, 50], // 图标尺寸
- }
- });
-
- var qd = new transportIcon({
- iconUrl: './img/dingw.gif'
- });
-
- that.LXdhStart.addLayer(L.marker([that.lat, that.lng], {
- icon: qd,
- }));
-
- that.map.addLayer(that.LXdhStart);
-
- };
-
- function showErr() {
- //TODO 如果出错了调用此方法
- };
-
- geolocation.getLocation(showPosition, showErr, options);
- },
-
+ // resultFeedbackClick() { //结果反馈跳转小程序
+ // uni.webView.navigateTo({
+ // url: `../poput/workbench/policeDetails/policeDetails?id=${this.seedata.id}`
+ // });
},
created() {},
mounted() {
this.getDataList();
- this.getLocationData();
+ var time = setInterval(() => {
+ if (this.haveShishiweizhi == 1) {
+ this.getLocationData();
+ console.log(this.haveShishiweizhi)
+
+ } else if (this.haveShishiweizhi == 2) {
+ clearInterval(time);
+ time = null;
+ }
+ }, 3000)
},
wacth: {}
})
--
Gitblit v1.9.3