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

bug修改

This commit is contained in:
qiudan 2023-11-15 15:06:10 +08:00
parent 426aee89c4
commit 4cdf66ec1c
10 changed files with 565 additions and 274 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -282,23 +282,33 @@ export default {
var lineArr = [];
let seriesArr = this.extractKeyValues(newVal, 'type_data');
if (seriesArr && seriesArr.length > 0) {
for (let i = 0; i < seriesArr[0].length; i++) {
const item = seriesArr[0][i]; //quantity
const valueList = seriesArr.map((arr) => {
let t = arr[i].value;
if (arr[i].quantity || arr[i].quantity === 0) {
t = arr[i].quantity;
const firstLevel = seriesArr.find((i) => i && i.length > 0);
if (firstLevel && firstLevel.length > 0) {
for (let i = 0; i < firstLevel.length; i++) {
const item = firstLevel[i];
if (item) {
const valueList = seriesArr.map((arr) => {
if (arr) {
let t = arr[i] && arr[i].value;
if (arr[i] && (arr[i].quantity || arr[i].quantity === 0)) {
t = arr[i].quantity;
}
return t;
}
return 0;
});
lineArr.push({
name: item.name,
data: valueList,
type: 'line',
smooth: true
});
}
return t;
});
lineArr.push({
name: item.name,
data: valueList,
type: 'line',
smooth: true
});
}
}
}
if (lineArr && lineArr.length > 0) {
for (let j = 0; j < lineArr.length; j++) {
series.push(lineArr[j]);

75
src/components/chart/regionTable.vue
View File

@ -1,5 +1,4 @@
<template>
<!-- 区域的表格 -->
<div class="tableContent">
<div class="down">
@ -11,10 +10,9 @@
</el-dropdown>
</div>
<div v-if="msg" class="regionBox">
<!-- 实时触发 -->
<el-table :data="msg" style="width: 100%" v-if="triggerType == '实时触发' ">
<el-table :data="msg" style="width: 100%" v-if="triggerType == '实时触发'">
<!-- <el-table-column align="center" prop="steam_id" label="视频路"></el-table-column> -->
<!-- <el-table-column align="center" prop="graphical_id" label="区域编号"></el-table-column> -->
<el-table-column align="center" prop="name" label="区域名称"></el-table-column>
@ -45,9 +43,19 @@
<span v-if="scope.row.occ == '1'">占用</span>
</template>
</el-table-column>
<el-table-column align="center" prop="speed" label="空间平均速度"></el-table-column>
<el-table-column align="center" prop="speed" label="空间平均速度">
<template slot-scope="scope">
{{
scope.row.speed && scope.row.speed != '-' && scope.row.speed != '-1'
? Math.abs(scope.row.speed)
: scope.row.speed == '-1'
? '-'
: scope.row.speed
}}
</template>
</el-table-column>
</el-table>
<el-table :data="msg" style="width: 100%" v-if="triggerType == '固定时刻' ">
<el-table :data="msg" style="width: 100%" v-if="triggerType == '固定时刻'">
<!-- <el-table-column align="center" prop="steam_id" label="视频路"></el-table-column> -->
<!-- <el-table-column align="center" prop="graphical_id" label="区域编号"></el-table-column> -->
<el-table-column align="center" prop="name" label="区域名称"></el-table-column>
@ -76,10 +84,19 @@
<el-table-column align="center" prop="occ" label="占用状态">
<template slot-scope="scope">
<span v-if="scope.row.occ == '1'">占用</span>
</template>
</el-table-column>
<el-table-column align="center" prop="speed" label="空间平均速度"></el-table-column>
<el-table-column align="center" prop="speed" label="空间平均速度">
<template slot-scope="scope">
{{
scope.row.speed && scope.row.speed != '-' && scope.row.speed != '-1'
? Math.abs(scope.row.speed)
: scope.row.speed == '-1'
? '-'
: scope.row.speed
}}
</template>
</el-table-column>
</el-table>
<!-- 固定间隔 -->
<el-table :data="msg" style="width: 100%" v-if="triggerType == '固定间隔'">
@ -111,18 +128,34 @@
<el-table-column align="center" prop="ave_queue" label="平均排队数"></el-table-column>
<el-table-column align="center" prop="ave_occ" label="平均占有率"></el-table-column>
<el-table-column align="center" prop="ave_delay" label="平均延误"></el-table-column>
<el-table-column align="center" prop="speed" label="平均速度"></el-table-column>
<el-table-column align="center" prop="speed" label="平均速度">
<template slot-scope="scope">
{{
scope.row.speed && scope.row.speed != '-' && scope.row.speed != '-1'
? Math.abs(scope.row.speed)
: scope.row.speed == '-1'
? '-'
: scope.row.speed
}}
</template>
</el-table-column>
</el-table>
</div>
<el-dialog title="编辑" :visible.sync="dialogVisible" width="40%">
<el-form :model="msg" label-width="80px">
<el-form-item label="val1">
<el-time-select placeholder="起始时间" v-model="startTime"
:picker-options="{ start: '08:30', step: '00:15', end: '18:30' }">
<el-time-select
placeholder="起始时间"
v-model="startTime"
:picker-options="{ start: '08:30', step: '00:15', end: '18:30' }"
>
</el-time-select>
<el-time-select placeholder="结束时间" v-model="endTime"
:picker-options="{ start: '08:30', step: '00:15', end: '18:30', minTime: startTime }">
<el-time-select
placeholder="结束时间"
v-model="endTime"
:picker-options="{ start: '08:30', step: '00:15', end: '18:30', minTime: startTime }"
>
</el-time-select>
</el-form-item>
<el-form-item label="val2">
@ -155,14 +188,14 @@ export default {
name: 'tableShow', //表格组件
props: {
msg: {
type: Array,
type: Array
// default() {
// return [];
// }
},
triggerType: {
type: String
},
}
},
data() {
return {
@ -180,12 +213,12 @@ export default {
}
}
},
mounted() {
mounted() {
// console.log(this.type,'129129');
},
watch:{
msg:{
handler(newVal){
watch: {
msg: {
handler(newVal) {
// console.log(newVal,'流量数据table');
}
}
@ -193,12 +226,14 @@ export default {
};
</script>
<style scoped lang="scss">
/deep/ .el-table{
/deep/ .el-table {
height: 709px !important;
overflow-y: scroll;
z-index: 9999;
}
.el-table::-webkit-scrollbar { width: 0 !important }
.el-table::-webkit-scrollbar {
width: 0 !important;
}
.tableContent {
position: relative;
}

88
src/components/chart/tableShow.vue
View File

@ -41,7 +41,57 @@
<el-table-column align="center" prop="n_stay" label="存车数"></el-table-column>
<el-table-column align="center" prop="n_queue" label="排队数"></el-table-column>
<el-table-column align="center" prop="occ" label="占用状态"></el-table-column>
<el-table-column align="center" prop="speed" label="空间平均速度"></el-table-column>
<el-table-column align="center" prop="speed" label="空间平均速度">
<template slot-scope="scope">
{{
scope.row.speed && scope.row.speed != '-' && scope.row.speed != '-1'
? Math.abs(scope.row.speed)
: scope.row.speed == '-1'
? '-'
: scope.row.speed
}}
</template>
</el-table-column>
</el-table>
<el-table :data="msg" style="width: 100%" v-if="triggerType == '固定时刻'">
<!-- <el-table-column align="center" prop="steam_id" label="视频路"></el-table-column>
<el-table-column align="center" prop="zone_id" label="区域编号"></el-table-column> -->
<el-table-column align="center" prop="name" label="区域名称"></el-table-column>
<el-table-column align="center" prop="time" label="时间戳"></el-table-column>
<!-- <el-table-column align="center" prop="" label="视频帧"></el-table-column> -->
<el-table-column align="center" label="目标类型" prop="type">
<!-- <template slot-scope="scope">
<span v-if="scope.row.type == 'Person'">行人</span>
<span v-if="scope.row.type == 'Motor Vehicle'">机动车</span>
<span v-if="scope.row.type == 'Non_Motor'">非机动车</span>
<span v-if="scope.row.type == 'Motor Vehicle|Non_Motor'">机动车|非机动车</span>
<span v-if="scope.row.type == 'Motor Vehicle|Person'">机动车|行人</span>
<span v-if="scope.row.type == 'Person|Non_Motor'">行人|非机动车</span>
<span v-if="scope.row.type == 'Person|Motor Vehicle'">行人|机动车</span>
<span v-if="scope.row.type == 'Person|Non_Motor|Motor Vehicle'">行人|非机动车|机动车</span>
<span v-if="scope.row.type == 'Person|Motor Vehicle|Non_Motor'">行人|非机动车|机动车</span>
<span v-if="scope.row.type == 'Non_Motor|Person|Motor Vehicle'">行人|非机动车|机动车</span>
<span v-if="scope.row.type == 'Non_Motor|Motor Vehicle|Person'">行人|非机动车|机动车</span>
<span v-if="scope.row.type == 'Motor Vehicle|Non_Motor|Person'">行人|非机动车|机动车</span>
<span v-if="scope.row.type == 'Motor Vehicle|Person|Non_Motor'">行人|非机动车|机动车</span>
<span v-if="scope.row.type == 'Non_Motor|Motor Vehicle'">非机动车|机动车</span>
<span v-if="scope.row.type == 'Non_Motor|Person'">非机动车|行人</span>
</template> -->
</el-table-column>
<el-table-column align="center" prop="n_stay" label="存车数"></el-table-column>
<el-table-column align="center" prop="n_queue" label="排队数"></el-table-column>
<el-table-column align="center" prop="occ" label="占用状态"></el-table-column>
<el-table-column align="center" prop="speed" label="空间平均速度">
<template slot-scope="scope">
{{
scope.row.speed && scope.row.speed != '-' && scope.row.speed != '-1'
? Math.abs(scope.row.speed)
: scope.row.speed == '-1'
? '-'
: scope.row.speed
}}
</template>
</el-table-column>
</el-table>
<!-- 固定间隔 -->
@ -71,9 +121,39 @@
<el-table-column align="center" prop="in_flow" label="入流流量"></el-table-column>
<el-table-column align="center" prop="out_flow" label="出流流量"></el-table-column>
<el-table-column align="center" prop="flow" label="断面流量"></el-table-column>
<el-table-column align="center" prop="in_spd" label="入流平均速度"></el-table-column>
<el-table-column align="center" prop="out_spd" label="出流平均速度"></el-table-column>
<el-table-column align="center" prop="speed" label="断面的平均速度"></el-table-column>
<el-table-column align="center" prop="in_spd" label="入流平均速度">
<template slot-scope="scope">
{{
scope.row.in_spd && scope.row.in_spd != '-' && scope.row.speed != '-1'
? Math.abs(scope.row.in_spd)
: scope.row.in_spd == '-1'
? '-'
: scope.row.in_spd
}}
</template>
</el-table-column>
<el-table-column align="center" prop="out_spd" label="出流平均速度">
<template slot-scope="scope">
{{
scope.row.out_spd && scope.row.out_spd != '-' && scope.row.out_spd != '-1'
? Math.abs(scope.row.out_spd)
: scope.row.out_spd == '-1'
? '-'
: scope.row.out_spd
}}
</template>
</el-table-column>
<el-table-column align="center" prop="speed" label="断面的平均速度">
<template slot-scope="scope">
{{
scope.row.speed && scope.row.speed != '-' && scope.row.speed != '-1'
? Math.abs(scope.row.speed)
: scope.row.speed == '-1'
? '-'
: scope.row.speed
}}
</template>
</el-table-column>
</el-table>
</div>
<div v-else>

44
src/components/chart/thermalChart.vue
View File

@ -38,15 +38,19 @@ export default {
// var odData = this.odData
var chartData = [];
var start = [];
for (let i = 0; i < odData.length; i++) {
let item = odData[i].data;
for (let j = 0; j < item.length; j++) {
start.push(item[j].start);
// 数组去重
if (odData && odData.length > 0) {
for (let i = 0; i < odData.length; i++) {
let item = odData[i].data;
if (item && item.length > 0) {
for (let j = 0; j < item.length; j++) {
start.push(item[j].start);
// 数组去重
// od图的数据
chartData.push([i, j, item[j].quantity]);
// console.log([i,j,item[j].val]);
// od图的数据
chartData.push([i, j, item[j].quantity]);
// console.log([i,j,item[j].val]);
}
}
}
}
// this.thermalChartData = chartData
@ -62,8 +66,21 @@ export default {
});
return newArr;
},
isObject(variable) {
return typeof variable === 'object' && variable !== null && !Array.isArray(variable);
},
// 绘制热力图
drawThermalChart(odData, startEnd) {
let startEndStart = [],
startEndEnd = [];
if (this.isObject(startEnd)) {
if (startEnd.start) {
startEndStart = startEnd.start.split(',');
}
if (startEnd.start) {
startEndEnd = startEnd.end.split(',');
}
}
let myChart = this.$echarts.init(this.$refs.thermalChart);
let option = {
dataZoom: [
@ -93,7 +110,7 @@ export default {
},
xAxis: {
type: 'category',
data: startEnd.start.split(','),
data: startEndStart,
axisLine: {
lineStyle: {
color: '#000'
@ -110,7 +127,7 @@ export default {
},
yAxis: {
type: 'category',
data: startEnd.end.split(','),
data: startEndEnd,
axisLine: {
lineStyle: {
color: '#000'
@ -173,8 +190,13 @@ export default {
// if (this.list) {
// this.drawThermalChart()
// }
this.drawThermalChart()
},
watch: {}
};
</script>
<style scoped></style>
<style scoped>
.a{
color: rgba(120, 0, 0, 0.5);
}
</style>

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

@ -136,19 +136,30 @@ export default {
let seriesArr = this.extractKeyValues(val, 'type_data');
const transformedData = [];
if (seriesArr && seriesArr.length > 0) {
for (let i = 0; i < seriesArr[0].length; i++) {
const item = seriesArr[0][i]; //quantity
const valueList = seriesArr.map((arr) => {
let t = arr[i].value;
if (arr[i].quantity || arr[i].quantity === 0) {
t = arr[i].quantity;
const firstLevel = seriesArr.find((i) => i && i.length > 0);
if (firstLevel && firstLevel.length > 0) {
for (let i = 0; i < firstLevel.length; i++) {
const item = firstLevel[i];
if (item) {
const valueList = seriesArr.map((arr) => {
if (arr) {
let t = arr[i] && arr[i].value;
if (arr[i] && (arr[i].quantity || arr[i].quantity === 0)) {
t = arr[i].quantity;
}
return t;
}
return 0;
});
transformedData.push({
name: item.name,
value: valueList
});
}
return t;
});
transformedData.push({
name: item.name,
value: valueList
});
}
}
}
let totalCountList = 0;
@ -192,21 +203,30 @@ export default {
// console.log('seriesArr-固定时刻', seriesArr);
const transformedData = [];
if (seriesArr && seriesArr.length > 0) {
for (let i = 0; i < seriesArr[0].length; i++) {
const item = seriesArr[0][i];
//固定间隔主题-类型组件type_data取value字段和历史数据接口不一样，历史数据接口取quantity字段
// const valueList = seriesArr.map((arr) => arr[i].quantity);
const valueList = seriesArr.map((arr) => {
let t = arr[i].value;
if (arr[i].quantity || arr[i].quantity === 0) {
t = arr[i].quantity;
const firstLevel = seriesArr.find((i) => i && i.length > 0);
if (firstLevel && firstLevel.length > 0) {
for (let i = 0; i < firstLevel.length; i++) {
const item = firstLevel[i];
if (item) {
const valueList = seriesArr.map((arr) => {
if (arr) {
let t = arr[i] && arr[i].value;
if (arr[i] && (arr[i].quantity || arr[i].quantity === 0)) {
t = arr[i].quantity;
}
return t;
}
return 0;
});
transformedData.push({
name: item.name,
value: valueList
});
}
return t;
});
transformedData.push({
name: item.name,
value: valueList
});
}
}
}
// console.log('transformedData-1',transformedData)
@ -245,26 +265,36 @@ export default {
yData = this.extractKeyValues(val, 'speed');
} else if (this.componentType == '类型') {
xData = this.extractKeyValues(val, 'time');
// console.log('固定间隔-类型-val-', val);
let seriesArr = this.extractKeyValues(val, 'type_data');
// console.log('固定间隔-类型-seriesArr-', seriesArr);
// console.log('固定间隔-类型-xData-', this.chartData.xData);
const transformedData = [];
if (seriesArr && seriesArr.length > 0) {
for (let i = 0; i < seriesArr[0].length; i++) {
const item = seriesArr[0][i];
//固定间隔主题-类型组件type_data取value字段和历史数据接口不一样，历史数据接口取quantity字段
// const valueList = seriesArr.map((arr) => arr[i].value);
const valueList = seriesArr.map((arr) => {
let t = arr[i].value;
if (arr[i].quantity || arr[i].quantity === 0) {
t = arr[i].quantity;
const firstLevel = seriesArr.find((i) => i && i.length > 0);
if (firstLevel && firstLevel.length > 0) {
for (let i = 0; i < firstLevel.length; i++) {
const item = firstLevel[i];
if (item) {
const valueList = seriesArr.map((arr) => {
if (arr) {
let t = arr[i] && arr[i].value;
if (arr[i] && (arr[i].quantity || arr[i].quantity === 0)) {
t = arr[i].quantity;
}
return t;
}
return 0;
});
transformedData.push({
name: item.name,
value: valueList
});
}
return t;
});
transformedData.push({
name: item.name,
value: valueList
});
}
}
}

74
src/components/sensorFusion/regionTable.vue
View File

@ -119,7 +119,17 @@
<el-table-column align="center" prop="ave_queue" label="平均排队数"></el-table-column>
<el-table-column align="center" prop="ave_occ" label="平均占有率"></el-table-column>
<el-table-column align="center" prop="ave_delay" label="平均延误"></el-table-column>
<el-table-column align="center" prop="speed" label="平均速度"></el-table-column>
<el-table-column align="center" prop="speed" label="平均速度">
<template slot-scope="scope">
{{
scope.row.speed && scope.row.speed != '-' && scope.row.speed != '-1'
? Math.abs(scope.row.speed)
: scope.row.speed == '-1'
? '-'
: scope.row.speed
}}
</template>
</el-table-column>
</el-table>
</div>
<div v-else>
@ -145,44 +155,44 @@ export default {
data() {
return {
//表格字段备注
tableOptions:[
tableOptions: [
{
type:'实时触发',
column:[
{prop:'name',label:'区域名称'},
{prop:'time',label:'时间戳'},
{prop:'type',label:'目标类型'},
{prop:'n_stay',label:'存车数'},
{prop:'n_queue',label:'排队数'},
{prop:'occ',label:'占用状态'},
{prop:'speed',label:'空间平均速度'},
type: '实时触发',
column: [
{ prop: 'name', label: '区域名称' },
{ prop: 'time', label: '时间戳' },
{ prop: 'type', label: '目标类型' },
{ prop: 'n_stay', label: '存车数' },
{ prop: 'n_queue', label: '排队数' },
{ prop: 'occ', label: '占用状态' },
{ prop: 'speed', label: '空间平均速度' }
]
},
{
type:'固定时刻',
column:[
{prop:'name',label:'区域名称'},
{prop:'time',label:'时间戳'},
{prop:'type',label:'目标类型'},
{prop:'n_stay',label:'存车数'},
{prop:'n_queue',label:'排队数'},
{prop:'occ',label:'占用状态'},
{prop:'speed',label:'空间平均速度'},
type: '固定时刻',
column: [
{ prop: 'name', label: '区域名称' },
{ prop: 'time', label: '时间戳' },
{ prop: 'type', label: '目标类型' },
{ prop: 'n_stay', label: '存车数' },
{ prop: 'n_queue', label: '排队数' },
{ prop: 'occ', label: '占用状态' },
{ prop: 'speed', label: '空间平均速度' }
]
},
{
type:'固定间隔',
column:[
{prop:'name',label:'区域名称'},
{prop:'time',label:'时间戳'},
{prop:'type',label:'目标类型'},
{prop:'in_flow',label:'驶入流量'},
{prop:'out_flow',label:'驶离流量'},
{prop:'ave_stay',label:'平均存车数'},
{prop:'ave_queue',label:'平均排队数'},
{prop:'ave_occ',label:'平均占有率'},
{prop:'ave_delay',label:'平均延误'},
{prop:'speed',label:'平均速度'},
type: '固定间隔',
column: [
{ prop: 'name', label: '区域名称' },
{ prop: 'time', label: '时间戳' },
{ prop: 'type', label: '目标类型' },
{ prop: 'in_flow', label: '驶入流量' },
{ prop: 'out_flow', label: '驶离流量' },
{ prop: 'ave_stay', label: '平均存车数' },
{ prop: 'ave_queue', label: '平均排队数' },
{ prop: 'ave_occ', label: '平均占有率' },
{ prop: 'ave_delay', label: '平均延误' },
{ prop: 'speed', label: '平均速度' }
]
}
]

153
src/components/sensorFusion/tableShow.vue
View File

@ -42,7 +42,46 @@
</template>
</el-table-column>
</el-table>
<el-table :data="msg" style="width: 100%" v-if="triggerType == '固定时刻'">
<!-- <el-table-column align="center" prop="steam_id" label="视频路"></el-table-column>
<el-table-column align="center" prop="zone_id" label="区域编号"></el-table-column> -->
<el-table-column align="center" prop="name" label="区域名称"></el-table-column>
<el-table-column align="center" prop="time" label="时间戳"></el-table-column>
<!-- <el-table-column align="center" prop="" label="视频帧"></el-table-column> -->
<el-table-column align="center" label="目标类型" prop="type">
<!-- <template slot-scope="scope">
<span v-if="scope.row.type == 'Person'">行人</span>
<span v-if="scope.row.type == 'Motor Vehicle'">机动车</span>
<span v-if="scope.row.type == 'Non_Motor'">非机动车</span>
<span v-if="scope.row.type == 'Motor Vehicle|Non_Motor'">机动车|非机动车</span>
<span v-if="scope.row.type == 'Motor Vehicle|Person'">机动车|行人</span>
<span v-if="scope.row.type == 'Person|Non_Motor'">行人|非机动车</span>
<span v-if="scope.row.type == 'Person|Motor Vehicle'">行人|机动车</span>
<span v-if="scope.row.type == 'Person|Non_Motor|Motor Vehicle'">行人|非机动车|机动车</span>
<span v-if="scope.row.type == 'Person|Motor Vehicle|Non_Motor'">行人|非机动车|机动车</span>
<span v-if="scope.row.type == 'Non_Motor|Person|Motor Vehicle'">行人|非机动车|机动车</span>
<span v-if="scope.row.type == 'Non_Motor|Motor Vehicle|Person'">行人|非机动车|机动车</span>
<span v-if="scope.row.type == 'Motor Vehicle|Non_Motor|Person'">行人|非机动车|机动车</span>
<span v-if="scope.row.type == 'Motor Vehicle|Person|Non_Motor'">行人|非机动车|机动车</span>
<span v-if="scope.row.type == 'Non_Motor|Motor Vehicle'">非机动车|机动车</span>
<span v-if="scope.row.type == 'Non_Motor|Person'">非机动车|行人</span>
</template> -->
</el-table-column>
<el-table-column align="center" prop="n_stay" label="存车数"></el-table-column>
<el-table-column align="center" prop="n_queue" label="排队数"></el-table-column>
<el-table-column align="center" prop="occ" label="占用状态"></el-table-column>
<el-table-column align="center" prop="speed" label="空间平均速度">
<template slot-scope="scope">
{{
scope.row.speed && scope.row.speed != '-' && scope.row.speed != '-1'
? Math.abs(scope.row.speed)
: scope.row.speed == '-1'
? '-'
: scope.row.speed
}}
</template>
</el-table-column>
</el-table>
<!-- 固定间隔 -->
<el-table :data="tableData" style="width: 100%" height="250" v-if="triggerType == '固定间隔'">
<el-table-column align="center" prop="gate_id" label="断面编号"></el-table-column>
@ -70,9 +109,39 @@
<el-table-column align="center" prop="in_flow" label="入流流量"></el-table-column>
<el-table-column align="center" prop="out_flow" label="出流流量"></el-table-column>
<el-table-column align="center" prop="flow" label="断面流量"></el-table-column>
<el-table-column align="center" prop="in_spd" label="入流平均速度"></el-table-column>
<el-table-column align="center" prop="out_spd" label="出流平均速度"></el-table-column>
<el-table-column align="center" prop="speed" label="断面的平均速度"></el-table-column>
<el-table-column align="center" prop="in_spd" label="入流平均速度">
<template slot-scope="scope">
{{
scope.row.in_spd && scope.row.in_spd != '-' && scope.row.in_spd != '-1'
? Math.abs(scope.row.speed)
: scope.row.in_spd == '-1'
? '-'
: scope.row.in_spd
}}
</template>
</el-table-column>
<el-table-column align="center" prop="out_spd" label="出流平均速度">
<template slot-scope="scope">
{{
scope.row.out_spd && scope.row.out_spd != '-' && scope.row.out_spd != '-1'
? Math.abs(scope.row.out_spd)
: scope.row.out_spd == '-1'
? '-'
: scope.row.out_spd
}}
</template>
</el-table-column>
<el-table-column align="center" prop="speed" label="断面的平均速度">
<template slot-scope="scope">
{{
scope.row.speed && scope.row.speed != '-' && scope.row.speed != '-1'
? Math.abs(scope.row.speed)
: scope.row.speed == '-1'
? '-'
: scope.row.speed
}}
</template>
</el-table-column>
</el-table>
</div>
<div v-else>
@ -97,57 +166,57 @@ export default {
},
data() {
return {
//表格字段备注
tableOptions:[
//表格字段备注
tableOptions: [
{
type:'实时触发',
column:[
{prop:'name',label:'区域名称'},
{prop:'time',label:'时间戳'},
{prop:'type',label:'目标类型'},
{prop:'n_stay',label:'存车数'},
{prop:'n_queue',label:'排队数'},
{prop:'occ',label:'占用状态'},
{prop:'speed',label:'空间平均速度'},
type: '实时触发',
column: [
{ prop: 'name', label: '区域名称' },
{ prop: 'time', label: '时间戳' },
{ prop: 'type', label: '目标类型' },
{ prop: 'n_stay', label: '存车数' },
{ prop: 'n_queue', label: '排队数' },
{ prop: 'occ', label: '占用状态' },
{ prop: 'speed', label: '空间平均速度' }
]
},
{
type:'固定时刻', //TODO-目前代码里无此逻辑
column:[
{prop:'name',label:'区域名称'},
{prop:'time',label:'时间戳'},
{prop:'type',label:'目标类型'},
{prop:'n_stay',label:'存车数'},
{prop:'n_queue',label:'排队数'},
{prop:'occ',label:'占用状态'},
{prop:'speed',label:'空间平均速度'},
type: '固定时刻', //TODO-目前代码里无此逻辑
column: [
{ prop: 'name', label: '区域名称' },
{ prop: 'time', label: '时间戳' },
{ prop: 'type', label: '目标类型' },
{ prop: 'n_stay', label: '存车数' },
{ prop: 'n_queue', label: '排队数' },
{ prop: 'occ', label: '占用状态' },
{ prop: 'speed', label: '空间平均速度' }
]
},
{
type:'固定间隔',
column:[
{prop:'gate_id',label:'断面编号'},
{prop:'name',label:'断面名称'},
{prop:'time',label:'时间戳'},
{prop:'interval',label:'时间序号'},
{prop:'type',label:'目标类型'},
{prop:'in_flow',label:'入流流量'},
{prop:'out_flow',label:'出流流量'},
{prop:'flow',label:'断面流量'},
{prop:'in_spd',label:'入流平均速度'},
{prop:'out_spd',label:'出流平均速度'},
{prop:'speed',label:'断面的平均速度'},
type: '固定间隔',
column: [
{ prop: 'gate_id', label: '断面编号' },
{ prop: 'name', label: '断面名称' },
{ prop: 'time', label: '时间戳' },
{ prop: 'interval', label: '时间序号' },
{ prop: 'type', label: '目标类型' },
{ prop: 'in_flow', label: '入流流量' },
{ prop: 'out_flow', label: '出流流量' },
{ prop: 'flow', label: '断面流量' },
{ prop: 'in_spd', label: '入流平均速度' },
{ prop: 'out_spd', label: '出流平均速度' },
{ prop: 'speed', label: '断面的平均速度' }
]
}
]
};
},
watch: {
tableData: {
handler(newVal) {
console.log(newVal, '断面表格数据');
}
}
// tableData: {
// handler(newVal) {
// console.log(newVal, '断面表格数据');
// }
// }
},
methods: {}
};

177
src/components/sensorFusion/thermalOD.vue
View File

@ -114,97 +114,106 @@ export default {
// }
}
let myChart = this.chart;
let option = {
dataZoom: [
{
id: 'dataZoomY',
type: 'slider',
yAxisIndex: [0],
startValue: 0,
endValue: 10,
filterMode: 'empty'
}
],
tooltip: {
position: 'top'
},
animation: false,
grid: {
left: '3%',
right: '8%',
bottom: '8%',
containLabel: true
},
xAxis: {
type: 'category',
data: this.startName.split(','),
axisLine: {
lineStyle: {
color: '#000'
let startName =[],endName=[]
if(this.startName){
startName = this.startName.split(',')
}
if(this.endName){
endName = this.endName.split(',')
}
if (dataList) {
let option = {
dataZoom: [
{
id: 'dataZoomY',
type: 'slider',
yAxisIndex: [0],
startValue: 0,
endValue: 10,
filterMode: 'empty'
}
],
tooltip: {
position: 'top'
},
axisLabel: {
interval: 0,
rotate: 40
animation: false,
grid: {
left: '3%',
right: '8%',
bottom: '8%',
containLabel: true
},
splitArea: {
show: true
}
// name: "镇街",
},
yAxis: {
type: 'category',
data: this.endName.split(','),
axisLine: {
lineStyle: {
color: '#000'
}
},
axisLabel: {
interval: 0,
rotate: 40
},
splitArea: {
show: true
}
// name: "",
},
visualMap: {
min: 1,
max: 50,
calculable: true,
orient: 'horizontal',
left: 'center',
bottom: '1%',
text: ['50', '1'], // 文本，默认为数值文本
//color:['#20a0ff','#D2EDFF'],
calculable: false,
color: ['#22DDDD', '#fec42c', '#80F1BE']
},
series: [
{
name: 'OD图',
type: 'heatmap',
data: dataList,
label: {
normal: {
show: true
xAxis: {
type: 'category',
data: startName,
axisLine: {
lineStyle: {
color: '#000'
}
},
itemStyle: {
emphasis: {
shadowBlur: 10,
shadowColor: 'rgba(120, 0, 0, 0.5)'
axisLabel: {
interval: 0,
rotate: 40
},
splitArea: {
show: true
}
// name: "镇街",
},
yAxis: {
type: 'category',
data: endName,
axisLine: {
lineStyle: {
color: '#000'
}
},
axisLabel: {
interval: 0,
rotate: 40
},
splitArea: {
show: true
}
// name: "",
},
visualMap: {
min: 1,
max: 50,
calculable: true,
orient: 'horizontal',
left: 'center',
bottom: '1%',
text: ['50', '1'], // 文本，默认为数值文本
//color:['#20a0ff','#D2EDFF'],
calculable: false,
color: ['#22DDDD', '#fec42c', '#80F1BE']
},
series: [
{
name: 'OD图',
type: 'heatmap',
data: dataList,
label: {
normal: {
show: true
}
},
itemStyle: {
emphasis: {
shadowBlur: 10,
shadowColor: 'rgba(120, 0, 0, 0.5)'
}
}
}
}
]
};
if (myChart) {
myChart.setOption(option);
window.addEventListener('resize', () => {
myChart.resize();
});
]
};
if (myChart) {
myChart.setOption(option);
window.addEventListener('resize', () => {
myChart.resize();
});
}
}
}
},

2
src/views/index.vue
View File

@ -1477,7 +1477,7 @@ export default {
const temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串
var detId = [];
const msgN = JSON.parse(temp);
console.log('实时触发trigger-', msgN);
// console.log('实时触发trigger-', msgN);
// //console.log("trigger_msgN",msgN)
// msgN.forEach(item => {
// //console.log("item.name",item.name)

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

@ -679,7 +679,7 @@
>
<div style="width: 100%; height: 10%; padding-left: 4%; box-sizing: border-box">
<span class="titleIcon"></span>
{{ e.name + '-' + e.graphicType }}
{{ e.name }}
</div>
<div style="width: 100%; height: 90%" v-if="e.timeMode == '实时触发'">
<div style="width: 100%; height: 100%" v-if="e.graphicType == '断面'">
@ -2774,15 +2774,14 @@ export default {
) {
if (data[i].children[j].children[n].children[m].componentType == '类型') {
let typeData = {
time: time,
type_data: newValue,
speed: table.speed,
name: table.name,
time: time,
type: table.type,
n_stay: table.n_stay,
n_queue: table.n_queue,
occ: table.occ,
speed: table.speed,
type_data: newValue,
originalSpeed: table.originalSpeed
};
this.addTimeDataCharts(data[i].children[j].children[n].children[m].triggerNewData, typeData);
@ -2813,19 +2812,20 @@ export default {
) {
if (data[i].children[j].children[n].children[m].componentType == '类型') {
let typeData = {
time: time,
type_data: newValue,
speed: table.speed,
avg: table.avg,
max: table.max,
med: table.med,
min: table.min,
name: table.name,
time: time,
type: table.type,
n_stay: table.n_stay,
n_queue: table.n_queue,
occ: table.occ,
speed: table.speed
speed: table.speed,
type_data: newValue,
headway: table.headway,
avg: table.avg,
max: table.max,
med: table.med,
min: table.min,
originalSpeed: table.originalSpeed
};
// if (data[i].children[j].children[n].children[m].cycleTimeData.length > 10) {
// data[i].children[j].children[n].children[m].cycleTimeData =
@ -2858,20 +2858,45 @@ export default {
data[i].children[j].children[n].children[m].analogAreaComponentId == analogAreaComponentId
) {
if (data[i].children[j].children[n].children[m].componentType == '类型') {
// let typeData = {
// time: time,
// type_data: newValue,
// speed: table.speed,
// avg: table.avg,
// max: table.max,
// med: table.med,
// min: table.min,
// name: table.name,
// type: table.type,
// ave_stay: table.ave_stay,
// ave_queue: table.ave_queue,
// occ: table.occ,
// speed: table.speed
// };
let typeData = {
time: time,
type_data: newValue,
speed: table.speed,
time: time,
name: table.name,
type: table.type,
in_flow: table.in_flow,
out_flow: table.out_flow,
ave_stay: table.ave_stay,
ave_queue: table.ave_queue,
ave_occ: table.ave_occ,
ave_delay: table.ave_delay,
type_data: table.type_data,
ave_headway: table.ave_headway,
avg: table.avg,
max: table.max,
med: table.med,
min: table.min,
name: table.name,
type: table.type,
ave_stay: table.ave_stay,
ave_queue: table.ave_queue,
occ: table.occ,
speed: table.speed
originalSpeed: table.speed,
gate_id: table.gate_id,
interval: table.interval,
flow: table.flow,
in_spd: table.in_spd,
out_spd: table.out_spd
};
// if (data[i].children[j].children[n].children[m].cycleStatisticsData.length > 10) {
// data[i].children[j].children[n].children[m].cycleStatisticsData =
@ -3522,7 +3547,7 @@ export default {
interval: msgN[j].interval,
flow: msgN[j].flow,
in_spd: msgN[j].in_spd,
out_spd: msgN[j].out_spd,
out_spd: msgN[j].out_spd
};
this.$nextTick(() => {
this.cycleStatisticsDataCharts(
@ -3583,7 +3608,7 @@ export default {
interval: msgN[j].interval,
flow: msgN[j].flow,
in_spd: msgN[j].in_spd,
out_spd: msgN[j].out_spd,
out_spd: msgN[j].out_spd
};
this.$nextTick(() => {
this.cycleStatisticsDataCharts(
@ -3633,7 +3658,7 @@ export default {
interval: msgN[j].interval,
flow: msgN[j].flow,
in_spd: msgN[j].in_spd,
out_spd: msgN[j].out_spd,
out_spd: msgN[j].out_spd
};
this.$nextTick(() => {
this.cycleStatisticsDataCharts(
@ -3683,7 +3708,7 @@ export default {
interval: msgN[j].interval,
flow: msgN[j].flow,
in_spd: msgN[j].in_spd,
out_spd: msgN[j].out_spd,
out_spd: msgN[j].out_spd
};
this.$nextTick(() => {
this.cycleStatisticsDataCharts(
@ -3729,7 +3754,7 @@ export default {
interval: msgN[j].interval,
flow: msgN[j].flow,
in_spd: msgN[j].in_spd,
out_spd: msgN[j].out_spd,
out_spd: msgN[j].out_spd
};
this.$nextTick(() => {
this.cycleStatisticsDataCharts(
@ -3775,7 +3800,7 @@ export default {
interval: msgN[j].interval,
flow: msgN[j].flow,
in_spd: msgN[j].in_spd,
out_spd: msgN[j].out_spd,
out_spd: msgN[j].out_spd
};
this.$nextTick(() => {
this.cycleStatisticsDataCharts(
@ -3823,7 +3848,7 @@ export default {
interval: msgN[j].interval,
flow: msgN[j].flow,
in_spd: msgN[j].in_spd,
out_spd: msgN[j].out_spd,
out_spd: msgN[j].out_spd
};
this.$nextTick(() => {
this.cycleStatisticsDataCharts(
@ -3838,6 +3863,7 @@ export default {
// this.addOrUpdateArrayItem(this.triggerODData, {
// ob_data: msgN[j].ob_data
// });
// console.log('固定间隔-OD', JSON.stringify(msgN[j]));
let table = {
ob_data: msgN[j].ob_data
};