lixiaobang
/
TransFlow
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

bug修改

This commit is contained in:
qiudan 2023-10-31 15:34:09 +08:00
parent 33ea88f35e
commit 4f12905530
14 changed files with 857 additions and 692 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
public/VideoWeb/Build/APP.data.unityweb
View File

Binary file not shown.

BIN
public/VideoWeb/Build/APP.framework.js.unityweb
View File

Binary file not shown.

BIN
public/VideoWeb/Build/APP.wasm.unityweb
View File

Binary file not shown.

2
public/VideoWeb/index.html
View File

@ -38,7 +38,7 @@
var canvas = document.querySelector("#unity-canvas"); var canvas = document.querySelector("#unity-canvas");
var loadingBar = document.querySelector("#unity-loading-bar"); var loadingBar = document.querySelector("#unity-loading-bar");
var progressBarFull = document.querySelector("#unity-progress-bar-full"); var progressBarFull = document.querySelector("#unity-progress-bar-full");
var fullscreenButton = document.querySelector("#unity-fullscreen-button"); // var fullscreenButton = document.querySelector("#unity-fullscreen-button");
var warningBanner = document.querySelector("#unity-warning"); var warningBanner = document.querySelector("#unity-warning");
var black = document.querySelector("#black"); var black = document.querySelector("#black");
// Shows a temporary message banner/ribbon for a few seconds, or // Shows a temporary message banner/ribbon for a few seconds, or

41
src/components/chart/lineChart.vue
View File

