diff --git a/src/assets/newImgs/pumpGY/projectBg.jpg b/src/assets/newImgs/pumpGY/projectBg.jpg index 8265d7e..94b428c 100644 --- a/src/assets/newImgs/pumpGY/projectBg.jpg +++ b/src/assets/newImgs/pumpGY/projectBg.jpg Binary files differ diff --git a/src/assets/newImgs/pumpGY/projectBg.jpg b/src/assets/newImgs/pumpGY/projectBg.jpg index 8265d7e..94b428c 100644 --- a/src/assets/newImgs/pumpGY/projectBg.jpg +++ b/src/assets/newImgs/pumpGY/projectBg.jpg Binary files differ diff --git a/src/views/sponeScreen/Echarts/AssessmentEcharts.vue b/src/views/sponeScreen/Echarts/AssessmentEcharts.vue index 91e838a..04c45d1 100644 --- a/src/views/sponeScreen/Echarts/AssessmentEcharts.vue +++ b/src/views/sponeScreen/Echarts/AssessmentEcharts.vue @@ -50,13 +50,6 @@ xAxis: [ { type: 'category', - axisLine: { - show: false, - lineStyle: { - width: 2, - color: '#58b2ed', - }, - }, splitLine: { show: false, }, diff --git a/src/assets/newImgs/pumpGY/projectBg.jpg b/src/assets/newImgs/pumpGY/projectBg.jpg index 8265d7e..94b428c 100644 --- a/src/assets/newImgs/pumpGY/projectBg.jpg +++ b/src/assets/newImgs/pumpGY/projectBg.jpg Binary files differ diff --git a/src/views/sponeScreen/Echarts/AssessmentEcharts.vue b/src/views/sponeScreen/Echarts/AssessmentEcharts.vue index 91e838a..04c45d1 100644 --- a/src/views/sponeScreen/Echarts/AssessmentEcharts.vue +++ b/src/views/sponeScreen/Echarts/AssessmentEcharts.vue @@ -50,13 +50,6 @@ xAxis: [ { type: 'category', - axisLine: { - show: false, - lineStyle: { - width: 2, - color: '#58b2ed', - }, - }, splitLine: { show: false, }, diff --git a/src/views/sponeScreen/Echarts/AssessmentjsEcharts.vue b/src/views/sponeScreen/Echarts/AssessmentjsEcharts.vue index f72018e..4189d91 100644 --- a/src/views/sponeScreen/Echarts/AssessmentjsEcharts.vue +++ b/src/views/sponeScreen/Echarts/AssessmentjsEcharts.vue @@ -27,6 +27,27 @@ }; const init = () => { + let markLinedata = []; + if (props.data.controlMarkLine.length) { + props.data.controlMarkLine.map(item => { + let newitem = { + silent: true, //鼠标悬停事件 true没有,false有 + lineStyle: { + //警戒线的样式 ,虚实 颜色 + type: 'solid', + color: item.color, + opacity: item.Opacity, + width: 2, + }, + yAxis: item.value, + label: { + formatter: `${item.typeName}:${item.value}` + '(m)', + color: item.color, + }, + }; + markLinedata.push(newitem); + }); + } let chartDom = echarts.init(document.getElementById(allData.id)); var option; option = { @@ -48,13 +69,6 @@ xAxis: [ { type: 'category', - axisLine: { - show: false, - lineStyle: { - width: 2, - color: '#58b2ed', - }, - }, splitLine: { show: false, }, @@ -85,13 +99,14 @@ splitLine: { lineStyle: { type: 'dashed', - color: '#60C2FF', + color: '#1D5D81', }, }, max: Math.max(...props.data.yAxis) + 0.5, }, { name: '水深(m)', + max: markLinedata.length > 0 ? Number(markLinedata[0].yAxis) + 0.3 : 3, type: 'value', inverse: false, nameLocation: 'end', // 坐标轴名称显示位置 @@ -99,9 +114,8 @@ axisLabel: { show: true, color: '#FFF21C' }, splitLine: { lineStyle: { - color: '#D1DEEE', + color: '#1D5D81', type: 'dashed', - color: '#53D8FB', }, }, }, @@ -128,8 +142,14 @@ data: props.data.yAxis2, yAxisIndex: 1, color: '#FFF21C', + markLine: { + // symbol: 'none', //去掉警戒线最后面的箭头 + label: { + position: 'middle', //将警示值放在哪个位置,三个值“start”,"middle","end" 开始 中点 结束 + }, + data: markLinedata, + }, }, - 4, ], }; option && chartDom.setOption(option, true); diff --git a/src/assets/newImgs/pumpGY/projectBg.jpg b/src/assets/newImgs/pumpGY/projectBg.jpg index 8265d7e..94b428c 100644 --- a/src/assets/newImgs/pumpGY/projectBg.jpg +++ b/src/assets/newImgs/pumpGY/projectBg.jpg Binary files differ diff --git a/src/views/sponeScreen/Echarts/AssessmentEcharts.vue b/src/views/sponeScreen/Echarts/AssessmentEcharts.vue index 91e838a..04c45d1 100644 --- a/src/views/sponeScreen/Echarts/AssessmentEcharts.vue +++ b/src/views/sponeScreen/Echarts/AssessmentEcharts.vue @@ -50,13 +50,6 @@ xAxis: [ { type: 'category', - axisLine: { - show: false, - lineStyle: { - width: 2, - color: '#58b2ed', - }, - }, splitLine: { show: false, }, diff --git a/src/views/sponeScreen/Echarts/AssessmentjsEcharts.vue b/src/views/sponeScreen/Echarts/AssessmentjsEcharts.vue index f72018e..4189d91 100644 --- a/src/views/sponeScreen/Echarts/AssessmentjsEcharts.vue +++ b/src/views/sponeScreen/Echarts/AssessmentjsEcharts.vue @@ -27,6 +27,27 @@ }; const init = () => { + let markLinedata = []; + if (props.data.controlMarkLine.length) { + props.data.controlMarkLine.map(item => { + let newitem = { + silent: true, //鼠标悬停事件 true没有,false有 + lineStyle: { + //警戒线的样式 ,虚实 颜色 + type: 'solid', + color: item.color, + opacity: item.Opacity, + width: 2, + }, + yAxis: item.value, + label: { + formatter: `${item.typeName}:${item.value}` + '(m)', + color: item.color, + }, + }; + markLinedata.push(newitem); + }); + } let chartDom = echarts.init(document.getElementById(allData.id)); var option; option = { @@ -48,13 +69,6 @@ xAxis: [ { type: 'category', - axisLine: { - show: false, - lineStyle: { - width: 2, - color: '#58b2ed', - }, - }, splitLine: { show: false, }, @@ -85,13 +99,14 @@ splitLine: { lineStyle: { type: 'dashed', - color: '#60C2FF', + color: '#1D5D81', }, }, max: Math.max(...props.data.yAxis) + 0.5, }, { name: '水深(m)', + max: markLinedata.length > 0 ? Number(markLinedata[0].yAxis) + 0.3 : 3, type: 'value', inverse: false, nameLocation: 'end', // 坐标轴名称显示位置 @@ -99,9 +114,8 @@ axisLabel: { show: true, color: '#FFF21C' }, splitLine: { lineStyle: { - color: '#D1DEEE', + color: '#1D5D81', type: 'dashed', - color: '#53D8FB', }, }, }, @@ -128,8 +142,14 @@ data: props.data.yAxis2, yAxisIndex: 1, color: '#FFF21C', + markLine: { + // symbol: 'none', //去掉警戒线最后面的箭头 + label: { + position: 'middle', //将警示值放在哪个位置,三个值“start”,"middle","end" 开始 中点 结束 + }, + data: markLinedata, + }, }, - 4, ], }; option && chartDom.setOption(option, true); diff --git a/src/views/sponeScreen/projectHM/ProjectEvaluation.vue b/src/views/sponeScreen/projectHM/ProjectEvaluation.vue index e7a750e..31d2510 100644 --- a/src/views/sponeScreen/projectHM/ProjectEvaluation.vue +++ b/src/views/sponeScreen/projectHM/ProjectEvaluation.vue @@ -90,7 +90,7 @@ import xmfx from '@/assets/newImgs/HMScreen/xmfx.png'; import bus from '@/bus'; import WaterAnalysis_icon from '@/assets/newImgs/HMScreen/WaterAnalysis_icon.png'; -import { graphicReport } from '@/api/dataAnalysis/syntherticData'; +import { graphicReport, getStationList } from '@/api/dataAnalysis/syntherticData'; import { listrtuSiteInfo } from '@/api/dataAnalysis/rtuSiteInfo'; import { rtuWarnConfigList } from '@/api/dataAnalysis/historyGj.js'; @@ -177,6 +177,7 @@ yAxis: [], //降雨量 yAxis2: [], //水深 refresh: 1, + controlMarkLine: [], }); // 积水点点击切换 const changeJSD = () => { @@ -211,6 +212,12 @@ let datas = res2.data; chartDataJSD.value.yAxis2 = nameToData(datas.propertyMonitorList, '水位'); } + + // 获取管网井深 + let res3 = await getStationList({ stCode: jsdVal.value }); + if (res3 && res3.code == 200) { + chartDataJSD.value.controlMarkLine = [{ typeName: '井深', value: res3.data[0].bottomBuriedDepthTemp, Opacity: 1, color: '#FF4940' }]; + } chartDataJSD.value.refresh = Math.random(); loadingJSD.value = false; }