From 0bf3950dac8183087e7265c3edef74eab1ef4166 Mon Sep 17 00:00:00 2001 From: qiudan <1044775178@qq.com> Date: Mon, 6 Nov 2023 22:20:40 +0800 Subject: [PATCH] =?UTF-8?q?bug=E4=BF=AE=E6=94=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/chart/barChart.vue | 46 +++-- src/components/chart/lineChart.vue | 32 ++-- src/components/chart/pieChart.vue | 2 +- src/components/sensorFusion/echartsLine.vue | 81 ++++++-- src/components/target/typeChart.vue | 59 +++--- src/views/bounced/dataBoard.vue | 20 +- src/views/index.vue | 29 +-- src/views/sensorFusion/index.vue | 201 +++++++++----------- 8 files changed, 252 insertions(+), 218 deletions(-) diff --git a/src/components/chart/barChart.vue b/src/components/chart/barChart.vue index 44788c9..aef17c5 100644 --- a/src/components/chart/barChart.vue +++ b/src/components/chart/barChart.vue @@ -1,14 +1,22 @@ @@ -40,20 +48,19 @@ export default { } }, data() { - return { - }; + return {}; }, created() {}, methods: { drawBar(newVal) { - if (newVal) { - var xData = newVal.type_data.map(ele => { - return ele.name; - }); - var yData = newVal.type_data.map(ele => { - return ele.quantity; - }); - } + if (newVal && newVal.type_data && newVal.type_data.length > 0) { + var xData = newVal.type_data.map((ele) => { + return ele.name; + }); + var yData = newVal.type_data.map((ele) => { + return ele.quantity; + }); + } let myChart = this.$echarts.getInstanceByDom(this.$refs.barChart); if (myChart == null) { myChart = this.$echarts.init(this.$refs.barChart); @@ -120,12 +127,12 @@ export default { barWidth: 20, itemStyle: { barBorderRadius: [5, 5, 0, 0] }, name: '时间', - data:yData + data: yData } ] }; myChart.setOption(option); - window.addEventListener('resize', function() { + window.addEventListener('resize', function () { myChart.resize(); }); // this.$nextTick(() => { @@ -134,10 +141,7 @@ export default { // }) } }, - mounted() { - }, - watch: { - - } + mounted() {}, + watch: {} }; diff --git a/src/components/chart/lineChart.vue b/src/components/chart/lineChart.vue index 328f32d..d533e0f 100644 --- a/src/components/chart/lineChart.vue +++ b/src/components/chart/lineChart.vue @@ -209,8 +209,10 @@ export default { var mapN = []; if (arr && arr.length > 0) { for (var t = 0; t < arr.length; t++) { - for (var i = 0; i < arr[t].length; i++) { - mapN.push(arr[t][i]); + if (arr[t] && arr[t].length > 0) { + for (var i = 0; i < arr[t].length; i++) { + mapN.push(arr[t][i]); + } } } } @@ -226,18 +228,24 @@ export default { }); }); } - mapN.forEach((ele) => { - if (ele.name == '机动车') { - lineArr[0].data.push(ele.quantity); - } else if (ele.name == '非机动车') { - lineArr[1].data.push(ele.quantity); - } else { - lineArr[2].data.push(ele.quantity); + mapN.forEach((ele, index) => { + if (lineArr[index] && lineArr[index].data) { + lineArr[index].data.push(ele.quantity); } + // if (ele.name == '机动车') { + // lineArr[0].data.push(ele.quantity); + // } else if (ele.name == '非机动车') { + // lineArr[1].data.push(ele.quantity); + // } else { + // lineArr[2].data.push(ele.quantity); + // } }); - for (let j = 0; j < lineArr.length; j++) { - series.push(lineArr[j]); + if (lineArr && lineArr.length > 0) { + for (let j = 0; j < lineArr.length; j++) { + series.push(lineArr[j]); + } } + // 总和数量 let mapNR1 = []; newVal.map(function (ele) { @@ -251,7 +259,7 @@ export default { series[0].data = mapNR1; } else if (title === '速度') { let unit = 'km/h'; - if (this.originalDataArr.length > 0) { + if (this.originalDataArr && this.originalDataArr.length > 0) { if (this.originalDataArr[0].speed >= 0) { unit = 'km/h'; } else { diff --git a/src/components/chart/pieChart.vue b/src/components/chart/pieChart.vue index 04f62c5..e9ea145 100644 --- a/src/components/chart/pieChart.vue +++ b/src/components/chart/pieChart.vue @@ -52,7 +52,7 @@ export default { created() {}, methods: { drawPie(newVal) { - if (newVal) { + if (newVal&&newVal.type_data&&newVal.type_data.length>0) { var legend = newVal.type_data.map((ele) => { return ele.name; }); diff --git a/src/components/sensorFusion/echartsLine.vue b/src/components/sensorFusion/echartsLine.vue index da5c3db..644d545 100644 --- a/src/components/sensorFusion/echartsLine.vue +++ b/src/components/sensorFusion/echartsLine.vue @@ -50,7 +50,8 @@ export default { }, //表格数据 seriesList: [], //类型数组 typeData: [], - title: '' + title: '', + num: 1 }; }, created() {}, @@ -58,12 +59,18 @@ export default { methods: { //传值对应字段返回相应字段数组 extractKeyValues(arr, key) { - return arr.map((item) => item[key]); + return arr.map((item) => { + if (key == 'speed' && item[key]) { + return Math.abs(item[key]); + } + return item[key]; + }); }, //数据判断处理 dataProcessing(val) { if (val.length > 10) { val = val.slice(-10); + // this.typeData = this.typeData.slice(-10); } if (val != null) { if (this.timeMode == '实时触发') { @@ -82,12 +89,18 @@ export default { 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'); + this.chartData.xData = this.extractKeyValues(val, 'time').reverse(); 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); + const valueList = seriesArr.map((arr) => { + let t = arr[i].value; + if (arr[i].quantity || arr[i].quantity === 0) { + t = arr[i].quantity; + } + return t; + }); transformedData.push({ name: item.name, value: valueList @@ -124,15 +137,21 @@ export default { 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'); + this.chartData.xData = this.extractKeyValues(val, 'time').reverse(); let seriesArr = this.extractKeyValues(val, 'type_data'); - console.log('seriesArr-固定时刻',seriesArr) + // console.log('seriesArr-固定时刻', seriesArr); const transformedData = []; for (let i = 0; i < seriesArr[0].length; i++) { const item = seriesArr[0][i]; - //固定间隔主题-类型组件type_data取value字段和固定时刻不一样，固定时刻取quantity字段 + //固定间隔主题-类型组件type_data取value字段和历史数据接口不一样，历史数据接口取quantity字段 // const valueList = seriesArr.map((arr) => arr[i].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; + } + return t; + }); transformedData.push({ name: item.name, value: valueList @@ -170,20 +189,28 @@ export default { 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'); + this.chartData.xData = this.extractKeyValues(val, 'time').reverse(); let seriesArr = this.extractKeyValues(val, 'type_data'); - // console.log('seriesArr-固定间隔',seriesArr) + // console.log('固定间隔-类型-seriesArr-', seriesArr); + // console.log('固定间隔-类型-xData-', this.chartData.xData); const transformedData = []; 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); + //固定间隔主题-类型组件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; + } + return t; + }); transformedData.push({ name: item.name, value: valueList }); } - // console.log('transformedData-2',transformedData) + // console.log('固定间隔-类型-transformedData-1', transformedData); const totalCountList = transformedData[0].value.map((_, i) => { return transformedData.reduce((sum, curr) => sum + curr.value[i], 0); }); @@ -192,6 +219,7 @@ export default { value: totalCountList }); this.seriesList = transformedData; + // console.log('固定间隔-类型-transformedData-2', transformedData); } else if (this.componentType == '延误') { this.chartData.xData = this.extractKeyValues(val, 'time'); this.chartData.yData = this.extractKeyValues(val, 'ave_delay'); @@ -216,7 +244,7 @@ export default { } } else if (this.componentType == '速度') { if (this.dataList.length > 0) { - // console.log(this.dataList[0].originalSpeed,'速度速度速度速度') + // console.log(this.dataList[0].originalSpeed,'速度速度速度速度') if (this.dataList[0].originalSpeed >= 0) { this.title = 'km/h'; } else { @@ -249,9 +277,22 @@ export default { // slicedData = data; // 如果数据不足 10 条，则保留全部数据 // } if (this.componentType == '类型') { - console.log('类型-dataList',this.dataList) - this.typeData.push({ type_data: this.dataList[0].type_data, time: this.dataList[0].time }); - console.log('类型-typeData',this.typeData) + // console.log('类型-dataList', this.dataList); + if (this.dataList.length > 0 && this.num == 1) { + // this.typeData.push({ type_data: this.dataList[0].type_data, time: this.dataList[0].time }); + this.dataList.sort((a, b) => { + const timeA = new Date(a.time); + const timeB = new Date(b.time); + return timeA - timeB; + }); + for (const item of this.dataList) { + this.typeData.push({ type_data: item.type_data, time: item.time }); + } + this.num++; + } else { + this.typeData.push({ type_data: this.dataList[0].type_data, time: this.dataList[0].time }); + } + // console.log('类型-typeData', this.typeData); this.dataProcessing(this.typeData); } else { this.dataProcessing(this.dataList); @@ -266,7 +307,7 @@ export default { var seriesList = []; var color = ['#0CD2E6', '#3751E6', '#FFC722', 'rgb(255,115,38)']; if (this.componentType == '类型') { - console.log('类型-seriesList',this.seriesList) + // console.log('类型-seriesList', this.seriesList); for (let i = 0; i < this.seriesList.length; i++) { seriesList.push({ name: this.seriesList[i].name, @@ -465,8 +506,8 @@ export default { }, echartsRef: { handler: function (oldValues, newValues) { - console.log('old', oldValues); - console.log('newV', newValues); + // console.log('old', oldValues); + // console.log('newV', newValues); let that = this; setTimeout(() => { that.$nextTick(() => { diff --git a/src/components/target/typeChart.vue b/src/components/target/typeChart.vue index a623160..91dd65b 100644 --- a/src/components/target/typeChart.vue +++ b/src/components/target/typeChart.vue @@ -4,7 +4,7 @@
-
+
{{ n.quantity || n.quantity === 0 ? n.quantity : ' - ' }} - 个 + 个
@@ -28,7 +28,7 @@
-
+
{{ n.quantity || n.quantity === 0 ? n.quantity : ' - ' }} - 个 + 个
@@ -59,12 +59,9 @@ {{ getTotal(cycleAccumulateDataArr) }} - 个 + 个
-
+
速度
@@ -90,12 +87,8 @@
-
- 流量
+
+ 流量
{{ cycleAccumulateDataArr[0].out_flow || cycleAccumulateDataArr[0].out_flow === 0 ? cycleAccumulateDataArr[0].out_flow @@ -149,18 +142,15 @@
-
+
类型数量总和
{{ getTotal(newDataArr) }} - 个 + 个
-
+
速度
@@ -176,20 +166,13 @@
-
+
流量
{{ - newDataArr[0].out_flow || newDataArr[0].out_flow === 0 - ? newDataArr[0].out_flow - : ' - ' + newDataArr[0].out_flow || newDataArr[0].out_flow === 0 ? newDataArr[0].out_flow : ' - ' }} {{ - newDataArr[0].in_flow || newDataArr[0].in_flow === 0 - ? newDataArr[0].in_flow - : ' - ' + newDataArr[0].in_flow || newDataArr[0].in_flow === 0 ? newDataArr[0].in_flow : ' - ' }} 辆
@@ -236,7 +219,7 @@
-
+
{ // //console.log("item.name",item.name) // }) + // for (const item of msgN) { + // if (item.name == 'gate3触发') { + // console.log('实时触发trigger-', item); + // } + // } this.triggerListData = msgN; } catch (error) {} break; @@ -1492,7 +1498,7 @@ export default { const temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串 var detId = []; const msgN = JSON.parse(temp); - //console.log('固定时刻', msgN); + // console.log('固定时刻', msgN); this.cycleTimeData = msgN; } catch (error) {} break; @@ -1516,24 +1522,23 @@ export default { const temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串 var detId = []; const msgN = JSON.parse(temp); - //console.log("cycle_statistics-固定间隔1",temp) - // //console.log("cycle_statistics-固定间隔2",msgN) + // console.log("cycle_statistics-固定间隔",temp) this.cycleStatisticsData = msgN; } catch (error) {} break; case 'cycle_accumulate-' + this.$route.query.id: try { //周期统计实时累计数据主题 - // //console.log("trigger_msgN",message) + // console.log("trigger_msgN",message) const utf8decoder = new TextDecoder(); const u8arr = new Uint8Array(message); const temp = utf8decoder.decode(u8arr); // 将二进制数据转为字符串 var detId = []; const msgN = JSON.parse(temp); - console.log('cycle_accumulate-周期统计实时累计数据主题', msgN); - for (const t of msgN) { - console.log(JSON.stringify(t.type_data)) - } + // console.log('cycle_accumulate-周期统计实时累计数据主题', msgN); + // for (const t of msgN) { + // console.log(JSON.stringify(t.type_data)) + // } this.cycleAccumulateData = msgN; } catch (error) {} break; @@ -1911,13 +1916,13 @@ export default { } return type; }, - getFigureD(item, index, indexNew,numberNew) { + getFigureD(item, index, indexNew, numberNew) { //console.log('图形类型', item); //console.log('初始图形名称', index); this.startFigureName = index; //console.log('图形位置', indexNew); // numberNew 1-画布区 2-模拟区 - this.numberNew = numberNew + this.numberNew = numberNew; this.dialogFormVisible = true; this.switchValue = 0; this.typeCheckList = [ diff --git a/src/views/sensorFusion/index.vue b/src/views/sensorFusion/index.vue index 68559b4..fe4c5c9 100644 --- a/src/views/sensorFusion/index.vue +++ b/src/views/sensorFusion/index.vue @@ -128,7 +128,10 @@ i.triggerData.type_data[0].quantity }} --> - {{ getTotal(i.triggerData.type_data, 'quantity') }} + {{ + getTotal(i.triggerData.type_data, 'quantity', 'value') + }} + - - - {{ getTotal(i.cycleTimeData[0].type_data, 'quantity') }} - - - {{ getTotal(i.triggerData.type_data, 'quantity') }} - - - {{ getTotal(i.triggerData.type_data, 'value') }} - + + - {{ - i.triggerData.speed > 0 || i.triggerData.speed === 0 - ? 'km/h' - : 'pix/s' + i.triggerData.speed > 0 || i.triggerData.speed === 0 ? 'km/h' : 'pix/s' }} @@ -379,12 +357,7 @@
- -
+
- + - {{ getTotal(i.cycleStatisticsData[0].type_data, 'quantity') }} - - - - + - {{ getTotal(i.triggerData.type_data, 'quantity') }} - - - - - {{ getTotal(i.triggerData.type_data, 'value') }} + {{ getTotal(i.triggerData.type_data, 'quantity', 'value') }} + + - {{ - i.cycleStatisticsData[0].speed > 0 || i.cycleStatisticsData[0].speed === 0 + i.cycleStatisticsData[0].speed > 0 || + i.cycleStatisticsData[0].speed === 0 ? 'km/h' : 'pix/s' }} @@ -616,9 +574,7 @@ " > {{ - i.triggerData.speed > 0 || i.triggerData.speed === 0 - ? 'km/h' - : 'pix/s' + i.triggerData.speed > 0 || i.triggerData.speed === 0 ? 'km/h' : 'pix/s' }} @@ -638,6 +594,7 @@ {{ i.triggerData.time }}
+
@@ -1430,7 +1387,7 @@