@ -25,6 +25,18 @@
export default { export default {
name: 'lineChart', //折线图组件 name: 'lineChart', //折线图组件
props: { props: {
itemData: {
type: Object,
default() {
return {};
}
},
originalDataArr: {
type: Array,
default() {
return [];
}
},
list: { list: {
type: Array, type: Array,
default() { default() {
@ -78,6 +90,7 @@ export default {
}; };
}, },
created() { created() {
// console.log(this.componentName + '-' + JSON.stringify(this.itemData));
// console.log( this.componentName + '-' + this.chartName + '-' + '曲线图','40'); // console.log( this.componentName + '-' + this.chartName + '-' + '曲线图','40');
}, },
@ -237,18 +250,32 @@ export default {
}); });
series[0].data = mapNR1; series[0].data = mapNR1;
} else if (title === '速度') { } else if (title === '速度') {
let unit = 'km/h';
if (this.originalDataArr.length > 0) {
if (this.originalDataArr[0].speed >= 0) {
unit = 'km/h';
} else {
unit = 'pix/s';
}
}
this.tooltip = { this.tooltip = {
formatter: '{a} {b}:{c}km/h', formatter: `{a} {b}:{c}${unit}`,
show: true, show: true,
confine: true confine: true
}; };
this.name = 'km/h'; this.name = unit;
// console.log("newVal",newVal) // console.log(this.status + '-速度-' + JSON.stringify(newVal));
series[0].data = newVal.map((val) => { series[0].data = newVal.map((val) => {
if (val.speed == -1) {
return '-';
}
return val.speed; return val.speed;
}); });
} else if (title === '流量') { } else if (title === '流量') {
this.name = '辆/10秒'; this.name = '辆';
if (this.status != '实时触发') {
this.name = `辆/${this.itemData.cycleInterval}${this.itemData.unit}`;
}
series[0].data = newVal.map((ele) => { series[0].data = newVal.map((ele) => {
return ele.in_flow + ele.out_flow; return ele.in_flow + ele.out_flow;
}); });
@ -268,6 +295,9 @@ export default {
}); });
} else if (title === '排队数') { } else if (title === '排队数') {
this.name = '辆'; this.name = '辆';
if (this.status != '实时触发') {
this.name = `辆/${this.itemData.cycleInterval}${this.itemData.unit}`;
}
series[0].data = newVal.map((val) => { series[0].data = newVal.map((val) => {
// return val.n_queue; // return val.n_queue;
if (timeMode == '固定间隔') { if (timeMode == '固定间隔') {
@ -278,6 +308,9 @@ export default {
}); });
} else if (title === '检测数') { } else if (title === '检测数') {
this.name = '辆'; this.name = '辆';
if (this.status != '实时触发') {
this.name = `辆/${this.itemData.cycleInterval}${this.itemData.unit}`;
}
series[0].data = newVal.map((val) => { series[0].data = newVal.map((val) => {
if (timeMode == '固定间隔') { if (timeMode == '固定间隔') {
return val.ave_stay; return val.ave_stay;

884
src/components/sensorFusion/echartsLine.vue
View File

@ -1,456 +1,480 @@
<template> <template>
<div :id="echartsRef" ref="echartsLine"></div> <div :id="echartsRef" ref="echartsLine"></div>
</template> </template>
<script> <script>
export default { export default {
name: "echartsLine", //折线图组件 name: 'echartsLine', //折线图组件
props: { props: {
intersectionName: { itemData: {
type: Array, type: Object,
default() { default() {
return []; return {};
}, }
},
intersectionName: {
type: Array,
default() {
return [];
}
},
chatShowType: {
type: String
},
echartsRef: {
type: String
},
//时间模式
timeMode: {
type: String
},
componentType: {
type: String
}, //组件类型
dataList: {
type: Array,
default() {
return [];
}
}, //表格数据
flowType: {
type: String
} //流量类型
}, },
chatShowType: { data() {
type: String, return {
chart: null,
chartData: {
yData: [],
xData: []
}, //表格数据
seriesList: [], //类型数组
typeData: [],
title: ''
};
}, },
echartsRef: { created() {},
type: String,
},
//时间模式
timeMode: {
type: String,
},
componentType: {
type: String,
}, //组件类型
dataList: {
type: Array,
default() {
return [];
},
}, //表格数据
flowType: {
type: String,
}, //流量类型
},
data() {
return {
chart: null,
chartData: {
yData: [],
xData: [],
}, //表格数据
seriesList: [], //类型数组
typeData: [],
title:'',
};
},
created() {
},
methods: { methods: {
//传值对应字段返回相应字段数组 //传值对应字段返回相应字段数组
extractKeyValues(arr, key) { extractKeyValues(arr, key) {
return arr.map((item) => item[key]); return arr.map((item) => item[key]);
}, },
//数据判断处理 //数据判断处理
dataProcessing(val) { dataProcessing(val) {
if (val.length > 10) { if (val.length > 10) {
val = val.slice(-10); val = val.slice(-10);
}
if (val != null) {
if (this.timeMode == "实时触发") {
if (this.componentType == "车头时距") {
this.chartData.xData = this.extractKeyValues(val, "time");
this.chartData.yData = this.extractKeyValues(val, "headway");
} else if (this.componentType == "流量") {
if (this.flowType == "入流") {
this.chartData.xData = this.extractKeyValues(val, "time");
this.chartData.yData = this.extractKeyValues(val, "in_flow");
} else if (this.flowType == "出流") {
this.chartData.xData = this.extractKeyValues(val, "time");
this.chartData.yData = this.extractKeyValues(val, "out_flow");
} }
} else if (this.componentType == "速度") { if (val != null) {
this.chartData.xData = this.extractKeyValues(val, "time"); if (this.timeMode == '实时触发') {
this.chartData.yData = this.extractKeyValues(val, "speed"); if (this.componentType == '车头时距') {
} else if (this.componentType == "类型") { this.chartData.xData = this.extractKeyValues(val, 'time');
this.chartData.xData = this.extractKeyValues(val, "time"); this.chartData.yData = this.extractKeyValues(val, 'headway');
let seriesArr = this.extractKeyValues(val, "type_data"); } else if (this.componentType == '流量') {
const transformedData = []; if (this.flowType == '入流') {
for (let i = 0; i < seriesArr[0].length; i++) { this.chartData.xData = this.extractKeyValues(val, 'time');
const item = seriesArr[0][i]; //quantity this.chartData.yData = this.extractKeyValues(val, 'in_flow');
const valueList = seriesArr.map((arr) => arr[i].value); } else if (this.flowType == '出流') {
transformedData.push({ this.chartData.xData = this.extractKeyValues(val, 'time');
name: item.name, this.chartData.yData = this.extractKeyValues(val, 'out_flow');
value: valueList, }
}); } else if (this.componentType == '速度') {
this.chartData.xData = this.extractKeyValues(val, 'time');
this.chartData.yData = this.extractKeyValues(val, 'speed');
} else if (this.componentType == '类型') {
this.chartData.xData = this.extractKeyValues(val, 'time');
let seriesArr = this.extractKeyValues(val, 'type_data');
const transformedData = [];
for (let i = 0; i < seriesArr[0].length; i++) {
const item = seriesArr[0][i]; //quantity
const valueList = seriesArr.map((arr) => arr[i].value);
transformedData.push({
name: item.name,
value: valueList
});
}
const totalCountList = transformedData[0].value.map((_, i) => {
return transformedData.reduce((sum, curr) => sum + curr.value[i], 0);
});
transformedData.push({
name: '总数',
value: totalCountList
});
this.seriesList = transformedData;
} else if (this.componentType == '检测数') {
this.chartData.xData = this.extractKeyValues(val, 'time');
this.chartData.yData = this.extractKeyValues(val, 'n_stay');
} else if (this.componentType == '排队数') {
this.chartData.xData = this.extractKeyValues(val, 'time');
this.chartData.yData = this.extractKeyValues(val, 'n_queue');
}
} else if (this.timeMode == '固定时刻') {
if (this.componentType == '车头时距') {
this.chartData.xData = this.extractKeyValues(val, 'time');
this.chartData.yData = this.extractKeyValues(val, 'headway');
} else if (this.componentType == '流量') {
if (this.flowType == '入流') {
this.chartData.xData = this.extractKeyValues(val, 'time');
this.chartData.yData = this.extractKeyValues(val, 'in_flow');
} else if (this.flowType == '出流') {
this.chartData.xData = this.extractKeyValues(val, 'time');
this.chartData.yData = this.extractKeyValues(val, 'out_flow');
}
} else if (this.componentType == '速度') {
this.chartData.xData = this.extractKeyValues(val, 'time');
this.chartData.yData = this.extractKeyValues(val, 'speed');
} else if (this.componentType == '类型') {
this.chartData.xData = this.extractKeyValues(val, 'time');
let seriesArr = this.extractKeyValues(val, 'type_data');
const transformedData = [];
for (let i = 0; i < seriesArr[0].length; i++) {
const item = seriesArr[0][i];
const valueList = seriesArr.map((arr) => arr[i].quantity);
transformedData.push({
name: item.name,
value: valueList
});
}
const totalCountList = transformedData[0].value.map((_, i) => {
return transformedData.reduce((sum, curr) => sum + curr.value[i], 0);
});
transformedData.push({
name: '总数',
value: totalCountList
});
this.seriesList = transformedData;
} else if (this.componentType == '检测数') {
this.chartData.xData = this.extractKeyValues(val, 'time');
this.chartData.yData = this.extractKeyValues(val, 'n_stay');
} else if (this.componentType == '排队数') {
this.chartData.xData = this.extractKeyValues(val, 'time');
this.chartData.yData = this.extractKeyValues(val, 'n_queue');
}
} else if (this.timeMode == '固定间隔') {
if (this.componentType == '车头时距') {
this.chartData.xData = this.extractKeyValues(val, 'time');
this.chartData.yData = this.extractKeyValues(val, 'ave_headway');
} else if (this.componentType == '流量') {
if (this.flowType == '入流') {
this.chartData.xData = this.extractKeyValues(val, 'time');
this.chartData.yData = this.extractKeyValues(val, 'in_flow');
} else if (this.flowType == '出流') {
this.chartData.xData = this.extractKeyValues(val, 'time');
this.chartData.yData = this.extractKeyValues(val, 'out_flow');
}
} else if (this.componentType == '速度') {
this.chartData.xData = this.extractKeyValues(val, 'time');
this.chartData.yData = this.extractKeyValues(val, 'speed');
} else if (this.componentType == '类型') {
this.chartData.xData = this.extractKeyValues(val, 'time');
let seriesArr = this.extractKeyValues(val, 'type_data');
const transformedData = [];
for (let i = 0; i < seriesArr[0].length; i++) {
const item = seriesArr[0][i];
const valueList = seriesArr.map((arr) => arr[i].quantity);
transformedData.push({
name: item.name,
value: valueList
});
}
const totalCountList = transformedData[0].value.map((_, i) => {
return transformedData.reduce((sum, curr) => sum + curr.value[i], 0);
});
transformedData.push({
name: '总数',
value: totalCountList
});
this.seriesList = transformedData;
} else if (this.componentType == '延误') {
this.chartData.xData = this.extractKeyValues(val, 'time');
this.chartData.yData = this.extractKeyValues(val, 'ave_delay');
} else if (this.componentType == '检测数') {
this.chartData.xData = this.extractKeyValues(val, 'time');
this.chartData.yData = this.extractKeyValues(val, 'ave_stay');
} else if (this.componentType == '排队数') {
this.chartData.xData = this.extractKeyValues(val, 'time');
this.chartData.yData = this.extractKeyValues(val, 'ave_queue');
}
}
} else {
return false;
} }
const totalCountList = transformedData[0].value.map((_, i) => { },
return transformedData.reduce((sum, curr) => sum + curr.value[i], 0); //初始化表格
}); initEcharts() {
transformedData.push({ if (this.componentType == '流量') {
name: "总数", this.title = '辆';
value: totalCountList, if (this.timeMode != '实时触发') {
}); this.title = `辆/${this.itemData.cycleInterval}${this.itemData.unit}`;
this.seriesList = transformedData; }
} else if (this.componentType == "检测数") { } else if (this.componentType == '速度') {
this.chartData.xData = this.extractKeyValues(val, "time"); if (this.dataList.length > 0) {
this.chartData.yData = this.extractKeyValues(val, "n_stay"); // console.log(this.dataList[0].originalSpeed,'速度速度速度速度')
} else if (this.componentType == "排队数") { if (this.dataList[0].originalSpeed >= 0) {
this.chartData.xData = this.extractKeyValues(val, "time"); this.title = 'km/h';
this.chartData.yData = this.extractKeyValues(val, "n_queue"); } else {
} this.title = 'pix/s';
} else if (this.timeMode == "固定时刻") { }
if (this.componentType == "车头时距") { }
this.chartData.xData = this.extractKeyValues(val, "time"); } else if (this.componentType == '排队数') {
this.chartData.yData = this.extractKeyValues(val, "headway"); this.title = '辆';
} else if (this.componentType == "流量") { if (this.timeMode != '实时触发') {
if (this.flowType == "入流") { this.title = `辆/${this.itemData.cycleInterval}${this.itemData.unit}`;
this.chartData.xData = this.extractKeyValues(val, "time"); }
this.chartData.yData = this.extractKeyValues(val, "in_flow"); } else if (this.componentType == '检测数') {
} else if (this.flowType == "出流") { this.title = '辆';
this.chartData.xData = this.extractKeyValues(val, "time"); if (this.timeMode != '实时触发') {
this.chartData.yData = this.extractKeyValues(val, "out_flow"); this.title = `辆/${this.itemData.cycleInterval}${this.itemData.unit}`;
}
} else if (this.componentType == '延误') {
this.title = '秒';
} else if (this.componentType == '拥堵') {
this.title = '秒';
} else if (this.componentType == '车头时距') {
this.title = '秒';
} else {
this.title = '';
} }
} else if (this.componentType == "速度") { // let slicedData = [];
this.chartData.xData = this.extractKeyValues(val, "time"); // if (data != undefined && data.length > 5) {
this.chartData.yData = this.extractKeyValues(val, "speed"); // slicedData =data.slice(-5); // 保留最后的 10 条数据
} else if (this.componentType == "类型") { // } else {
this.chartData.xData = this.extractKeyValues(val, "time"); // slicedData = data; // 如果数据不足 10 条，则保留全部数据
let seriesArr = this.extractKeyValues(val, "type_data"); // }
const transformedData = []; if (this.componentType == '类型') {
for (let i = 0; i < seriesArr[0].length; i++) { this.typeData.push({ type_data: this.dataList[0].type_data, time: this.dataList[0].time });
const item = seriesArr[0][i]; this.dataProcessing(this.typeData);
const valueList = seriesArr.map((arr) => arr[i].quantity); } else {
transformedData.push({ this.dataProcessing(this.dataList);
name: item.name,
value: valueList,
});
} }
const totalCountList = transformedData[0].value.map((_, i) => {
return transformedData.reduce((sum, curr) => sum + curr.value[i], 0); // let myChart = this.$echarts.getInstanceByDom(document.getElementById(this.echartsRef));
}); // if (myChart == null) {
transformedData.push({ // myChart = this.$echarts.init(document.getElementById(this.echartsRef));
name: "总数", // }
value: totalCountList, let myChart = this.chart;
}); // let myChart = this.$echarts.init(document.getElementById('echartsLine'));
this.seriesList = transformedData; var seriesList = [];
} else if (this.componentType == "检测数") { var color = ['#0CD2E6', '#3751E6', '#FFC722', 'rgb(255,115,38)'];
this.chartData.xData = this.extractKeyValues(val, "time"); if (this.componentType == '类型') {
this.chartData.yData = this.extractKeyValues(val, "n_stay"); for (let i = 0; i < this.seriesList.length; i++) {
} else if (this.componentType == "排队数") { seriesList.push({
this.chartData.xData = this.extractKeyValues(val, "time"); name: this.seriesList[i].name,
this.chartData.yData = this.extractKeyValues(val, "n_queue"); type: 'line',
} data: this.seriesList[i].value,
} else if (this.timeMode == "固定间隔") { symbolSize: 8, //标记的大小
if (this.componentType == "车头时距") { lineStyle: {
this.chartData.xData = this.extractKeyValues(val, "time"); color: color[i],
this.chartData.yData = this.extractKeyValues(val, "ave_headway"); width: 3,
} else if (this.componentType == "流量") { shadowColor: 'rgba(255,115,38,0.17)', //设置折线阴影
if (this.flowType == "入流") { shadowBlur: 5,
this.chartData.xData = this.extractKeyValues(val, "time"); shadowOffsetY: 9
this.chartData.yData = this.extractKeyValues(val, "in_flow"); },
} else if (this.flowType == "出流") { itemStyle: {
this.chartData.xData = this.extractKeyValues(val, "time"); //折线拐点标志的样式
this.chartData.yData = this.extractKeyValues(val, "out_flow"); color: color[i],
borderColor: color[i],
borderWidth: 2
},
smooth: 0.4,
emphasis: {
scale: 1.5
}
});
}
} else {
seriesList = [
{
// name: '流量_1-zone2-曲线图-实时触发',
type: 'line',
data: this.chartData.yData.reverse(),
symbolSize: 8, //标记的大小
lineStyle: {
color: 'rgb(255,115,38)',
width: 3,
shadowColor: 'rgba(255,115,38,0.17)', //设置折线阴影
shadowBlur: 5,
shadowOffsetY: 9
},
itemStyle: {
//折线拐点标志的样式
color: 'rgb(255,115,38)',
borderColor: 'rgb(255,115,38)',
borderWidth: 2
},
smooth: 0.4,
emphasis: {
scale: 1.5
}
}
];
} }
} else if (this.componentType == "速度") {
this.chartData.xData = this.extractKeyValues(val, "time"); let option = {
this.chartData.yData = this.extractKeyValues(val, "speed"); grid: {
} else if (this.componentType == "类型") { top: '25%',
this.chartData.xData = this.extractKeyValues(val, "time"); left: '5%',
let seriesArr = this.extractKeyValues(val, "type_data"); right: '5%',
const transformedData = []; bottom: '8%',
for (let i = 0; i < seriesArr[0].length; i++) { containLabel: true
const item = seriesArr[0][i]; },
const valueList = seriesArr.map((arr) => arr[i].quantity); tooltip: {
transformedData.push({ trigger: 'axis',
name: item.name, backgroundColor: 'rgba(1, 13, 19, 0.5)',
value: valueList, borderWidth: 1,
}); axisPointer: {
} type: 'shadow'
const totalCountList = transformedData[0].value.map((_, i) => { // label: {
return transformedData.reduce((sum, curr) => sum + curr.value[i], 0); // show: true,
// },
},
textStyle: {
color: 'rgba(212, 232, 254, 1)'
// fontSize: fontChart(0.24),
},
extraCssText: 'z-index:2'
},
legend: {
left: 'center',
top: 0,
left: '10%',
// itemWidth: 15,
// itemHeight: 10,
// itemGap: 15,
// borderRadius: 4,
textStyle: {
color: '#000',
fontSize: 14,
fontWeight: 400
}
// data: [
// {
// name: '流量_1-zone2-曲线图-实时触发',
// icon: 'circle'
// }
// ]
},
xAxis: {
type: 'category',
data: this.chartData.xData.reverse(),
axisLine: {
show: false
},
axisTick: {
show: false
},
axisLabel: {
show: true,
textStyle: {
color: '#393939' //X轴文字颜色
}
}
},
yAxis: [
{
type: 'value',
name: this.title,
nameTextStyle: {
color: '#000',
fontFamily: 'Alibaba PuHuiTi',
fontSize: 14,
fontWeight: 600
// padding: [0, 0, 0, 40], // 四个数字分别为上右下左与原位置距离
},
nameGap: 30, // 表现为上下位置
axisLine: {
show: true,
lineStyle: {
color: '#eeeeee'
}
},
axisTick: {
show: false
},
axisLabel: {
color: '#393939',
fontSize: 14
},
splitLine: {
show: true,
lineStyle: {
color: 'rgba(131,101,101,0.2)',
type: 'dashed'
}
}
}
],
series: seriesList
};
myChart.setOption(option);
window.addEventListener('resize', () => {
myChart.resize();
}); });
transformedData.push({
name: "总数",
value: totalCountList,
});
this.seriesList = transformedData;
} else if (this.componentType == "延误") {
this.chartData.xData = this.extractKeyValues(val, "time");
this.chartData.yData = this.extractKeyValues(val, "ave_delay");
} else if (this.componentType == "检测数") {
this.chartData.xData = this.extractKeyValues(val, "time");
this.chartData.yData = this.extractKeyValues(val, "ave_stay");
} else if (this.componentType == "排队数") {
this.chartData.xData = this.extractKeyValues(val, "time");
this.chartData.yData = this.extractKeyValues(val, "ave_queue");
}
} }
} else {
return false;
}
}, },
//初始化表格 mounted() {
initEcharts() {
if (this.componentType == '流量') {
this.title = '辆/10秒'
}else if (this.componentType == '车头时距') {
this.title = '秒'
}else{
this.title = ''
}
// let slicedData = [];
// if (data != undefined && data.length > 5) {
// slicedData =data.slice(-5); // 保留最后的 10 条数据
// } else {
// slicedData = data; // 如果数据不足 10 条，则保留全部数据
// }
if (this.componentType == "类型") {
this.typeData.push({ type_data: this.dataList[0].type_data,time:this.dataList[0].time });
this.dataProcessing(this.typeData);
} else {
this.dataProcessing(this.dataList);
}
// let myChart = this.$echarts.getInstanceByDom(document.getElementById(this.echartsRef));
// if (myChart == null) {
// myChart = this.$echarts.init(document.getElementById(this.echartsRef));
// }
let myChart = this.chart;
// let myChart = this.$echarts.init(document.getElementById('echartsLine'));
var seriesList = [];
var color = ["#0CD2E6", "#3751E6", "#FFC722", "rgb(255,115,38)"];
if (this.componentType == "类型") {
for (let i = 0; i < this.seriesList.length; i++) {
seriesList.push({
name: this.seriesList[i].name,
type: "line",
data: this.seriesList[i].value,
symbolSize: 8, //标记的大小
lineStyle: {
color: color[i],
width: 3,
shadowColor: "rgba(255,115,38,0.17)", //设置折线阴影
shadowBlur: 5,
shadowOffsetY: 9,
},
itemStyle: {
//折线拐点标志的样式
color: color[i],
borderColor: color[i],
borderWidth: 2,
},
smooth: 0.4,
emphasis: {
scale: 1.5,
},
});
}
} else {
seriesList = [
{
// name: '流量_1-zone2-曲线图-实时触发',
type: "line",
data: this.chartData.yData.reverse(),
symbolSize: 8, //标记的大小
lineStyle: {
color: "rgb(255,115,38)",
width: 3,
shadowColor: "rgba(255,115,38,0.17)", //设置折线阴影
shadowBlur: 5,
shadowOffsetY: 9,
},
itemStyle: {
//折线拐点标志的样式
color: "rgb(255,115,38)",
borderColor: "rgb(255,115,38)",
borderWidth: 2,
},
smooth: 0.4,
emphasis: {
scale: 1.5,
},
},
];
}
let option = {
grid: {
top: "25%",
left: "5%",
right: "5%",
bottom: "8%",
containLabel: true,
},
tooltip: {
trigger: "axis",
backgroundColor: "rgba(1, 13, 19, 0.5)",
borderWidth: 1,
axisPointer: {
type: "shadow",
// label: {
// show: true,
// },
},
textStyle: {
color: "rgba(212, 232, 254, 1)",
// fontSize: fontChart(0.24),
},
extraCssText: "z-index:2",
},
legend: {
left: "center",
top: 0,
left: "10%",
// itemWidth: 15,
// itemHeight: 10,
// itemGap: 15,
// borderRadius: 4,
textStyle: {
color: "#000",
fontSize: 14,
fontWeight: 400,
},
// data: [
// {
// name: '流量_1-zone2-曲线图-实时触发',
// icon: 'circle'
// }
// ]
},
xAxis: {
type: "category",
data: this.chartData.xData.reverse(),
axisLine: {
show: false,
},
axisTick: {
show: false,
},
axisLabel: {
show: true,
textStyle: {
color: "#393939", //X轴文字颜色
},
},
},
yAxis: [
{
type: "value",
name: this.title,
nameTextStyle: {
color: "#000",
fontFamily: "Alibaba PuHuiTi",
fontSize: 14,
fontWeight: 600,
// padding: [0, 0, 0, 40], // 四个数字分别为上右下左与原位置距离
},
nameGap: 30, // 表现为上下位置
axisLine: {
show: true,
lineStyle: {
color: "#eeeeee",
},
},
axisTick: {
show: false,
},
axisLabel: {
color: "#393939",
fontSize: 14,
},
splitLine: {
show: true,
lineStyle: {
color: "rgba(131,101,101,0.2)",
type: "dashed",
},
},
},
],
series: seriesList,
};
myChart.setOption(option);
window.addEventListener("resize", () => {
myChart.resize();
});
},
},
mounted() {
let that = this;
const $dom = document.getElementById(this.echartsRef);
$dom.style.width = "440px";
$dom.style.height = "260px";
setTimeout(() => {
that.$nextTick(() => {
this.chart = this.$echarts.getInstanceByDom(
document.getElementById(this.echartsRef)
);
if (this.chart == null) {
this.chart = this.$echarts.init(document.getElementById(this.echartsRef));
}
that.initEcharts();
});
}, 300);
},
watch: {
intersectionName: {
handler: function (oldValues, newValues) {
this.$nextTick(() => {
this.initEcharts();
});
},
},
chatShowType: {
handler: function (oldValues, newValues) {},
},
componentType: {
handler: function (oldValues, newValues) {},
},
dataList: {
handler: function (oldValues, newValues) {
this.$nextTick(() => {
this.chart = this.$echarts.getInstanceByDom(
document.getElementById(this.echartsRef)
);
if (this.chart == null) {
this.chart = this.$echarts.init(document.getElementById(this.echartsRef));
}
this.initEcharts();
});
},
},
echartsRef: {
handler: function (oldValues, newValues) {
console.log("old", oldValues);
console.log("newV", newValues);
let that = this; let that = this;
const $dom = document.getElementById(this.echartsRef);
$dom.style.width = '440px';
$dom.style.height = '260px';
setTimeout(() => { setTimeout(() => {
that.$nextTick(() => { that.$nextTick(() => {
this.chart = this.$echarts.getInstanceByDom( this.chart = this.$echarts.getInstanceByDom(document.getElementById(this.echartsRef));
document.getElementById(this.echartsRef) if (this.chart == null) {
); this.chart = this.$echarts.init(document.getElementById(this.echartsRef));
if (this.chart == null) { }
this.chart = this.$echarts.init(document.getElementById(this.echartsRef)); that.initEcharts();
} });
that.initEcharts();
});
}, 300); }, 300);
},
}, },
}, watch: {
intersectionName: {
handler: function (oldValues, newValues) {
this.$nextTick(() => {
this.initEcharts();
});
}
},
chatShowType: {
handler: function (oldValues, newValues) {}
},
componentType: {
handler: function (oldValues, newValues) {}
},
dataList: {
handler: function (oldValues, newValues) {
this.$nextTick(() => {
this.chart = this.$echarts.getInstanceByDom(document.getElementById(this.echartsRef));
if (this.chart == null) {
this.chart = this.$echarts.init(document.getElementById(this.echartsRef));
}
this.initEcharts();
});
}
},
echartsRef: {
handler: function (oldValues, newValues) {
console.log('old', oldValues);
console.log('newV', newValues);
let that = this;
setTimeout(() => {
that.$nextTick(() => {
this.chart = this.$echarts.getInstanceByDom(document.getElementById(this.echartsRef));
if (this.chart == null) {
this.chart = this.$echarts.init(document.getElementById(this.echartsRef));
}
that.initEcharts();
});
}, 300);
}
}
}
}; };
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
#echartsLine { #echartsLine {
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
</style> </style>

3
src/components/sensorFusion/echartsPie.vue
View File

@ -56,9 +56,6 @@ export default {
initEcharts() { initEcharts() {
let seriesData = null; let seriesData = null;
let myChart = this.chart; let myChart = this.chart;
console.log('initEcharts',this.dataList)
if (this.timeMode == "实时触发") { if (this.timeMode == "实时触发") {
seriesData = null; seriesData = null;
this.renameField(this.dataList[0].type_data, "quantity", "value"); this.renameField(this.dataList[0].type_data, "quantity", "value");

98
src/components/target/typeChart.vue
View File

@ -214,19 +214,21 @@
</div> </div>
</div> </div>
<div v-if="pageType == '断面'" style="margin-bottom: 20px; border: 1px solid #e4e7ed"> <div v-if="pageType == '断面'" style="margin-bottom: 20px; border: 1px solid #e4e7ed">
<tableShow :msg="newDataArr" :triggerType="triggerType" /> <tableShow :msg="newDataArrAbs" :triggerType="triggerType" />
</div> </div>
<div v-if="pageType == '区域'"> <div v-if="pageType == '区域'">
<regionTable :msg="newDataArr" :triggerType="triggerType" /> <regionTable :msg="newDataArrAbs" :triggerType="triggerType" />
</div> </div>
</div> </div>
<div class="border" v-if="echartArr.includes('曲线图')"> <div class="border" v-if="echartArr.includes('曲线图')">
<detailDialog /> <detailDialog />
<lineChart <lineChart
:componentName="componentName" :componentName="componentName"
:itemData="itemData"
:originalDataArr="newDataArr"
:chartName="chartName" :chartName="chartName"
:pageType="pageType" :pageType="pageType"
:list="newDataArr" :list="newDataArrAbs"
:status="triggerType" :status="triggerType"
:title="title" :title="title"
:typeValue="typeValue" :typeValue="typeValue"
@ -239,7 +241,7 @@
:componentName="componentName" :componentName="componentName"
:chartName="chartName" :chartName="chartName"
:pageType="pageType" :pageType="pageType"
:list="newDataArr" :list="newDataArrAbs"
:status="triggerType" :status="triggerType"
:title="title" :title="title"
:typeValue="typeValue" :typeValue="typeValue"
@ -253,7 +255,7 @@
:componentName="componentName" :componentName="componentName"
:chartName="chartName" :chartName="chartName"
:pageType="pageType" :pageType="pageType"
:list="newDataArr" :list="newDataArrAbs"
:status="triggerType" :status="triggerType"
:title="title" :title="title"
:typeValue="typeValue" :typeValue="typeValue"
@ -265,7 +267,7 @@
:componentName="componentName" :componentName="componentName"
:chartName="chartName" :chartName="chartName"
:pageType="pageType" :pageType="pageType"
:list="newDataArr" :list="newDataArrAbs"
:status="triggerType" :status="triggerType"
:title="title" :title="title"
:typeValue="typeValue" :typeValue="typeValue"
@ -277,7 +279,7 @@
<thermalChart <thermalChart
:componentName="componentName" :componentName="componentName"
:pageType="pageType" :pageType="pageType"
:list="newDataArr" :list="newDataArrAbs"
:status="triggerType" :status="triggerType"
:title="title" :title="title"
:typeValue="typeValue" :typeValue="typeValue"
@ -298,7 +300,18 @@ import regionTable from '../chart/regionTable.vue';
import thermalChart from '../chart/thermalChart.vue'; import thermalChart from '../chart/thermalChart.vue';
export default { export default {
name: 'typeChart', //类型组件 name: 'typeChart', //类型组件
props: ['typeValue', 'pageType', 'triggerType', 'dataArr', 'echartArr', 'componentName', 'title', 'chartName', 'startEndData'], props: [
'typeValue',
'itemData',
'pageType',
'triggerType',
'dataArr',
'echartArr',
'componentName',
'title',
'chartName',
'startEndData'
],
components: { components: {
lineChart, lineChart,
barChart, barChart,
@ -330,13 +343,13 @@ export default {
methods: { methods: {
// 计算类型数量的总和 // 计算类型数量的总和
getDataArr(val) { getDataArr(val) {
console.log('getDataArr', val); // console.log('getDataArr', val);
this.newDataArr = val; this.newDataArr = val;
this.getNewQueue(this.newDataArr); this.getNewQueue(this.newDataArr);
}, },
//周期统计实时累计数据 //周期统计实时累计数据
getcycleAccumulateDataArr(val) { getcycleAccumulateDataArr(val) {
console.log('getcycleAccumulateDataArr', val); // console.log('getcycleAccumulateDataArr', val);
this.cycleAccumulateDataArr = val; this.cycleAccumulateDataArr = val;
this.getNewQueue2(this.cycleAccumulateDataArr); this.getNewQueue2(this.cycleAccumulateDataArr);
}, },
@ -390,7 +403,70 @@ export default {
}, },
computed: { computed: {
// 获取类型的总数量 // 处理数据图表数据-1需要改成‘-’
newDataArrAbs() {
// console.log('newDataArrAbs1', this.newDataArr);
let arr = [];
if (this.newDataArr.length > 0) {
let newlist = JSON.parse(JSON.stringify(this.newDataArr));
for (const item of newlist) {
if (!isNaN(item.speed) && (item.speed !== -1 || item.speed === 0)) {
item.speed = Math.abs(item.speed);
} else {
item.speed = '-';
}
if (!isNaN(item.flow) && (item.headway !== -1 || item.headway === 0)) {
item.flow = item.flow;
} else {
item.flow = '-';
}
if (!isNaN(item.headway) && (item.headway !== -1 || item.headway === 0)) {
item.headway = item.headway;
} else {
item.headway = '-';
}
if (!isNaN(item.n_stay) && (item.n_stay !== -1 || item.n_stay === 0)) {
item.n_stay = item.n_stay;
} else {
item.n_stay = '-';
}
if (!isNaN(item.n_queue) && (item.n_queue !== -1 || item.n_queue === 0)) {
item.n_queue = item.n_queue;
} else {
item.n_queue = '-';
}
if (!isNaN(item.ave_queue) && (item.ave_queue !== -1 || item.ave_queue === 0)) {
item.n_queue = item.ave_queue;
} else {
item.ave_queue = '-';
}
if (!isNaN(item.ave_delay) && (item.ave_delay !== -1 || item.ave_delay === 0)) {
item.ave_delay = item.ave_delay;
} else {
item.ave_delay = '-';
}
if (!isNaN(item.in_spd) && (item.in_spd !== -1 || item.in_spd === 0)) {
item.in_spd = item.in_spd;
} else {
item.in_spd = '-';
}
if (!isNaN(item.out_spd) && (item.out_spd !== -1 || item.out_spd === 0)) {
item.out_spd = item.out_spd;
} else {
item.out_spd = '-';
}
arr.push(Object.assign({}, item));
}
}
// console.log('triggerType',this.triggerType)
// console.log('newDataArrAbs2', arr);
return arr;
}
}, },
mounted() {}, mounted() {},
watch: { watch: {

86
src/views/AnalysisMain.vue
View File

@ -239,14 +239,14 @@ export default {
//离开当前页面后执行 //离开当前页面后执行
destroyed: function () { destroyed: function () {
// console.log("离开当前页") // //console.log("离开当前页")
// client.end(); // client.end();
}, },
created() { created() {
this.getVideoList(); this.getVideoList();
}, },
mounted() { mounted() {
console.log(localStorage.getItem('roleName'), 'session存储'); //console.log(localStorage.getItem('roleName'), 'session存储');
if (localStorage.getItem('roleName') == '系统管理员') { if (localStorage.getItem('roleName') == '系统管理员') {
this.disable = false; this.disable = false;
} else { } else {
@ -260,7 +260,7 @@ export default {
if (newVal) { if (newVal) {
newVal.forEach((item) => { newVal.forEach((item) => {
if (item.status == '加载中') { if (item.status == '加载中') {
console.log('加载中', item); //console.log('加载中', item);
setTimeout(() => { setTimeout(() => {
this.getVideoList(); this.getVideoList();
}, 10000); }, 10000);
@ -291,14 +291,14 @@ export default {
} }
}) })
.catch((err) => { .catch((err) => {
console.log(err); //console.log(err);
}); });
}, },
changeChepai() {}, changeChepai() {},
//传输视频源类型 //传输视频源类型
SetVideoMode(val) { SetVideoMode(val) {
getSetVideoMode({ Mode: val }).then((res) => { getSetVideoMode({ Mode: val }).then((res) => {
console.log('res', res); //console.log('res', res);
}); });
}, },
changeRadio() { changeRadio() {
@ -307,21 +307,21 @@ export default {
//获取视频源类型 //获取视频源类型
getVideoType() { getVideoType() {
getVideoMode().then((res) => { getVideoMode().then((res) => {
console.log('res', res.data.data); //console.log('res', res.data.data);
this.videoTypeForm.videoType = res.data.data; this.videoTypeForm.videoType = res.data.data;
}); });
}, },
/** 创建mqtt */ /** 创建mqtt */
createMqtt() { createMqtt() {
console.log('this.videoTypeForm.videoType', this.videoTypeForm.videoType); //console.log('this.videoTypeForm.videoType', this.videoTypeForm.videoType);
//创建链接，接收数据 //创建链接，接收数据
if (this.videoTypeForm.videoType == '实时视频') { if (this.videoTypeForm.videoType == '实时视频') {
this.topicSends = ['hert', 'img0', 'img1', 'img2', 'img3', 'img4', 'img5', 'img6', 'img7', 'Contorl_server']; this.topicSends = ['hert', 'img0', 'img1', 'img2', 'img3', 'img4', 'img5', 'img6', 'img7', 'Contorl_server'];
console.log('this.videoTypeForm.videoType', this.videoTypeForm.videoType); //console.log('this.videoTypeForm.videoType', this.videoTypeForm.videoType);
window.PubScribe(this.topicSends, -1, this.realInfo, false, 'videoId'); window.PubScribe(this.topicSends, -1, this.realInfo, false, 'videoId');
window.publish('Custom', JSON.stringify({ type: 'getImage', videoid: 'all' })); window.publish('Custom', JSON.stringify({ type: 'getImage', videoid: 'all' }));
} else if (this.videoTypeForm.videoType == '离线视频') { } else if (this.videoTypeForm.videoType == '离线视频') {
console.log('this.videoTypeForm.videoType', this.videoTypeForm.videoType); //console.log('this.videoTypeForm.videoType', this.videoTypeForm.videoType);
this.topicSends = ['VideoStatusData']; this.topicSends = ['VideoStatusData'];
window.PubScribe(this.topicSends, '001', this.realInfo, false, 'videoId'); window.PubScribe(this.topicSends, '001', this.realInfo, false, 'videoId');
} }
@ -335,7 +335,7 @@ export default {
}, },
/** 实时数据分类 */ /** 实时数据分类 */
realInfo(topic, message) { realInfo(topic, message) {
// console.log("topic",topic) // //console.log("topic",topic)
switch (topic) { switch (topic) {
// 接收托片 // 接收托片
case 'img0': case 'img0':
@ -355,7 +355,7 @@ export default {
// var newArr = [] // var newArr = []
//msg为转换后的JSON数据 //msg为转换后的JSON数据
if (msg.rate == 'low') { if (msg.rate == 'low') {
// console.log('msg', msg); // //console.log('msg', msg);
if (this.videoList.length != 0) { if (this.videoList.length != 0) {
for (let i = 0; i < this.videoList.length; i++) { for (let i = 0; i < this.videoList.length; i++) {
if (msg.id == this.videoList[i].id) { if (msg.id == this.videoList[i].id) {
@ -399,7 +399,7 @@ export default {
// } // }
// this.imgUrl3 = 'data:image/png;base64,' + msg.pic; // this.imgUrl3 = 'data:image/png;base64,' + msg.pic;
// console.log("imageUrl", imageUrl) // //console.log("imageUrl", imageUrl)
} catch (error) {} } catch (error) {}
break; break;
case 'hert': case 'hert':
@ -408,7 +408,7 @@ export default {
const u8arr = new Uint8Array(message); const u8arr = new Uint8Array(message);
const temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串 const temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串
const msg = JSON.parse(temp); //这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据 const msg = JSON.parse(temp); //这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据
// console.log("hert", msg) //msg为转换后的JSON数据 // //console.log("hert", msg) //msg为转换后的JSON数据
if (msg == '') { if (msg == '') {
} }
} catch (error) {} } catch (error) {}
@ -419,7 +419,7 @@ export default {
const u8arr = new Uint8Array(message); const u8arr = new Uint8Array(message);
const temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串 const temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串
const msg = JSON.parse(temp); //这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据 const msg = JSON.parse(temp); //这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据
console.log('VideoStatusData', msg); //msg为转换后的JSON数据 //console.log('VideoStatusData', msg); //msg为转换后的JSON数据
this.changeStatus(msg); this.changeStatus(msg);
} catch (error) {} } catch (error) {}
break; break;
@ -437,7 +437,7 @@ export default {
this.videoList[i].numSatus = parseFloat(numSatusN.toFixed(2)); this.videoList[i].numSatus = parseFloat(numSatusN.toFixed(2));
} else if (msg.type == 'video_analyzed' && msg.video_id == this.videoList[i].id) { } else if (msg.type == 'video_analyzed' && msg.video_id == this.videoList[i].id) {
//已分析 //已分析
console.log('已分析'); //console.log('已分析');
this.videoList[i].videoAnalysisStatus = '已分析'; this.videoList[i].videoAnalysisStatus = '已分析';
var ip = window.location.host; var ip = window.location.host;
var ipData = 'http://' + ip.split(':')[0]; var ipData = 'http://' + ip.split(':')[0];
@ -445,11 +445,11 @@ export default {
this.videoList[i].img = ipData + msg.pic_path; this.videoList[i].img = ipData + msg.pic_path;
} else if (msg.type == 'video_analyse_unusual' && msg.video_id == this.videoList[i].id) { } else if (msg.type == 'video_analyse_unusual' && msg.video_id == this.videoList[i].id) {
//分析异常 //分析异常
console.log('分析异常'); //console.log('分析异常');
this.videoList[i].videoAnalysisStatus = '分析异常'; this.videoList[i].videoAnalysisStatus = '分析异常';
} else if (msg.type == 'video_loading' && msg.video_id == this.videoList[i].id) { } else if (msg.type == 'video_loading' && msg.video_id == this.videoList[i].id) {
//分析异常 //分析异常
console.log('加载中'); //console.log('加载中');
this.videoList[i].videoAnalysisStatus = '加载中'; this.videoList[i].videoAnalysisStatus = '加载中';
} }
} }
@ -503,10 +503,10 @@ export default {
informationInfo(data, item) { informationInfo(data, item) {
if (data == '新增') { if (data == '新增') {
var random = this.generateMixed(3); var random = this.generateMixed(3);
console.log('random', random); //console.log('random', random);
// console.log("this.file",this.file) // //console.log("this.file",this.file)
// this.file = undefined // this.file = undefined
console.log('this.$refs.inputer', this.$refs.inputer); //console.log('this.$refs.inputer', this.$refs.inputer);
(this.form = { (this.form = {
radio: '', radio: '',
videoName: '视频' + random, videoName: '视频' + random,
@ -519,7 +519,7 @@ export default {
} }
}, },
open(item) { open(item) {
console.log('item', item); //console.log('item', item);
this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', { this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
confirmButtonText: '确定', confirmButtonText: '确定',
cancelButtonText: '取消', cancelButtonText: '取消',
@ -527,7 +527,7 @@ export default {
}) })
.then(() => { .then(() => {
getDeleteShipjk({ VideoId: item }).then((res) => { getDeleteShipjk({ VideoId: item }).then((res) => {
console.log('res', res); //console.log('res', res);
this.$message({ this.$message({
type: 'success', type: 'success',
message: '删除成功!' message: '删除成功!'
@ -543,7 +543,7 @@ export default {
}); });
}, },
openRight(item) { openRight(item) {
console.log('item', item); //console.log('item', item);
startVideoAnalysis(item.id).then((res) => { startVideoAnalysis(item.id).then((res) => {
// //
if (res.data.msg == '请求成功') { if (res.data.msg == '请求成功') {
@ -569,7 +569,7 @@ export default {
// //
commit(form) { commit(form) {
console.log('form', form); //console.log('form', form);
let formData = new FormData(); let formData = new FormData();
formData.append('VideoName', form.videoName); formData.append('VideoName', form.videoName);
formData.append('VideoType', this.videoTypeForm.videoType); formData.append('VideoType', this.videoTypeForm.videoType);
@ -585,7 +585,7 @@ export default {
url: serverUrl.dataUrl, url: serverUrl.dataUrl,
data: formData data: formData
}).then((res) => { }).then((res) => {
console.log('提交按钮', res); //console.log('提交按钮', res);
if (res.data.msg == '添加成功') { if (res.data.msg == '添加成功') {
this.$message({ this.$message({
message: res.data.msg, message: res.data.msg,
@ -623,7 +623,7 @@ export default {
applicationBtn() { applicationBtn() {
// this.createMqtt() // this.createMqtt()
getApplication().then((res) => { getApplication().then((res) => {
console.log('res', res); //console.log('res', res);
if (res.data.code == 200) { if (res.data.code == 200) {
const loading = this.$loading({ const loading = this.$loading({
lock: true, lock: true,
@ -653,7 +653,7 @@ export default {
//停止 //停止
stopAlgorithmBtn() { stopAlgorithmBtn() {
getStopAlgorithm().then((res) => { getStopAlgorithm().then((res) => {
console.log('res', res); //console.log('res', res);
if (res.data.code == 200) { if (res.data.code == 200) {
this.getVideoList(); this.getVideoList();
this.$message({ this.$message({
@ -671,7 +671,7 @@ export default {
}, },
load(event) { load(event) {
let size = null; let size = null;
console.log(this.file, 'this.file.size'); //console.log(this.file, 'this.file.size');
if (this.file == undefined) { if (this.file == undefined) {
this.$message.warning('请上传文件!!!'); this.$message.warning('请上传文件!!!');
} else { } else {
@ -702,7 +702,7 @@ export default {
background: 'rgba(0, 0, 0, 0.7)' background: 'rgba(0, 0, 0, 0.7)'
}); });
console.log('loadingN', loadingN.text); //console.log('loadingN', loadingN.text);
let count = arrFile.length; let count = arrFile.length;
let filename = this.file.name + '~' + this.guid(); let filename = this.file.name + '~' + this.guid();
for (var i = 0; i < count; i++) { for (var i = 0; i < count; i++) {
@ -755,7 +755,7 @@ export default {
} }
}) })
.catch((e) => { .catch((e) => {
console.log(e); //console.log(e);
}); });
} }
this.clearShownWarnings(); this.clearShownWarnings();
@ -763,13 +763,13 @@ export default {
} }
}, },
goToPage(videoAnalysisStatus, id, num, name, type, status, msg, videoPath) { goToPage(videoAnalysisStatus, id, num, name, type, status, msg, videoPath) {
console.log('id', id); //console.log('id', id);
console.log('num', num); //console.log('num', num);
console.log('name', name); //console.log('name', name);
console.log('type', type); //console.log('type', type);
console.log('status', status); //console.log('status', status);
console.log('msg', msg); //console.log('msg', msg);
console.log('videoAnalysisStatus', videoAnalysisStatus); //console.log('videoAnalysisStatus', videoAnalysisStatus);
if (type == '离线视频') { if (type == '离线视频') {
if (videoAnalysisStatus != '已分析') { if (videoAnalysisStatus != '已分析') {
} else if (videoAnalysisStatus == '已分析') { } else if (videoAnalysisStatus == '已分析') {
@ -804,7 +804,7 @@ export default {
//获取视频数据 //获取视频数据
getVideoList() { getVideoList() {
getGetShipjk().then((res) => { getGetShipjk().then((res) => {
console.log('res', res); //console.log('res', res);
if (res.data.msg == '成功') { if (res.data.msg == '成功') {
// if(val=='重启'){ // if(val=='重启'){
setTimeout(() => { setTimeout(() => {
@ -820,7 +820,7 @@ export default {
} else { } else {
this.SetVideoMode(this.videoTypeForm.videoType); this.SetVideoMode(this.videoTypeForm.videoType);
} }
// console.log("this.videoTypeForm.videoType",this.videoTypeForm.videoType) // //console.log("this.videoTypeForm.videoType",this.videoTypeForm.videoType)
var arr = []; var arr = [];
var ip = window.location.host; var ip = window.location.host;
var ipData = 'http://' + ip.split(':')[0]; var ipData = 'http://' + ip.split(':')[0];
@ -866,7 +866,7 @@ export default {
} }
}); });
this.videoList = arr; this.videoList = arr;
console.log('arrarrarrarr', this.videoList); //console.log('arrarrarrarr', this.videoList);
if (this.videoList.length == '0') { if (this.videoList.length == '0') {
this.videoTypeShow = true; this.videoTypeShow = true;
} else { } else {
@ -874,7 +874,7 @@ export default {
} }
//图片更新 //图片更新
let highPicList = sessionStorage.getItem('highPicList') ? JSON.parse(sessionStorage.getItem('highPicList')) : []; let highPicList = sessionStorage.getItem('highPicList') ? JSON.parse(sessionStorage.getItem('highPicList')) : [];
console.log(highPicList, 'highPicList'); //console.log(highPicList, 'highPicList');
if (this.videoList.length != 0 && highPicList.length > 0) { if (this.videoList.length != 0 && highPicList.length > 0) {
for (let i = 0; i < this.videoList.length; i++) { for (let i = 0; i < this.videoList.length; i++) {
for (let j = 0; j < highPicList.length; j++) { for (let j = 0; j < highPicList.length; j++) {
@ -889,10 +889,10 @@ export default {
}, },
handleRemove(file, fileList) { handleRemove(file, fileList) {
console.log(file, fileList); //console.log(file, fileList);
}, },
handlePreview(file) { handlePreview(file) {
console.log(file); //console.log(file);
}, },
handleExceed(files, fileList) { handleExceed(files, fileList) {
this.$message.warning( this.$message.warning(

2
src/views/bounced/analysisConfiguration.vue
View File

@ -1458,7 +1458,7 @@ export default {
// 测试：订阅本机IP // 测试：订阅本机IP
// host: host, // host: host,
// port: port, // port: port,
// host:"172.16.1.168:10086", // host:"ç",
keepalive: 60, // 心跳时间，默认60s，设置为0禁用 keepalive: 60, // 心跳时间，默认60s，设置为0禁用
username: "admin", // 用户名（可选） username: "admin", // 用户名（可选）
password: "123456", // 密码（可选） password: "123456", // 密码（可选）

2
src/views/bounced/analysisPreview.vue
View File

@ -67,7 +67,7 @@ export default {
// const host = 'ws://49.234.27.18:10087/'; // 一个测试用url，改成给的，ws://broker.emqx.io:8083/mqtt // const host = 'ws://49.234.27.18:10087/'; // 一个测试用url，改成给的，ws://broker.emqx.io:8083/mqtt
var ip = window.location.host.split(":")[0]; var ip = window.location.host.split(":")[0];
console.log("ip",ip) console.log("ip",ip)
const host = `ws://${ip}:10087`; const host = `ws://${ip}:10087`;
// const host = 'ws://172.16.1.168:10087/'; // const host = 'ws://172.16.1.168:10087/';
const options = { const options = {

55
src/views/bounced/dataBoard.vue
View File

@ -25,6 +25,7 @@
<typeChart <typeChart
ref="typeChartRef" ref="typeChartRef"
v-if="o.timeMode === '实时触发'" v-if="o.timeMode === '实时触发'"
:itemData="o"
:pageType="o.graphicType" :pageType="o.graphicType"
:triggerType="o.timeMode" :triggerType="o.timeMode"
:componentName="o.componentName" :componentName="o.componentName"
@ -38,6 +39,7 @@
<typeChart <typeChart
ref="typeChartRef1" ref="typeChartRef1"
v-if="o.timeMode === '固定时刻'" v-if="o.timeMode === '固定时刻'"
:itemData="o"
:pageType="o.graphicType" :pageType="o.graphicType"
:triggerType="o.timeMode" :triggerType="o.timeMode"
:componentName="o.componentName" :componentName="o.componentName"
@ -54,6 +56,7 @@
ref="typeChartRef2" ref="typeChartRef2"
style="width: 100%" style="width: 100%"
v-if="o.timeMode === '固定间隔'" v-if="o.timeMode === '固定间隔'"
:itemData="o"
:pageType="o.graphicType" :pageType="o.graphicType"
:triggerType="o.timeMode" :triggerType="o.timeMode"
:componentName="o.componentName" :componentName="o.componentName"
@ -172,7 +175,7 @@ export default {
// }, // },
created() { created() {
// this.getNew() // this.getNew()
// console.log("cycleHistoryData",this.cycleHistoryData) // //console.log("cycleHistoryData",this.cycleHistoryData)
}, },
methods: { methods: {
// 手风琴下拉切换 // 手风琴下拉切换
@ -188,7 +191,7 @@ export default {
// this.idVal = ; // this.idVal = ;
getComponentSection({ VideoId: this.$route.query.id, Number: 10 }).then((res) => { getComponentSection({ VideoId: this.$route.query.id, Number: 10 }).then((res) => {
if (res.data.code == 200) { if (res.data.code == 200) {
console.log(res.data.data, '组件的数据'); //console.log(res.data.data, '组件的数据');
this.componentList = res.data.data; this.componentList = res.data.data;
this.siftData(); this.siftData();
} }
@ -200,7 +203,7 @@ export default {
this.sectionData = []; this.sectionData = [];
this.classify = []; this.classify = [];
this.componentList.forEach((val) => { this.componentList.forEach((val) => {
// console.log("val",val) // //console.log("val",val)
this.sectionArr.push(val.combinationName); this.sectionArr.push(val.combinationName);
this.sectionArr = Array.from(new Set(this.sectionArr)); this.sectionArr = Array.from(new Set(this.sectionArr));
}); });
@ -225,7 +228,7 @@ export default {
}, },
// 组件图标点击下拉事件 // 组件图标点击下拉事件
sectionHandle(i) { sectionHandle(i) {
let sections = document.querySelectorAll('.section'); // let sections = document.querySelectorAll('.section');
let sectionBox = document.querySelectorAll('.sectionBox'); let sectionBox = document.querySelectorAll('.sectionBox');
let downPulls1 = document.querySelectorAll('.downPull1'); let downPulls1 = document.querySelectorAll('.downPull1');
// 断面的小图标 // 断面的小图标
@ -293,12 +296,12 @@ export default {
}, },
componentList: { componentList: {
handler(newVal) { handler(newVal) {
console.log('componentList', newVal); //console.log('componentList', newVal);
if (newVal != undefined && newVal.length != 0) { if (newVal != undefined && newVal.length != 0) {
newVal.forEach((ele) => { newVal.forEach((ele) => {
if (ele.timeMode == '固定间隔' && this.$route.query.type == '实时视频') { if (ele.timeMode == '固定间隔' && this.$route.query.type == '实时视频') {
console.log('实时视频', '固定间隔'); //console.log('实时视频', '固定间隔');
this.$nextTick(() => { this.$nextTick(() => {
// var thatNN = this; // var thatNN = this;
ele.cycleStatisticsData.forEach((item) => { ele.cycleStatisticsData.forEach((item) => {
@ -308,13 +311,13 @@ export default {
}); });
if (this.$refs.typeChartRef2 != undefined) { if (this.$refs.typeChartRef2 != undefined) {
// // 轮循固定时刻生成的各类组件 // // 轮循固定时刻生成的各类组件
console.log('轮循固定时刻生成的各类组件') //console.log('轮循固定时刻生成的各类组件')
this.getRef(this.$refs.typeChartRef2, ele.timeMode); this.getRef(this.$refs.typeChartRef2, ele.timeMode);
} }
}); });
} }
if (ele.timeMode == '固定时刻' && this.$route.query.type == '实时视频') { if (ele.timeMode == '固定时刻' && this.$route.query.type == '实时视频') {
console.log('实时视频', '固定时刻'); //console.log('实时视频', '固定时刻');
this.$nextTick(() => { this.$nextTick(() => {
ele.cycleTimeData.forEach((item) => { ele.cycleTimeData.forEach((item) => {
if (item.type_data != null) { if (item.type_data != null) {
@ -396,8 +399,8 @@ export default {
cycleHistoryData: { cycleHistoryData: {
handler(newVal) { handler(newVal) {
// debugger // debugger
console.log('历史', newVal); //console.log('历史', newVal);
// console.log("历史",oldVal) // //console.log("历史",oldVal)
if (newVal != undefined) { if (newVal != undefined) {
// newVal.forEach(ele => { // newVal.forEach(ele => {
if (newVal.CycleStatisticsData) { if (newVal.CycleStatisticsData) {
@ -460,9 +463,9 @@ export default {
// 处理过的触发数据 // 处理过的触发数据
triggerListData: { triggerListData: {
handler(newVal) { handler(newVal) {
// console.log("newVal",newVal,'流量数据') // //console.log("newVal",newVal,'流量数据')
this.triggerList = newVal; this.triggerList = newVal;
// console.log("oldVal",oldVal) // //console.log("oldVal",oldVal)
// 触发数据 // 触发数据
var _this = this; var _this = this;
if (newVal.length != 0 && _this.sectionData) { if (newVal.length != 0 && _this.sectionData) {
@ -472,8 +475,8 @@ export default {
} }
newVal.forEach((item) => { newVal.forEach((item) => {
if (ele.analogAreaComponentId == item.component_id && ele.timeMode == '实时触发') { if (ele.analogAreaComponentId == item.component_id && ele.timeMode == '实时触发') {
// console.log(ele.analogAreaComponentId, 'analogAreaComponentId'); // //console.log(ele.analogAreaComponentId, 'analogAreaComponentId');
// console.log(item.component_id, 'component_id'); // //console.log(item.component_id, 'component_id');
if (ele.trigger.length == 10) { if (ele.trigger.length == 10) {
ele.trigger.pop(); ele.trigger.pop();
} }
@ -494,7 +497,7 @@ export default {
_this.$nextTick(() => { _this.$nextTick(() => {
if (_this.$refs.typeChartRef != undefined) { if (_this.$refs.typeChartRef != undefined) {
for (let i = 0; i < _this.$refs.typeChartRef.length; i++) { for (let i = 0; i < _this.$refs.typeChartRef.length; i++) {
// console.log(_this.$refs.typeChartRef[i], '触发接收的表格数据'); // //console.log(_this.$refs.typeChartRef[i], '触发接收的表格数据');
let itemTypeChart = _this.$refs.typeChartRef[i]; let itemTypeChart = _this.$refs.typeChartRef[i];
if (itemTypeChart.dataArr != undefined && itemTypeChart.dataArr.length != 0) { if (itemTypeChart.dataArr != undefined && itemTypeChart.dataArr.length != 0) {
if (itemTypeChart.echartArr.includes('时间曲线图')) { if (itemTypeChart.echartArr.includes('时间曲线图')) {
@ -549,7 +552,7 @@ export default {
cycleTimeData: { cycleTimeData: {
handler(newVal) { handler(newVal) {
// 监听到打印固定时刻数据 // 监听到打印固定时刻数据
// console.log(newVal, '固定时刻数据'); // //console.log(newVal, '固定时刻数据');
if (newVal != undefined && newVal.length != 0 && this.sectionData) { if (newVal != undefined && newVal.length != 0 && this.sectionData) {
var thatN = this; var thatN = this;
@ -576,7 +579,7 @@ export default {
// thatN.$nextTick(() => { // thatN.$nextTick(() => {
if (thatN.$refs.typeChartRef1 != undefined) { if (thatN.$refs.typeChartRef1 != undefined) {
// console.log("thatN.$refs.typeChartRef1",thatN.$refs.typeChartRef1) // //console.log("thatN.$refs.typeChartRef1",thatN.$refs.typeChartRef1)
// 轮循固定时刻生成的各类组件 // 轮循固定时刻生成的各类组件
for (let i = 0; i < thatN.$refs.typeChartRef1.length; i++) { for (let i = 0; i < thatN.$refs.typeChartRef1.length; i++) {
let itemTypeChartRef1 = thatN.$refs.typeChartRef1[i]; let itemTypeChartRef1 = thatN.$refs.typeChartRef1[i];
@ -654,7 +657,7 @@ export default {
// // ele.cycleTimeData.unshift(item); // // ele.cycleTimeData.unshift(item);
// // _thatN.$nextTick(() => { // // _thatN.$nextTick(() => {
// if (_thatN.$refs.typeChartRef1 != undefined) { // if (_thatN.$refs.typeChartRef1 != undefined) {
// // console.log("thatN.$refs.typeChartRef1",_thatN.$refs.typeChartRef1) // // //console.log("thatN.$refs.typeChartRef1",_thatN.$refs.typeChartRef1)
// // 轮循固定时刻生成的各类组件 // // 轮循固定时刻生成的各类组件
// for (let i = 0; i < _thatN.$refs.typeChartRef1.length; i++) { // for (let i = 0; i < _thatN.$refs.typeChartRef1.length; i++) {
// let itemTypeChartRef1 = thatN.$refs.typeChartRef1[i] // let itemTypeChartRef1 = thatN.$refs.typeChartRef1[i]
@ -697,7 +700,7 @@ export default {
//固定间隔 //固定间隔
cycleStatisticsData: { cycleStatisticsData: {
handler(newVal) { handler(newVal) {
console.log('固定间隔', newVal); //console.log('固定间隔', newVal);
if (newVal != undefined && newVal.length != 0 && this.sectionData) { if (newVal != undefined && newVal.length != 0 && this.sectionData) {
var that = this; var that = this;
that.classify.forEach((ele, index) => { that.classify.forEach((ele, index) => {
@ -741,13 +744,13 @@ export default {
if (itemTypeChartRef2.echartArr.includes('表格')) { if (itemTypeChartRef2.echartArr.includes('表格')) {
that.$refs.typeChartRef2[i].getDataArr(that.$refs.typeChartRef2[i].dataArr); that.$refs.typeChartRef2[i].getDataArr(that.$refs.typeChartRef2[i].dataArr);
} }
// console.log(item,'组件数据'); // //console.log(item,'组件数据');
if ( if (
itemTypeChartRef2.echartArr.includes('直方图') && itemTypeChartRef2.echartArr.includes('直方图') &&
itemTypeChartRef2.$refs.barChartRef.drawBar itemTypeChartRef2.$refs.barChartRef.drawBar
) { ) {
// 数据改变重新渲染柱状图 // 数据改变重新渲染柱状图
// console.log(item, '组件'); // //console.log(item, '组件');
itemTypeChartRef2.$refs.barChartRef.drawBar(itemTypeChartRef2.dataArr[0]); itemTypeChartRef2.$refs.barChartRef.drawBar(itemTypeChartRef2.dataArr[0]);
} }
if ( if (
@ -786,7 +789,7 @@ export default {
// if (_that.$refs.typeChartRef2 != undefined) { // if (_that.$refs.typeChartRef2 != undefined) {
// for (let i = 0; i < _that.$refs.typeChartRef2.length; i++) { // for (let i = 0; i < _that.$refs.typeChartRef2.length; i++) {
// let itemTypeChartRef2 = _that.$refs.typeChartRef2[i]; // let itemTypeChartRef2 = _that.$refs.typeChartRef2[i];
// // console.log(_this.$refs.typeChartRef[i], '触发接收的表格数据'); // // //console.log(_this.$refs.typeChartRef[i], '触发接收的表格数据');
// if (itemTypeChartRef2.length != 0 && itemTypeChartRef2.dataArr != undefined && itemTypeChartRef2.dataArr.length != 0) { // if (itemTypeChartRef2.length != 0 && itemTypeChartRef2.dataArr != undefined && itemTypeChartRef2.dataArr.length != 0) {
// // this.$refs.typeChartRef2[i].$refs.lineChartRef.drawLine(this.$refs.typeChartRef2[i].dataArr, _this.$refs.typeChartRe2f[i].componentName.split('_')[0]) // // this.$refs.typeChartRef2[i].$refs.lineChartRef.drawLine(this.$refs.typeChartRef2[i].dataArr, _this.$refs.typeChartRe2f[i].componentName.split('_')[0])
// if (itemTypeChartRef2.echartArr.includes('时间曲线图')) { // if (itemTypeChartRef2.echartArr.includes('时间曲线图')) {
@ -795,10 +798,10 @@ export default {
// if (itemTypeChartRef2.echartArr.includes('数值')) { // if (itemTypeChartRef2.echartArr.includes('数值')) {
// _that.$refs.typeChartRef2[i].getDataArr(_that.$refs.typeChartRef2[i].dataArr) // _that.$refs.typeChartRef2[i].getDataArr(_that.$refs.typeChartRef2[i].dataArr)
// } // }
// // console.log(item,'组件数据'); // // //console.log(item,'组件数据');
// if (itemTypeChartRef2.echartArr.includes('直方图') && itemTypeChartRef2.$refs.barChartRef.drawBar) { // if (itemTypeChartRef2.echartArr.includes('直方图') && itemTypeChartRef2.$refs.barChartRef.drawBar) {
// // 数据改变重新渲染柱状图 // // 数据改变重新渲染柱状图
// // console.log(item, '组件'); // // //console.log(item, '组件');
// itemTypeChartRef2.$refs.barChartRef.drawBar(itemTypeChartRef2.dataArr[0]) // itemTypeChartRef2.$refs.barChartRef.drawBar(itemTypeChartRef2.dataArr[0])
// } // }
// if (itemTypeChartRef2.echartArr.includes('饼状图') && itemTypeChartRef2.$refs.pieChartRef.drawPie) { // if (itemTypeChartRef2.echartArr.includes('饼状图') && itemTypeChartRef2.$refs.pieChartRef.drawPie) {
@ -827,7 +830,7 @@ export default {
//周期统计实时累计数据主题 //周期统计实时累计数据主题
cycleAccumulateData: { cycleAccumulateData: {
handler(newVal) { handler(newVal) {
console.log('周期统计实时累计数据主题', newVal); //console.log('周期统计实时累计数据主题', newVal);
if (newVal != undefined && newVal.length != 0 && this.sectionData) { if (newVal != undefined && newVal.length != 0 && this.sectionData) {
var that = this; var that = this;
that.classify.forEach((ele, index) => { that.classify.forEach((ele, index) => {
@ -858,7 +861,7 @@ export default {
itemTypeChartRef2.dataArr != undefined && itemTypeChartRef2.dataArr != undefined &&
itemTypeChartRef2.dataArr.length != 0 itemTypeChartRef2.dataArr.length != 0
) { ) {
console.log('itemTypeChartRef2.echartArr',itemTypeChartRef2.echartArr) //console.log('itemTypeChartRef2.echartArr',itemTypeChartRef2.echartArr)
if (itemTypeChartRef2.echartArr.includes('数值')) { if (itemTypeChartRef2.echartArr.includes('数值')) {
//只需要修改数值组件 //只需要修改数值组件
that.$refs.typeChartRef2[i].getcycleAccumulateDataArr([item]); that.$refs.typeChartRef2[i].getcycleAccumulateDataArr([item]);

191
src/views/index.vue
View File

@ -919,7 +919,7 @@ export default {
//离开当前页面后执行 //离开当前页面后执行
destroyed: function () { destroyed: function () {
//console.log("离开当前页") ////console.log("离开当前页")
// client.publish('msg_stream',JSON.stringify({"msg_flag":-1})) // client.publish('msg_stream',JSON.stringify({"msg_flag":-1}))
//client.end(); //client.end();
}, },
@ -993,7 +993,7 @@ export default {
}, },
//场景选择 //场景选择
sceneChange(val) { sceneChange(val) {
console.log(val, '车道场景选择'); //console.log(val, '车道场景选择');
if (val != 1) { if (val != 1) {
this.perception.place = '0'; this.perception.place = '0';
} }
@ -1092,7 +1092,7 @@ export default {
'TargetAnalysisStatusData', 'TargetAnalysisStatusData',
'TrafficAnalysisStatusData', 'TrafficAnalysisStatusData',
//目标数量 //目标数量
'simulator_target-' + this.$route.query.id // 'simulator_target-' + this.$route.query.id
]; ];
window.PubScribe(this.topicSends, '001', this.realInfo); window.PubScribe(this.topicSends, '001', this.realInfo);
setTimeout(() => { setTimeout(() => {
@ -1120,7 +1120,7 @@ export default {
'img7', 'img7',
'Contorl_server', 'Contorl_server',
//目标数量 //目标数量
'simulator_target-' + this.$route.query.id // 'simulator_target-' + this.$route.query.id
]; ];
window.PubScribe(this.topicSends, this.number, this.realInfo, false, this.$route.query.id); window.PubScribe(this.topicSends, this.number, this.realInfo, false, this.$route.query.id);
} }
@ -1131,7 +1131,7 @@ export default {
//获取视频分析，交通分析状态数据 //获取视频分析，交通分析状态数据
getAnalysisStatus() { getAnalysisStatus() {
getVideoStatus(this.$route.query.id).then((res) => { getVideoStatus(this.$route.query.id).then((res) => {
console.log('res.data', res.data); //console.log('res.data', res.data);
//视频分析状态 //视频分析状态
if (res.data.data.videoAnalysisStatus == '未分析') { if (res.data.data.videoAnalysisStatus == '未分析') {
this.disabledTrafficAnalysis = true; this.disabledTrafficAnalysis = true;
@ -1169,9 +1169,9 @@ export default {
}); });
}, },
getInterface(data1, data2, data3) { getInterface(data1, data2, data3) {
console.log('data1', data1); //接口组件id //console.log('data1', data1); //接口组件id
console.log('data2', data2); //组件id //console.log('data2', data2); //组件id
console.log('data3', data2); //类型 //console.log('data3', data2); //类型
this.data1 = data1; this.data1 = data1;
this.data2 = data2; this.data2 = data2;
this.data3 = data3; this.data3 = data3;
@ -1183,14 +1183,14 @@ export default {
getJierfData() getJierfData()
.then((res) => { .then((res) => {
this.interfaceOptions = res.data.data; this.interfaceOptions = res.data.data;
console.log('this.interfaceOptions', this.interfaceOptions); //console.log('this.interfaceOptions', this.interfaceOptions);
}) })
.catch((err) => { .catch((err) => {
_this.$message.error(err.msg); _this.$message.error(err.msg);
}); });
}, },
handleInterfaceOptions(val) { handleInterfaceOptions(val) {
console.log('val', val); //console.log('val', val);
var startSectionIdArr = []; var startSectionIdArr = [];
var startSectionNameArr = []; var startSectionNameArr = [];
val.forEach((item) => { val.forEach((item) => {
@ -1239,8 +1239,8 @@ export default {
window.publish('GetCycleHistory', 'Get-' + this.$route.query.id); window.publish('GetCycleHistory', 'Get-' + this.$route.query.id);
}, },
getZhuanFaMQTT(topic, msg) { getZhuanFaMQTT(topic, msg) {
// console.log("topic",topic) // //console.log("topic",topic)
// console.log("msg",msg) // //console.log("msg",msg)
window.publish(topic, msg); window.publish(topic, msg);
}, },
//分析视频按钮 //分析视频按钮
@ -1271,7 +1271,7 @@ export default {
trafficAnalysisBtn() { trafficAnalysisBtn() {
startTrafficAnalysis(this.$route.query.id).then((res) => { startTrafficAnalysis(this.$route.query.id).then((res) => {
// //
console.log('res.data', res.data.data); //console.log('res.data', res.data.data);
if (res.data.code == 200) { if (res.data.code == 200) {
this.$message({ this.$message({
message: res.data.msg, message: res.data.msg,
@ -1325,15 +1325,15 @@ export default {
analysisData() { analysisData() {
var ip = window.location.host.split(':')[0]; var ip = window.location.host.split(':')[0];
// var ip = '172.16.1.168'; //http://172.16.1.168 // var ip = '172.16.1.168'; //http://172.16.1.168
console.log('ip', ip); //console.log('ip', ip);
getAnalysisData(this.$route.query.id, ip).then((res) => { getAnalysisData(this.$route.query.id, ip).then((res) => {
console.log('res.data.data视频分析结果', res.data.data); //console.log('res.data.data视频分析结果', res.data.data);
// if(res.data.data.TrafficAnalysisStatus=='分析异常'){ // if(res.data.data.TrafficAnalysisStatus=='分析异常'){
// this.videoAnalysisStatus = '分析异常' // this.videoAnalysisStatus = '分析异常'
// }else { // }else {
console.log('this.videoAnalysisStatusNew', res.data.data.trafficAnalysisStatus); //console.log('this.videoAnalysisStatusNew', res.data.data.trafficAnalysisStatus);
this.videoAnalysisStatusNew = res.data.data.trafficAnalysisStatus; this.videoAnalysisStatusNew = res.data.data.trafficAnalysisStatus;
console.log('this.videoAnalysisStatusNew', this.videoAnalysisStatusNew); //console.log('this.videoAnalysisStatusNew', this.videoAnalysisStatusNew);
var numSatusNew = ''; var numSatusNew = '';
this.analysis.videoTotalFrames = Number(res.data.data.videoTotalFrames); this.analysis.videoTotalFrames = Number(res.data.data.videoTotalFrames);
if (res.data.data.trafficFrameNumber == '') { if (res.data.data.trafficFrameNumber == '') {
@ -1358,16 +1358,16 @@ export default {
this.imageUrlToBase64(res.data.data.picPath); this.imageUrlToBase64(res.data.data.picPath);
}); });
// this.OnSceneN() // this.OnSceneN()
console.log(this.analysis, ' this.analysis'); //console.log(this.analysis, ' this.analysis');
}, },
//分析结束传参 //分析结束传参
postTraffic() { postTraffic() {
var ip = window.location.host.split(':')[0]; var ip = window.location.host.split(':')[0];
// var ip = '172.16.1.168'; //http://172.16.1.168:5000 // var ip = '172.16.1.168'; //http://172.16.1.168:5000
console.log('ip', ip); //console.log('ip', ip);
getAnalysisData(this.$route.query.id, ip).then((res) => { getAnalysisData(this.$route.query.id, ip).then((res) => {
console.log('res.data.data', res.data.data); //console.log('res.data.data', res.data.data);
this.analysis.trafficAnalysisPath1 = res.data.data.trafficAnalysisPath1; this.analysis.trafficAnalysisPath1 = res.data.data.trafficAnalysisPath1;
this.analysis.trafficAnalysisPath2 = res.data.data.trafficAnalysisPath2; this.analysis.trafficAnalysisPath2 = res.data.data.trafficAnalysisPath2;
document document
@ -1393,7 +1393,7 @@ export default {
const u8arr = new Uint8Array(message); const u8arr = new Uint8Array(message);
const temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串 const temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串
const msg = JSON.parse(temp); //这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据 const msg = JSON.parse(temp); //这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据
// console.log(msg, 'msg接受一张高频图片'); // //console.log(msg, 'msg接受一张高频图片');
// document.getElementById('mapModule').contentWindow.getDestination(JSON.stringify(msg)); // document.getElementById('mapModule').contentWindow.getDestination(JSON.stringify(msg));
if (msg.rate == 'high') { if (msg.rate == 'high') {
document.getElementById('mapModule').contentWindow.getDestination(JSON.stringify(msg)); document.getElementById('mapModule').contentWindow.getDestination(JSON.stringify(msg));
@ -1456,12 +1456,13 @@ export default {
const temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串 const temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串
var detId = []; var detId = [];
const msgN = JSON.parse(temp); const msgN = JSON.parse(temp);
// console.log("msgN",msgN) // //console.log("msgN",msgN)
this.triggerData = msgN; this.triggerData = msgN;
if (temp.length != 0) { if (temp.length != 0) {
for (let i = 0; i < msgN.length; i++) { for (let i = 0; i < msgN.length; i++) {
if (msgN[i].event != 'empty') { if (msgN[i].event != 'empty') {
detId.push(msgN[i].det_id); // detId.push(msgN[i].det_id);
detId.push(msgN[i]);
} }
} }
document.getElementById('mapModule').contentWindow.getChuFa(JSON.stringify(detId)); document.getElementById('mapModule').contentWindow.getChuFa(JSON.stringify(detId));
@ -1470,67 +1471,66 @@ export default {
break; break;
case 'trigger-' + this.$route.query.id: case 'trigger-' + this.$route.query.id:
try { try {
// console.log("trigger_msgN",message) // //console.log("trigger_msgN",message)
const utf8decoder = new TextDecoder(); const utf8decoder = new TextDecoder();
const u8arr = new Uint8Array(message); const u8arr = new Uint8Array(message);
const temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串 const temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串
var detId = []; var detId = [];
const msgN = JSON.parse(temp); const msgN = JSON.parse(temp);
// console.log("trigger_msgN",msgN) // //console.log("trigger_msgN",msgN)
// msgN.forEach(item => { // msgN.forEach(item => {
// console.log("item.name",item.name) // //console.log("item.name",item.name)
// }) // })
this.triggerListData = msgN; this.triggerListData = msgN;
} catch (error) {} } catch (error) {}
break; break;
case 'cycle_time-' + this.$route.query.id: case 'cycle_time-' + this.$route.query.id:
try { try {
// console.log("trigger_msgN",message) // //console.log("trigger_msgN",message)
const utf8decoder = new TextDecoder(); const utf8decoder = new TextDecoder();
const u8arr = new Uint8Array(message); const u8arr = new Uint8Array(message);
const temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串 const temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串
var detId = []; var detId = [];
const msgN = JSON.parse(temp); const msgN = JSON.parse(temp);
console.log('固定时刻', msgN); //console.log('固定时刻', msgN);
this.cycleTimeData = msgN; this.cycleTimeData = msgN;
} catch (error) {} } catch (error) {}
break; break;
case 'cycle_history-' + this.$route.query.id: case 'cycle_history-' + this.$route.query.id:
try { try {
// console.log("trigger_msgN",message) // //console.log("trigger_msgN",message)
const utf8decoder = new TextDecoder(); const utf8decoder = new TextDecoder();
const u8arr = new Uint8Array(message); const u8arr = new Uint8Array(message);
const temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串 const temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串
var detId = []; var detId = [];
const msgN = JSON.parse(temp); const msgN = JSON.parse(temp);
console.log('历史数据', msgN); //console.log('历史数据', msgN);
this.cycleHistoryData = msgN; this.cycleHistoryData = msgN;
} catch (error) {} } catch (error) {}
break; break;
case 'cycle_statistics-' + this.$route.query.id: case 'cycle_statistics-' + this.$route.query.id:
try { try {
// console.log("trigger_msgN",message) // //console.log("trigger_msgN",message)
const utf8decoder = new TextDecoder(); const utf8decoder = new TextDecoder();
const u8arr = new Uint8Array(message); const u8arr = new Uint8Array(message);
const temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串 const temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串
var detId = []; var detId = [];
const msgN = JSON.parse(temp); const msgN = JSON.parse(temp);
// console.log("固定间隔",msgN) //console.log("cycle_statistics-固定间隔1",temp)
// //console.log("cycle_statistics-固定间隔2",msgN)
this.cycleStatisticsData = msgN; this.cycleStatisticsData = msgN;
// this.cycleStatisticsData = msgN;
} catch (error) {} } catch (error) {}
break; break;
case 'cycle_accumulate-' + this.$route.query.id: case 'cycle_accumulate-' + this.$route.query.id:
try { try {
//周期统计实时累计数据主题 //周期统计实时累计数据主题
// console.log("trigger_msgN",message) // //console.log("trigger_msgN",message)
const utf8decoder = new TextDecoder(); const utf8decoder = new TextDecoder();
const u8arr = new Uint8Array(message); const u8arr = new Uint8Array(message);
const temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串 const temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串
var detId = []; var detId = [];
const msgN = JSON.parse(temp); const msgN = JSON.parse(temp);
console.log('周期统计实时累计数据主题', msgN); //console.log('cycle_accumulate-周期统计实时累计数据主题', msgN);
this.cycleAccumulateData = msgN; this.cycleAccumulateData = msgN;
} catch (error) {} } catch (error) {}
break; break;
@ -1540,7 +1540,7 @@ export default {
const u8arr = new Uint8Array(message); const u8arr = new Uint8Array(message);
const temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串 const temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串
const msg = JSON.parse(temp); //这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据 const msg = JSON.parse(temp); //这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据
// console.log("VideoStatusData", msg) //msg为转换后的JSON数据 // //console.log("VideoStatusData", msg) //msg为转换后的JSON数据
this.changeStatus(msg); this.changeStatus(msg);
} catch (error) {} } catch (error) {}
break; break;
@ -1550,7 +1550,7 @@ export default {
const u8arr = new Uint8Array(message); const u8arr = new Uint8Array(message);
const temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串 const temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串
const msg = JSON.parse(temp); //这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据 const msg = JSON.parse(temp); //这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据
console.log(msg, '目标监测'); //console.log(msg, '目标监测');
this.targetAnalysisStatusData = msg; this.targetAnalysisStatusData = msg;
} catch (error) {} } catch (error) {}
break; break;
@ -1560,7 +1560,7 @@ export default {
const u8arr = new Uint8Array(message); const u8arr = new Uint8Array(message);
const temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串 const temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串
const msg = JSON.parse(temp); //这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据 const msg = JSON.parse(temp); //这一步报错则返回的是二进制流图片，不报错则返回的是JSON的错误提示数据
console.log(msg, '交通分析'); //console.log(msg, '交通分析');
this.trafficAnalysisStatusData = msg; this.trafficAnalysisStatusData = msg;
} catch (error) {} } catch (error) {}
break; break;
@ -1570,6 +1570,7 @@ export default {
const u8arr = new Uint8Array(message); const u8arr = new Uint8Array(message);
const temp = utf8decoder1.decode(u8arr); // 将二进制数据转为字符串 const temp = utf8decoder1.decode(u8arr); // 将二进制数据转为字符串
const msg = JSON.parse(temp); const msg = JSON.parse(temp);
//console.log('simulator_target-目标数量', msg);
document.getElementById('mapModule').contentWindow.getTargetNumber(JSON.stringify(msg)); document.getElementById('mapModule').contentWindow.getTargetNumber(JSON.stringify(msg));
} catch (error) {} } catch (error) {}
break; break;
@ -1577,10 +1578,10 @@ export default {
this.receiveNews = ''; this.receiveNews = '';
}, },
// handleClick(tab, event) { // handleClick(tab, event) {
// console.log(tab, event); // //console.log(tab, event);
// }, // },
changeCompany(val) { changeCompany(val) {
console.log('val', val); //console.log('val', val);
if (val == '小时') { if (val == '小时') {
this.max = '24'; this.max = '24';
this.componentForm.cycleInterval = 1; this.componentForm.cycleInterval = 1;
@ -1604,11 +1605,11 @@ export default {
this.videoAnalysisStatus = '已分析'; this.videoAnalysisStatus = '已分析';
this.numSatus = 100; this.numSatus = 100;
//已分析 //已分析
console.log('已分析'); //console.log('已分析');
this.postTraffic(); this.postTraffic();
} else if (msg.type == 'traffic_analyse_unusual' && msg.video_id == this.$route.query.id) { } else if (msg.type == 'traffic_analyse_unusual' && msg.video_id == this.$route.query.id) {
//分析异常 //分析异常
console.log('分析异常'); //console.log('分析异常');
this.videoAnalysisStatus = '分析异常'; this.videoAnalysisStatus = '分析异常';
} }
}, },
@ -1641,18 +1642,18 @@ export default {
}, },
// //新增组件根据组件id获取单个组件数据 // //新增组件根据组件id获取单个组件数据
getSingleComponentIdN(id, type, name) { getSingleComponentIdN(id, type, name) {
console.log('id', id); //console.log('id', id);
console.log('type', type); //console.log('type', type);
console.log('name', name); //console.log('name', name);
this.closeEditShow = false; this.closeEditShow = false;
this.closeComponentShow = true; this.closeComponentShow = true;
this.componentId = id; this.componentId = id;
this.componentForm.componentType = type; this.componentForm.componentType = type;
this.componentTitle = type; this.componentTitle = type;
getComponentData({ AnalogAreaComponentId: id }).then((res) => { getComponentData({ AnalogAreaComponentId: id }).then((res) => {
console.log('res', res); //console.log('res', res);
if (res.data.code == 200) { if (res.data.code == 200) {
console.log('res', res.data.data); //console.log('res', res.data.data);
this.component = true; this.component = true;
if (res.data.data.company != '') { if (res.data.data.company != '') {
this.componentForm.company = res.data.data.company; this.componentForm.company = res.data.data.company;
@ -1662,10 +1663,10 @@ export default {
if (res.data.data.timeMode != '') { if (res.data.data.timeMode != '') {
this.componentForm.timeMode = res.data.data.timeMode; this.componentForm.timeMode = res.data.data.timeMode;
} else { } else {
console.log('this.componentForm.timeMode', this.componentForm.timeMode); //console.log('this.componentForm.timeMode', this.componentForm.timeMode);
console.log('this.componentForm.componentType', this.componentForm.componentType); //console.log('this.componentForm.componentType', this.componentForm.componentType);
if (this.componentForm.componentType == '延误' || this.componentForm.componentType == '拥堵') { if (this.componentForm.componentType == '延误' || this.componentForm.componentType == '拥堵') {
console.log('this.componentForm.timeMode', this.componentForm.timeMode); //console.log('this.componentForm.timeMode', this.componentForm.timeMode);
this.componentForm.timeMode = '固定间隔'; this.componentForm.timeMode = '固定间隔';
} else { } else {
this.componentForm.timeMode = '实时触发'; this.componentForm.timeMode = '实时触发';
@ -1696,12 +1697,12 @@ export default {
// this.componentForm.typeFiltering = res.data.data.typeFiltering // this.componentForm.typeFiltering = res.data.data.typeFiltering
// this.componentForm.type = res.data.data.type // this.componentForm.type = res.data.data.type
if (res.data.data.startSectionIds != '') { if (res.data.data.startSectionIds != '') {
console.log('startSectionIds', res.data.data.startSectionIds); //console.log('startSectionIds', res.data.data.startSectionIds);
var startSectionIdArr = []; var startSectionIdArr = [];
var startSectionArr = []; var startSectionArr = [];
startSectionIdArr = res.data.data.startSectionIds.split(','); startSectionIdArr = res.data.data.startSectionIds.split(',');
console.log('this.sectionals', this.sectionals); //console.log('this.sectionals', this.sectionals);
console.log('startSectionIdArr', startSectionIdArr); //console.log('startSectionIdArr', startSectionIdArr);
startSectionIdArr.forEach((item) => { startSectionIdArr.forEach((item) => {
this.sectionals.forEach((items) => { this.sectionals.forEach((items) => {
if (item == items.graphicId) { if (item == items.graphicId) {
@ -1718,12 +1719,12 @@ export default {
this.componentForm.startSection = startSectionArr; this.componentForm.startSection = startSectionArr;
} }
if (res.data.data.endSectionIds != '') { if (res.data.data.endSectionIds != '') {
console.log('endSectionIds', res.data.data.endSectionIds); //console.log('endSectionIds', res.data.data.endSectionIds);
var endSectionIdArr = []; var endSectionIdArr = [];
var endSectionArr = []; var endSectionArr = [];
endSectionIdArr = res.data.data.endSectionIds.split(','); endSectionIdArr = res.data.data.endSectionIds.split(',');
console.log('this.sectionals', this.sectionals); //console.log('this.sectionals', this.sectionals);
console.log('endSectionIdArr', endSectionIdArr); //console.log('endSectionIdArr', endSectionIdArr);
endSectionIdArr.forEach((item) => { endSectionIdArr.forEach((item) => {
this.sectionals.forEach((items) => { this.sectionals.forEach((items) => {
if (item == items.graphicId) { if (item == items.graphicId) {
@ -1753,13 +1754,13 @@ export default {
} else { } else {
// this.componentForm.type = ["机动车", "非机动车", "行人"]; // this.componentForm.type = ["机动车", "非机动车", "行人"];
} }
console.log('this.componentForm', this.componentForm); //console.log('this.componentForm', this.componentForm);
} }
}); });
}, },
//修改模拟区组件、图形 //修改模拟区组件、图形
getSimulationAreaEdit(id, type, componentType, name, number) { getSimulationAreaEdit(id, type, componentType, name, number) {
console.log('number', number); //console.log('number', number);
this.numberNew = number; this.numberNew = number;
if (type == '图形') { if (type == '图形') {
this.form.id = id; this.form.id = id;
@ -1800,9 +1801,9 @@ export default {
this.componentForm.componentType = componentType; this.componentForm.componentType = componentType;
this.componentTitle = componentType; this.componentTitle = componentType;
getComponentData({ AnalogAreaComponentId: id }).then((res) => { getComponentData({ AnalogAreaComponentId: id }).then((res) => {
console.log('res', res); //console.log('res', res);
if (res.data.code == 200) { if (res.data.code == 200) {
console.log('res', res.data.data); //console.log('res', res.data.data);
this.component = true; this.component = true;
if (res.data.data.company != '') { if (res.data.data.company != '') {
this.componentForm.company = res.data.data.company; this.componentForm.company = res.data.data.company;
@ -1839,12 +1840,12 @@ export default {
this.componentForm.presentationForm = res.data.data.presentationForm; this.componentForm.presentationForm = res.data.data.presentationForm;
// this.componentForm.type = res.data.data.type // this.componentForm.type = res.data.data.type
if (res.data.data.startSectionIds != '') { if (res.data.data.startSectionIds != '') {
console.log('startSectionIds', res.data.data.startSectionIds); //console.log('startSectionIds', res.data.data.startSectionIds);
var startSectionIdArr = []; var startSectionIdArr = [];
var startSectionArr = []; var startSectionArr = [];
startSectionIdArr = res.data.data.startSectionIds.split(','); startSectionIdArr = res.data.data.startSectionIds.split(',');
console.log('this.sectionals', this.sectionals); //console.log('this.sectionals', this.sectionals);
console.log('startSectionIdArr', startSectionIdArr); //console.log('startSectionIdArr', startSectionIdArr);
startSectionIdArr.forEach((item) => { startSectionIdArr.forEach((item) => {
this.sectionals.forEach((items) => { this.sectionals.forEach((items) => {
if (item == items.graphicId) { if (item == items.graphicId) {
@ -1855,12 +1856,12 @@ export default {
}); });
} }
if (res.data.data.endSectionIds != '') { if (res.data.data.endSectionIds != '') {
console.log('endSectionIds', res.data.data.endSectionIds); //console.log('endSectionIds', res.data.data.endSectionIds);
var endSectionIdArr = []; var endSectionIdArr = [];
var endSectionArr = []; var endSectionArr = [];
endSectionIdArr = res.data.data.endSectionIds.split(','); endSectionIdArr = res.data.data.endSectionIds.split(',');
console.log('this.sectionals', this.sectionals); //console.log('this.sectionals', this.sectionals);
console.log('endSectionIdArr', endSectionIdArr); //console.log('endSectionIdArr', endSectionIdArr);
endSectionIdArr.forEach((item) => { endSectionIdArr.forEach((item) => {
this.sectionals.forEach((items) => { this.sectionals.forEach((items) => {
if (item == items.graphicId) { if (item == items.graphicId) {
@ -1891,7 +1892,7 @@ export default {
//获取所有断面数据 //获取所有断面数据
getAllSectionalData(VideoId) { getAllSectionalData(VideoId) {
getSectionalData({ VideoId: VideoId }).then((res) => { getSectionalData({ VideoId: VideoId }).then((res) => {
console.log('res', res); //console.log('res', res);
if (res.data.code == 200) { if (res.data.code == 200) {
this.sectionals = res.data.data; this.sectionals = res.data.data;
} }
@ -1908,10 +1909,10 @@ export default {
return type; return type;
}, },
getFigureD(item, index, indexNew) { getFigureD(item, index, indexNew) {
console.log('图形类型', item); //console.log('图形类型', item);
console.log('初始图形名称', index); //console.log('初始图形名称', index);
this.startFigureName = index; this.startFigureName = index;
console.log('图形位置', indexNew); //console.log('图形位置', indexNew);
this.dialogFormVisible = true; this.dialogFormVisible = true;
this.switchValue = 0; this.switchValue = 0;
this.typeCheckList = [ this.typeCheckList = [
@ -1940,12 +1941,12 @@ export default {
//双击图形修改图形名称弹框 //双击图形修改图形名称弹框
getModifyTheNameN(data, number) { getModifyTheNameN(data, number) {
this.orderShow = true; this.orderShow = true;
console.log('data', data); //console.log('data', data);
console.log('number', number); //console.log('number', number);
this.numberNew = number; this.numberNew = number;
var arr = []; var arr = [];
arr = data.split(','); arr = data.split(',');
console.log('arr', arr); //console.log('arr', arr);
this.form.id = arr[0]; this.form.id = arr[0];
// this.form.name = arr[1]; // this.form.name = arr[1];
// this.form.type = arr[2]; // this.form.type = arr[2];
@ -1982,7 +1983,7 @@ export default {
}, },
//新增、编辑图形确认按钮 //新增、编辑图形确认按钮
onSubmit(form) { onSubmit(form) {
console.log('form', form); //console.log('form', form);
//新增 //新增
if ( if (
this.switchValue == 1 && this.switchValue == 1 &&
@ -2062,7 +2063,7 @@ export default {
url: serverUrl.addFigure, url: serverUrl.addFigure,
data: formData data: formData
}).then((res) => { }).then((res) => {
console.log('res', res); //console.log('res', res);
if (res.data.code == 200) { if (res.data.code == 200) {
this.$message({ this.$message({
@ -2180,7 +2181,7 @@ export default {
url: serverUrl.editFigure, url: serverUrl.editFigure,
data: formData data: formData
}).then((res) => { }).then((res) => {
console.log('res', res); //console.log('res', res);
if (res.data.code == 200) { if (res.data.code == 200) {
this.$message({ this.$message({
message: res.data.msg, message: res.data.msg,
@ -2194,9 +2195,9 @@ export default {
// duration: 0 // duration: 0
// }); // });
// }, 5000); // }, 5000);
console.log('startFigureName', this.startFigureName); //console.log('startFigureName', this.startFigureName);
document.getElementById('mapModule').contentWindow.postFigureId(JSON.stringify(res.data.data)); document.getElementById('mapModule').contentWindow.postFigureId(JSON.stringify(res.data.data));
console.log('this.numberNew', this.numberNew); //console.log('this.numberNew', this.numberNew);
if (form.type == '断面') { if (form.type == '断面') {
document document
.getElementById('mapModule') .getElementById('mapModule')
@ -2225,7 +2226,7 @@ export default {
}, },
//编辑组件 //编辑组件
onSubmitComponent(componentForm) { onSubmitComponent(componentForm) {
console.log(componentForm, 'ffffffffff'); //console.log(componentForm, 'ffffffffff');
if (componentForm.timeMode != '实时触发' && componentForm.company == '') { if (componentForm.timeMode != '实时触发' && componentForm.company == '') {
this.$message.warning('请选择必选项'); this.$message.warning('请选择必选项');
return false; return false;
@ -2277,7 +2278,7 @@ export default {
formData.append('presentationForm', '矩阵图'); formData.append('presentationForm', '矩阵图');
} else if (componentForm.componentType == '类型') { } else if (componentForm.componentType == '类型') {
console.log(componentForm.type, 'componentForm.type'); //console.log(componentForm.type, 'componentForm.type');
//名称 //名称
formData.append('componentName', componentForm.componentName); formData.append('componentName', componentForm.componentName);
//单位 //单位
@ -2309,7 +2310,7 @@ export default {
url: serverUrl.editComponent, url: serverUrl.editComponent,
data: formData data: formData
}).then((res) => { }).then((res) => {
console.log('res', res); //console.log('res', res);
if (res.data.code == 200) { if (res.data.code == 200) {
this.$message({ this.$message({
message: res.data.msg, message: res.data.msg,
@ -2331,7 +2332,7 @@ export default {
}, },
//新增编辑组件取消 //新增编辑组件取消
closeComponent(componentForm) { closeComponent(componentForm) {
console.log('componentForm', componentForm); //console.log('componentForm', componentForm);
this.component = false; this.component = false;
let formData = new FormData(); let formData = new FormData();
@ -2384,7 +2385,7 @@ export default {
url: serverUrl.editComponent, url: serverUrl.editComponent,
data: formData data: formData
}).then((res) => { }).then((res) => {
console.log('res', res); //console.log('res', res);
if (res.data.code == 200) { if (res.data.code == 200) {
this.$message({ this.$message({
@ -2409,7 +2410,7 @@ export default {
}, },
//新增、编辑图形取消按钮 //新增、编辑图形取消按钮
closeFigure(form) { closeFigure(form) {
console.log('form', form); //console.log('form', form);
if (form.id != '') { if (form.id != '') {
this.dialogFormVisible = false; this.dialogFormVisible = false;
document.getElementById('mapModule').contentWindow.closeEdit(JSON.stringify(form.type + ',' + form.id)); document.getElementById('mapModule').contentWindow.closeEdit(JSON.stringify(form.type + ',' + form.id));
@ -2428,7 +2429,7 @@ export default {
} }
}, },
closeComponentForm(componentForm) { closeComponentForm(componentForm) {
console.log('111', componentForm); //console.log('111', componentForm);
if (this.closeComponentShow == false) { if (this.closeComponentShow == false) {
this.component = false; this.component = false;
document.getElementById('mapModule').contentWindow.editComponent(''); document.getElementById('mapModule').contentWindow.editComponent('');
@ -2447,7 +2448,7 @@ export default {
}, },
//改变起点 //改变起点
handleCheckedStartSection(value) { handleCheckedStartSection(value) {
console.log('改变起点', value); //console.log('改变起点', value);
var startSectionIdArr = []; var startSectionIdArr = [];
var startSectionNameArr = []; var startSectionNameArr = [];
value.forEach((item) => { value.forEach((item) => {
@ -2465,7 +2466,7 @@ export default {
}, },
//改变终点 //改变终点
handleCheckedendSection(value) { handleCheckedendSection(value) {
console.log('改变终点', value); //console.log('改变终点', value);
var endSectionIdArr = []; var endSectionIdArr = [];
var endSectionNameArr = []; var endSectionNameArr = [];
value.forEach((item) => { value.forEach((item) => {
@ -2475,8 +2476,8 @@ export default {
endSectionNameArr.push(items.graphicName); endSectionNameArr.push(items.graphicName);
let newendSectionId = endSectionIdArr.join(','); let newendSectionId = endSectionIdArr.join(',');
let newEndSectionName = endSectionNameArr.join(','); let newEndSectionName = endSectionNameArr.join(',');
console.log('newendSectionId', newendSectionId); //console.log('newendSectionId', newendSectionId);
console.log('newEndSectionName', newEndSectionName); //console.log('newEndSectionName', newEndSectionName);
this.componentForm.endSectionIds = newendSectionId; this.componentForm.endSectionIds = newendSectionId;
this.componentForm.endSectionNames = newEndSectionName; this.componentForm.endSectionNames = newEndSectionName;
} }
@ -2485,14 +2486,14 @@ export default {
}, },
//修改展现形式 //修改展现形式
handlePresentation(value) { handlePresentation(value) {
console.log('展现形式', value); //console.log('展现形式', value);
let presentation = value.join(','); let presentation = value.join(',');
this.componentForm.presentationForm = presentation; this.componentForm.presentationForm = presentation;
console.log('this.componentForm.presentationForm', this.componentForm.presentationForm); //console.log('this.componentForm.presentationForm', this.componentForm.presentationForm);
}, },
//类型数据 //类型数据
handleTypeData(value) { handleTypeData(value) {
console.log('类型数据', value); //console.log('类型数据', value);
let type = value.join(','); let type = value.join(',');
this.componentForm.typeData = type; this.componentForm.typeData = type;
}, },
@ -2504,7 +2505,7 @@ export default {
handleSearch() { handleSearch() {
this.modelOthers = true; this.modelOthers = true;
this.$refs.htModels.finbBox(this.inputVal); this.$refs.htModels.finbBox(this.inputVal);
console.log(this.$refs.htModels, 'asdasdasd'); //console.log(this.$refs.htModels, 'asdasdasd');
this.inputVal = ''; this.inputVal = '';
}, },
handleRow(val) { handleRow(val) {
@ -2518,7 +2519,7 @@ export default {
methods: '' methods: ''
}).then((res) => { }).then((res) => {
this.weatherItem = res.data.lives[0]; this.weatherItem = res.data.lives[0];
console.log(this.weatherItem, 'asdsads'); //console.log(this.weatherItem, 'asdsads');
}); });
} }
}, },

185
src/views/sensorFusion/index.vue
View File

@ -602,6 +602,7 @@
></el-empty> ></el-empty>
<chartsLine <chartsLine
:echartsRef="'echartsLine' + e.duocgqrhpzId" :echartsRef="'echartsLine' + e.duocgqrhpzId"
:itemData="e"
style="width: 100%; height: 100%" style="width: 100%; height: 100%"
:intersectionName="intersectionName" :intersectionName="intersectionName"
:chatShowType="chatShowType" :chatShowType="chatShowType"
@ -621,6 +622,7 @@
></el-empty> ></el-empty>
<chartsLine <chartsLine
:echartsRef="'echartsLine' + e.duocgqrhpzId" :echartsRef="'echartsLine' + e.duocgqrhpzId"
:itemData="e"
style="width: 100%; height: 100%" style="width: 100%; height: 100%"
:intersectionName="intersectionName" :intersectionName="intersectionName"
:chatShowType="chatShowType" :chatShowType="chatShowType"
@ -640,6 +642,7 @@
<chartsLine <chartsLine
:echartsRef="'echartsLine' + e.duocgqrhpzId" :echartsRef="'echartsLine' + e.duocgqrhpzId"
style="width: 100%; height: 100%" style="width: 100%; height: 100%"
:itemData="e"
:intersectionName="intersectionName" :intersectionName="intersectionName"
:chatShowType="chatShowType" :chatShowType="chatShowType"
:timeMode="'固定间隔'" :timeMode="'固定间隔'"
@ -1256,8 +1259,8 @@
<img src="@/assets/img/AnalysisMain/add.png" style="height: 60%; width: 4%; cursor: pointer" /> <img src="@/assets/img/AnalysisMain/add.png" style="height: 60%; width: 4%; cursor: pointer" />
</div> --> </div> -->
<el-button size="medium" style="width: 100%" type="primary" plain @click="addParentNode" <el-button size="medium" style="width: 100%" type="primary" plain @click="addParentNode"
><i class="el-icon-plus" style="font-size: 18px"></i></el-button ><i class="el-icon-plus" style="font-size: 18px"></i
> ></el-button>
<span slot="footer" class="dialog-footer" style="display: flex; justify-content: center"> <span slot="footer" class="dialog-footer" style="display: flex; justify-content: center">
<!-- <el-button type="primary" @click="centerDialogVisible = false">取消</el-button> --> <!-- <el-button type="primary" @click="centerDialogVisible = false">取消</el-button> -->
<el-button @click="addSuccess" type="primary">关闭</el-button> <el-button @click="addSuccess" type="primary">关闭</el-button>
@ -1774,7 +1777,7 @@ export default {
// this.addTriggerDataField(this.intersectionList); // this.addTriggerDataField(this.intersectionList);
//mqtt订阅 //mqtt订阅
this.getMqtt(); this.getMqtt();
console.log(this.intersectionList, 'this.intersectionList'); //console.log(this.intersectionList, 'this.intersectionList');
//开发路口默认展开第一个 //开发路口默认展开第一个
if (this.intersectionList.length > 0) { if (this.intersectionList.length > 0) {
let children = this.intersectionList[0].children || []; let children = this.intersectionList[0].children || [];
@ -1789,7 +1792,7 @@ export default {
// } // }
// } // }
// } // }
// console.log(this.intersectionName, 'intersectionName'); // //console.log(this.intersectionName, 'intersectionName');
}); });
}, },
//每个都添加option //每个都添加option
@ -1834,7 +1837,7 @@ export default {
for (let i = 0; i < this.threeData.length; i++) { for (let i = 0; i < this.threeData.length; i++) {
this.addParentSort = this.threeData[i].sort; this.addParentSort = this.threeData[i].sort;
} }
console.log(this.threeData, 'this.threeData'); //console.log(this.threeData, 'this.threeData');
} else { } else {
this.$message.warning(res.data.msg); this.$message.warning(res.data.msg);
} }
@ -1907,7 +1910,7 @@ export default {
}, },
//折叠面板点击展开事件 //折叠面板点击展开事件
handleCollapseChange(val) { handleCollapseChange(val) {
console.log(val, '折叠面板展开事件', this.intersectionName); //console.log(val, '折叠面板展开事件', this.intersectionName);
this.intersectionName = val; this.intersectionName = val;
}, },
handleNodeClick(nodeData) {}, handleNodeClick(nodeData) {},
@ -1964,7 +1967,7 @@ export default {
allowDrop(draggingNode, dropNode, type) { allowDrop(draggingNode, dropNode, type) {
//注掉的是同级拖拽 //注掉的是同级拖拽
if (draggingNode.level === dropNode.level) { if (draggingNode.level === dropNode.level) {
console.log('拖拽'); //console.log('拖拽');
return type === 'prev' || type === 'next'; return type === 'prev' || type === 'next';
} else { } else {
// 不同级进行处理 // 不同级进行处理
@ -1998,7 +2001,7 @@ export default {
} }
}) })
.catch((err) => { .catch((err) => {
console.log(err); //console.log(err);
}); });
}, },
//将子组件得名称统一 //将子组件得名称统一
@ -2062,7 +2065,7 @@ export default {
key.data = key.data.filter((d) => d.videoName != '数值'); key.data = key.data.filter((d) => d.videoName != '数值');
}); });
}); });
console.log(this.addChildThreeData, ' this.addChildThreeData'); //console.log(this.addChildThreeData, ' this.addChildThreeData');
}); });
this.addThreeNodeData.data = data; this.addThreeNodeData.data = data;
this.addThreeNodeData.node = node; this.addThreeNodeData.node = node;
@ -2192,14 +2195,14 @@ export default {
//给节点赋值 //给节点赋值
this.addThreeChildData.data = data; this.addThreeChildData.data = data;
this.addThreeChildData.node = node; this.addThreeChildData.node = node;
console.log(this.addThreeChildData.data, 'this.addThreeChildData.node', this.addThreeChildData.node); //console.log(this.addThreeChildData.data, 'this.addThreeChildData.node', this.addThreeChildData.node);
}, },
//最子节点添加 //最子节点添加
addChildNode() { addChildNode() {
this.checkDataList = []; this.checkDataList = [];
//给添加多选的赋值 //给添加多选的赋值
console.log(this.checkDataList, 'this.checkDataList'); //console.log(this.checkDataList, 'this.checkDataList');
let params = { let params = {
ParentId: '', ParentId: '',
Name: '', Name: '',
@ -2270,7 +2273,7 @@ export default {
} }
}) })
.catch((err) => { .catch((err) => {
console.log(err); //console.log(err);
}); });
// } // }
}, },
@ -2299,7 +2302,7 @@ export default {
} }
}) })
.catch((err) => { .catch((err) => {
console.log(err); //console.log(err);
}); });
}) })
.catch(() => { .catch(() => {
@ -2339,7 +2342,7 @@ export default {
}, },
//普通输入框添加节点 //普通输入框添加节点
addThreeNode() { addThreeNode() {
console.log(this.addThreeNodeData.data, 'this.addThreeNodeData.data'); //console.log(this.addThreeNodeData.data, 'this.addThreeNodeData.data');
let params = { let params = {
ParentId: '', ParentId: '',
Name: '', Name: '',
@ -2386,13 +2389,13 @@ export default {
} }
}) })
.catch((err) => { .catch((err) => {
console.log(err); //console.log(err);
}); });
} }
}, },
// //获得焦点 // //获得焦点
focus(event) { focus(event) {
// console.log(event); // //console.log(event);
event.currentTarget.select(); event.currentTarget.select();
}, },
//修改功能 inp //修改功能 inp
@ -2401,7 +2404,7 @@ export default {
}, },
//失去焦点后 //失去焦点后
alters(node, data) { alters(node, data) {
console.log(data.label, '失去焦点'); //console.log(data.label, '失去焦点');
data.showInput = false; data.showInput = false;
const label = document.getElementById(data.duocgqrhpzId); const label = document.getElementById(data.duocgqrhpzId);
const changeinput = document.querySelector('.input' + data.duocgqrhpzId); const changeinput = document.querySelector('.input' + data.duocgqrhpzId);
@ -2424,11 +2427,11 @@ export default {
} }
}) })
.catch((err) => { .catch((err) => {
console.log(err); //console.log(err);
}); });
}, },
alter(node, data) { alter(node, data) {
console.log(data, '编辑', this.threeData); //console.log(data, '编辑', this.threeData);
data.showInput = true; data.showInput = true;
const label = document.getElementById(data.duocgqrhpzId); const label = document.getElementById(data.duocgqrhpzId);
const changeinput = document.querySelector('.input' + data.duocgqrhpzId); const changeinput = document.querySelector('.input' + data.duocgqrhpzId);
@ -2444,42 +2447,53 @@ export default {
//鼠标悬浮 //鼠标悬浮
showTooltip(id) { showTooltip(id) {
// const hover = document.querySelector('.hovered' + id); // const hover = document.querySelector('.hovered' + id);
const title = document.querySelector('.tooltip' + id); if (id) {
this.$nextTick(() => { const title = document.querySelector('.tooltip' + id);
title.style.position = 'absolute';
title.style.display = 'block'; this.$nextTick(() => {
title.style.backgroundColor = '#f7f7f7'; title.style.position = 'absolute';
title.style.border = '1px solid #ccc'; title.style.display = 'block';
}); title.style.backgroundColor = '#f7f7f7';
title.style.border = '1px solid #ccc';
});
}
}, },
//鼠标移出 //鼠标移出
hideTooltip(id) { hideTooltip(id) {
const title = document.querySelector('.tooltip' + id); // const title = document.querySelector('.tooltip' + id);
this.$nextTick(() => { if (id) {
// this.hovered = false; const title = document.querySelector('.tooltip' + id);
title.style.display = 'none';
}); this.$nextTick(() => {
// this.hovered = false;
title.style.display = 'none';
});
}
}, },
//二级鼠标悬浮 //二级鼠标悬浮
showCardtip(id) { showCardtip(id) {
// const hover = document.querySelector('.hovered' + id); // const hover = document.querySelector('.hovered' + id);
const title = document.querySelector('.cardTitle1' + id); if (id) {
this.$nextTick(() => { const title = document.querySelector('.cardTitle1' + id);
title.style.position = 'absolute'; this.$nextTick(() => {
title.style.display = 'block'; title.style.position = 'absolute';
title.style.backgroundColor = '#f7f7f7'; title.style.display = 'block';
title.style.border = '1px solid #ccc'; title.style.backgroundColor = '#f7f7f7';
// title.style.top = '120px'; title.style.border = '1px solid #ccc';
title.style.width = '110px'; // title.style.top = '120px';
}); title.style.width = '110px';
});
}
}, },
//二级鼠标移出 //二级鼠标移出
hideCardtip(id) { hideCardtip(id) {
const title = document.querySelector('.cardTitle1' + id); if (id) {
this.$nextTick(() => { const title = document.querySelector('.cardTitle1' + id);
// this.hovered = false; this.$nextTick(() => {
title.style.display = 'none'; // this.hovered = false;
}); title.style.display = 'none';
});
}
}, },
//单选按钮选择事件 //单选按钮选择事件
@ -2490,7 +2504,7 @@ export default {
// this.chatShowIndex = index; // this.chatShowIndex = index;
let count = index - 1; let count = index - 1;
let elements = document.querySelectorAll('[class^="echarts"]'); let elements = document.querySelectorAll('[class^="echarts"]');
let echarts = document.querySelector('.echarts' + count); // let echarts = document.querySelector('.echarts' + count);
elements.forEach((element) => { elements.forEach((element) => {
this.setZIndex(element, count); this.setZIndex(element, count);
}); });
@ -2514,7 +2528,7 @@ export default {
// this.getSensorFusionData(); // this.getSensorFusionData();
// }) // })
// .catch((err) => { // .catch((err) => {
// console.log(err); // //console.log(err);
// }); // });
}, },
//确认按钮 //确认按钮
@ -2752,19 +2766,19 @@ export default {
//mqtt订阅 //mqtt订阅
realInfo(topic, message, videoId) { realInfo(topic, message, videoId) {
let dataList = this.intersectionList; let dataList = this.intersectionList;
// console.log(topic, message, 'mqtt数据', videoId); // //console.log(topic, message, 'mqtt数据', videoId);
for (let i = 0; i < this.topicVideoIdList.length; i++) { for (let i = 0; i < this.topicVideoIdList.length; i++) {
switch (topic) { switch (topic) {
// 接收托片 // 接收托片
case 'trigger-' + this.topicVideoIdList[i].videoId: case 'trigger-' + this.topicVideoIdList[i].videoId:
try { try {
// console.log("trigger_msgN",message) // //console.log("trigger_msgN",message)
const utf8decoder = new TextDecoder(); const utf8decoder = new TextDecoder();
const u8arr = new Uint8Array(message); const u8arr = new Uint8Array(message);
const temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串 const temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串
var detId = []; var detId = [];
const msgN = JSON.parse(temp); const msgN = JSON.parse(temp);
// console.log(msgN,'msgN'); // //console.log(msgN,'msgN');
for (let j = 0; j < msgN.length; j++) { for (let j = 0; j < msgN.length; j++) {
const locations = this.findLocationById(this.intersectionList, msgN[j].component_id); const locations = this.findLocationById(this.intersectionList, msgN[j].component_id);
//处理speed正负值和-1，卡片区在html上处理了，数据源不做处理 //处理speed正负值和-1，卡片区在html上处理了，数据源不做处理
@ -2803,7 +2817,8 @@ export default {
n_stay: msgN[j].n_stay, n_stay: msgN[j].n_stay,
n_queue: msgN[j].n_queue, n_queue: msgN[j].n_queue,
occ: msgN[j].occ, occ: msgN[j].occ,
speed: newSpeed speed: newSpeed,
originalSpeed: msgN[j].speed
}); });
// } // }
//卡片区 //卡片区
@ -2856,7 +2871,8 @@ export default {
n_stay: msgN[j].n_stay, n_stay: msgN[j].n_stay,
n_queue: msgN[j].n_queue, n_queue: msgN[j].n_queue,
occ: msgN[j].occ, occ: msgN[j].occ,
speed: newSpeed speed: newSpeed,
originalSpeed: msgN[j].speed
}); });
} else if (msgN[j].component_type == '速度') { } else if (msgN[j].component_type == '速度') {
//卡片区 //卡片区
@ -2876,6 +2892,7 @@ export default {
this.addOrUpdateArrayItem(this.triggerSpeedData, { this.addOrUpdateArrayItem(this.triggerSpeedData, {
time: msgN[j].time, time: msgN[j].time,
speed: newSpeed, speed: newSpeed,
originalSpeed: msgN[j].speed,
avg: msgN[j].avg, avg: msgN[j].avg,
max: msgN[j].max, max: msgN[j].max,
med: msgN[j].med, med: msgN[j].med,
@ -2897,7 +2914,8 @@ export default {
n_stay: msgN[j].n_stay, n_stay: msgN[j].n_stay,
n_queue: msgN[j].n_queue, n_queue: msgN[j].n_queue,
occ: msgN[j].occ, occ: msgN[j].occ,
speed: newSpeed speed: newSpeed,
originalSpeed: msgN[j].speed
}); });
} else if (msgN[j].component_type == '类型') { } else if (msgN[j].component_type == '类型') {
let map = { let map = {
@ -2941,7 +2959,8 @@ export default {
n_stay: msgN[j].n_stay, n_stay: msgN[j].n_stay,
n_queue: msgN[j].n_queue, n_queue: msgN[j].n_queue,
occ: msgN[j].occ, occ: msgN[j].occ,
speed: newSpeed speed: newSpeed,
originalSpeed: msgN[j].speed
}); });
} else if (msgN[j].component_type == '检测数') { } else if (msgN[j].component_type == '检测数') {
let map = { let map = {
@ -2982,7 +3001,8 @@ export default {
n_stay: msgN[j].n_stay, n_stay: msgN[j].n_stay,
n_queue: msgN[j].n_queue, n_queue: msgN[j].n_queue,
occ: msgN[j].occ, occ: msgN[j].occ,
speed: newSpeed speed: newSpeed,
originalSpeed: msgN[j].speed
}); });
} else if (msgN[j].component_type == '排队数') { } else if (msgN[j].component_type == '排队数') {
let map = { let map = {
@ -3018,7 +3038,8 @@ export default {
n_stay: msgN[j].n_stay, n_stay: msgN[j].n_stay,
n_queue: msgN[j].n_queue, n_queue: msgN[j].n_queue,
occ: msgN[j].occ, occ: msgN[j].occ,
speed: newSpeed speed: newSpeed,
originalSpeed: msgN[j].speed
}); });
} else if (msgN[j].component_type == 'OD') { } else if (msgN[j].component_type == 'OD') {
//图表区 //图表区
@ -3039,14 +3060,14 @@ export default {
break; break;
case 'cycle_time-' + this.topicVideoIdList[i].videoId: case 'cycle_time-' + this.topicVideoIdList[i].videoId:
try { try {
// console.log("trigger_msgN",message) // //console.log("trigger_msgN",message)
const utf8decoder = new TextDecoder(); const utf8decoder = new TextDecoder();
const u8arr = new Uint8Array(message); const u8arr = new Uint8Array(message);
const temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串 const temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串
const msgN = JSON.parse(temp); const msgN = JSON.parse(temp);
console.log('固定时刻', msgN); //console.log('固定时刻', msgN);
for (let j = 0; j < msgN.length; j++) { for (let j = 0; j < msgN.length; j++) {
const locations = this.findLocationById(this.intersectionList, msgN[j].component_id); const locations = this.findLocationById(this.intersectionList, msgN[j].component_id);
//处理speed正负值和-1，卡片区在html上处理了，数据源不做处理 //处理speed正负值和-1，卡片区在html上处理了，数据源不做处理
let newSpeed = '-'; let newSpeed = '-';
if ((msgN[j].speed && msgN[j].speed != -1) || msgN[j].speed === 0) { if ((msgN[j].speed && msgN[j].speed != -1) || msgN[j].speed === 0) {
@ -3066,7 +3087,8 @@ export default {
n_stay: msgN[j].n_stay, n_stay: msgN[j].n_stay,
n_queue: msgN[j].n_queue, n_queue: msgN[j].n_queue,
occ: msgN[j].occ, occ: msgN[j].occ,
speed: newSpeed speed: newSpeed,
originalSpeed: msgN[j].speed
}; };
this.$nextTick(() => { this.$nextTick(() => {
this.timeDataCharts( this.timeDataCharts(
@ -3088,7 +3110,7 @@ export default {
msgN[j].component_id, msgN[j].component_id,
map map
); );
console.log(this.intersectionList, 'this.intersectionList'); //console.log(this.intersectionList, 'this.intersectionList');
}); });
} else if (msgN[j].component_type == '速度') { } else if (msgN[j].component_type == '速度') {
//卡片区 //卡片区
@ -3117,7 +3139,8 @@ export default {
n_stay: msgN[j].n_stay, n_stay: msgN[j].n_stay,
n_queue: msgN[j].n_queue, n_queue: msgN[j].n_queue,
occ: msgN[j].occ, occ: msgN[j].occ,
speed: newSpeed speed: newSpeed,
originalSpeed: msgN[j].speed
}; };
this.$nextTick(() => { this.$nextTick(() => {
this.timeDataCharts( this.timeDataCharts(
@ -3154,7 +3177,8 @@ export default {
n_stay: msgN[j].n_stay, n_stay: msgN[j].n_stay,
n_queue: msgN[j].n_queue, n_queue: msgN[j].n_queue,
occ: msgN[j].occ, occ: msgN[j].occ,
speed: newSpeed speed: newSpeed,
originalSpeed: msgN[j].speed
}; };
this.$nextTick(() => { this.$nextTick(() => {
this.timeDataCharts( this.timeDataCharts(
@ -3188,16 +3212,16 @@ export default {
break; break;
case 'cycle_statistics-' + this.topicVideoIdList[i].videoId: case 'cycle_statistics-' + this.topicVideoIdList[i].videoId:
try { try {
// console.log("trigger_msgN",message) // //console.log("trigger_msgN",message)
const utf8decoder = new TextDecoder(); const utf8decoder = new TextDecoder();
const u8arr = new Uint8Array(message); const u8arr = new Uint8Array(message);
const temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串 const temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串
var detId = []; var detId = [];
const msgN = JSON.parse(temp); const msgN = JSON.parse(temp);
console.log('固定间隔', msgN, this.topicVideoIdList[i].videoId); //console.log('固定间隔', msgN, this.topicVideoIdList[i].videoId);
// this.cycleStatisticsData = msgN; // this.cycleStatisticsData = msgN;
for (let j = 0; j < msgN.length; j++) { for (let j = 0; j < msgN.length; j++) {
//处理speed正负值和-1，卡片区在html上处理了，数据源不做处理 //处理speed正负值和-1，卡片区在html上处理了，数据源不做处理
let newSpeed = '-'; let newSpeed = '-';
if ((msgN[j].speed && msgN[j].speed != -1) || msgN[j].speed === 0) { if ((msgN[j].speed && msgN[j].speed != -1) || msgN[j].speed === 0) {
newSpeed = Math.abs(msgN[j].speed); newSpeed = Math.abs(msgN[j].speed);
@ -3216,7 +3240,8 @@ export default {
n_stay: msgN[j].ave_stay, n_stay: msgN[j].ave_stay,
n_queue: msgN[j].ave_queue, n_queue: msgN[j].ave_queue,
occ: msgN[j].occ, occ: msgN[j].occ,
speed: newSpeed speed: newSpeed,
originalSpeed: msgN[j].speed
}; };
this.$nextTick(() => { this.$nextTick(() => {
this.cycleStatisticsDataCharts( this.cycleStatisticsDataCharts(
@ -3266,7 +3291,8 @@ export default {
ave_stay: msgN[j].ave_stay, ave_stay: msgN[j].ave_stay,
ave_queue: msgN[j].ave_queue, ave_queue: msgN[j].ave_queue,
occ: msgN[j].occ, occ: msgN[j].occ,
speed: newSpeed speed: newSpeed,
originalSpeed: msgN[j].speed
}; };
this.$nextTick(() => { this.$nextTick(() => {
this.cycleStatisticsDataCharts( this.cycleStatisticsDataCharts(
@ -3303,7 +3329,8 @@ export default {
ave_stay: msgN[j].ave_stay, ave_stay: msgN[j].ave_stay,
ave_queue: msgN[j].ave_queue, ave_queue: msgN[j].ave_queue,
occ: msgN[j].occ, occ: msgN[j].occ,
speed: newSpeed speed: newSpeed,
originalSpeed: msgN[j].speed
}; };
this.$nextTick(() => { this.$nextTick(() => {
this.cycleStatisticsDataCharts( this.cycleStatisticsDataCharts(
@ -3340,7 +3367,8 @@ export default {
ave_stay: msgN[j].ave_stay, ave_stay: msgN[j].ave_stay,
ave_queue: msgN[j].ave_queue, ave_queue: msgN[j].ave_queue,
occ: msgN[j].occ, occ: msgN[j].occ,
speed: newSpeed speed: newSpeed,
originalSpeed: msgN[j].speed
}; };
this.$nextTick(() => { this.$nextTick(() => {
this.cycleStatisticsDataCharts( this.cycleStatisticsDataCharts(
@ -3376,7 +3404,8 @@ export default {
ave_stay: msgN[j].ave_stay, ave_stay: msgN[j].ave_stay,
ave_queue: msgN[j].ave_queue, ave_queue: msgN[j].ave_queue,
occ: msgN[j].occ, occ: msgN[j].occ,
speed: newSpeed speed: newSpeed,
originalSpeed: msgN[j].speed
}; };
this.$nextTick(() => { this.$nextTick(() => {
this.cycleStatisticsDataCharts( this.cycleStatisticsDataCharts(
@ -3408,7 +3437,8 @@ export default {
ave_stay: msgN[j].ave_stay, ave_stay: msgN[j].ave_stay,
ave_queue: msgN[j].ave_queue, ave_queue: msgN[j].ave_queue,
occ: msgN[j].occ, occ: msgN[j].occ,
speed: newSpeed speed: newSpeed,
originalSpeed: msgN[j].speed
}; };
this.$nextTick(() => { this.$nextTick(() => {
this.cycleStatisticsDataCharts( this.cycleStatisticsDataCharts(
@ -3440,7 +3470,8 @@ export default {
ave_stay: msgN[j].ave_stay, ave_stay: msgN[j].ave_stay,
ave_queue: msgN[j].ave_queue, ave_queue: msgN[j].ave_queue,
occ: msgN[j].occ, occ: msgN[j].occ,
speed: newSpeed speed: newSpeed,
originalSpeed: msgN[j].speed
}; };
this.$nextTick(() => { this.$nextTick(() => {
this.cycleStatisticsDataCharts( this.cycleStatisticsDataCharts(
@ -3472,16 +3503,16 @@ export default {
break; break;
case 'cycle_accumulate-' + this.topicVideoIdList[i].videoId: case 'cycle_accumulate-' + this.topicVideoIdList[i].videoId:
try { try {
// console.log("trigger_msgN",message) // //console.log("trigger_msgN",message)
const utf8decoder = new TextDecoder(); const utf8decoder = new TextDecoder();
const u8arr = new Uint8Array(message); const u8arr = new Uint8Array(message);
const temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串 const temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串
var detId = []; var detId = [];
const msgN = JSON.parse(temp); const msgN = JSON.parse(temp);
console.log('固定间隔cycle_accumulate', msgN); // //console.log('固定间隔cycle_accumulate', msgN);
// this.cycleStatisticsData = msgN; // this.cycleStatisticsData = msgN;
for (let j = 0; j < msgN.length; j++) { for (let j = 0; j < msgN.length; j++) {
//处理speed正负值和-1，卡片区在html上处理了，数据源不做处理 //处理speed正负值和-1，卡片区在html上处理了，数据源不做处理
let newSpeed = '-'; let newSpeed = '-';
if ((msgN[j].speed && msgN[j].speed != -1) || msgN[j].speed === 0) { if ((msgN[j].speed && msgN[j].speed != -1) || msgN[j].speed === 0) {
newSpeed = Math.abs(msgN[j].speed); newSpeed = Math.abs(msgN[j].speed);
@ -3601,7 +3632,7 @@ export default {
chartsPie, //饼图 chartsPie, //饼图
chartsBar, //柱状图 chartsBar, //柱状图
MeanValue, //均值图 MeanValue, //均值图
thermalOD, //OD thermalOD //OD
} }
}; };
</script> </script>