From 292d91b71968b66bfdfd48dbfcf72c7a8290f62c Mon Sep 17 00:00:00 2001
From: wangqi <magical1908@outlook.com>
Date: 星期四, 15 四月 2021 09:41:14 +0800
Subject: [PATCH] 废气图标
---
src/components/BaseNav/PublicBounced/common/echarts/EChartsRealWasteWater.vue | 114 +++++++++++++++++++++++++++++----------------------------
1 files changed, 58 insertions(+), 56 deletions(-)
diff --git a/src/components/BaseNav/PublicBounced/common/echarts/EChartsRealWasteWater.vue b/src/components/BaseNav/PublicBounced/common/echarts/EChartsRealWasteWater.vue
index fbd04d6..be91bb6 100644
--- a/src/components/BaseNav/PublicBounced/common/echarts/EChartsRealWasteWater.vue
+++ b/src/components/BaseNav/PublicBounced/common/echarts/EChartsRealWasteWater.vue
@@ -3,9 +3,9 @@
<div id="Tab">
<div class="animation">
<div class="infomation">
- <span class="grid-content">COD : <i style="color: #e8ee0b">11.24385</i> 鏍囧噯 : 50</span>
- <span class="grid-content">姘哀 :<i style="color: #e8ee0b">0.1889014</i> 鏍囧噯 : 30</span>
- <span class="grid-content">鎬荤７ : <i style="color: #e8ee0b">0.03812287</i> 鏍囧噯 : 5</span>
+ <span class="grid-content">COD : <i style="color: #e8ee0b">11.24385</i> 鏍囧噯 : <i style="color: #fff">50</i>></span>
+ <span class="grid-content">姘哀 :<i style="color: #e8ee0b">0.1889014</i> 鏍囧噯 : <i style="color: #fff">30</i></span>
+ <span class="grid-content">鎬荤７ : <i style="color: #e8ee0b">0.03812287</i> 鏍囧噯 : <i style="color: #fff">5</i></span>
<span class="grid-content">搴熸按娴侀噺 : <i style="color: #e8ee0b">32.16287</i></span>
</div>
</div>
@@ -39,9 +39,8 @@
</div>
<div class="detailbtn" @click="onSubmit">鏌ヨ</div>
</div>
- <div class="boxChart" style="height: 260px">
- <div style="width: 100%;height: 100%;" id="popChart" ref="main">
- </div>
+ <div class="boxChart">
+ <div style="width: 5rem;height: 1.5rem;" id="popChart" ref="main"></div>
</div>
</div>
</div>
@@ -250,6 +249,10 @@
}
},
mounted () {
+ this.formInline.timeEnd = dayjs().format('YYYY-MM-DD HH:mm:ss')
+ this.formInline.timeStart = dayjs().subtract(1, 'minute').format('YYYY-MM-DD HH:mm:ss')
+ // console.log(this.formInline.timeStart)
+ console.log(this.JsonRealWasteWater.ydatas[0].data[0].value[0])
this.DrawRealTimeDateChart(this.JsonRealWasteWater.id, this.JsonRealWasteWater.title, this.JsonRealWasteWater.legend, this.JsonRealWasteWater.ydatas, this.JsonRealWasteWater.yname)
},
methods: {
@@ -272,20 +275,20 @@
itemStyle: {
normal: {
color: function (c) { // 鏍规嵁value 鏄剧ず涓嶅悓鐨勬姌鐐归鑹�
- /* var biaozhuiz
- for (var i = 0; i < bzzList.length; i++) {
- if (bzzList[i].name == c.seriesName) {
- biaozhuiz = bzzList[i].bzhui
- }
- }
- if (c.value[1] > biaozhuiz) {
- return zdcbcolor
- } else if (c.value[1] > biaozhuiz * 0.9) {
- return '#FFA500'
- }
- {
- return '#33c95f'
- } */
+ // var biaozhuiz
+ // for (var i = 0; i < bzzList.length; i++) {
+ // if (bzzList[i].name == c.seriesName) {
+ // biaozhuiz = bzzList[i].bzhui
+ // }
+ // }
+ // if (c.value[1] > biaozhuiz) {
+ // return zdcbcolor
+ // } else if (c.value[1] > biaozhuiz * 0.9) {
+ // return '#FFA500'
+ // }
+ // {
+ // return '#33c95f'
+ // }
},
lineStyle: { // 鎶樼嚎鐨勯鑹�
color: ydatas[i].zxcolor,
@@ -348,7 +351,7 @@
}
}
- if (ydatas[i].name === '搴熸按娴侀噺' || ydatas[i].name === '搴熸按') {
+ if (ydatas[i].name === '搴熸皵娴侀噺' || ydatas[i].name === '搴熸皵') {
obj.yAxisIndex = 1
}
serLists.push(obj)
@@ -365,8 +368,8 @@
label: {
color: '#1a4245'
}
- },
- formatter: function (params) {
+ }
+ /* formatter: function (params) {
var s = params[0].name + '<br />'
for (var i = 0; i < params.length; i++) {
// var name = params[i].name
@@ -374,23 +377,33 @@
var seriesName = params[i].seriesName
// 鍊�
var value = params[i].value[1]
- var valueFliter = this.formatter(value)
+
+ var valueFliter = formatter(value)
+
var maker = params[i].marker
- if (seriesName === 'COD') {
- maker = '<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:#fff21c;"></span>'
- } else if (seriesName === '姘ㄦ爱') {
- maker = '<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:#00B0F0;"></span>'
- } else if (seriesName === '鎬荤７') {
- maker = '<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:#f48183;"></span>'
- } else if (seriesName === '鎬绘爱') {
- maker = '<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:#d9f2f4;"></span>'
- } else {
- maker = '<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:#9ACD32;"></span>'
+ var colo = ''
+ switch (seriesName) {
+ case 'COD':
+ colo = '#fff21c'
+ break
+ case '姘ㄦ爱':
+ colo = '#00B0F0'
+ break
+ case '鎬荤７':
+ colo = '#f48183'
+ break
+ case '鎬绘爱':
+ colo = '#e0ffff'
+ break
+ default:
+ colo = '#9ACD32'
+ break
}
+ maker = '<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:' + colo + ';"></span>'
s += maker + seriesName + ':' + valueFliter + '<br />'
}
return s
- }
+ } */
},
toolbox: { // 鎵撳嵃绛夊伐鍏�
show: false,
@@ -399,7 +412,10 @@
}
},
grid: { // 缃戞牸
- top: '20%'
+ top: '20%',
+ left: '7%',
+ bottom: '10%',
+ right: '5%'
},
legend: {
data: legend
@@ -425,9 +441,6 @@
xAxis: { // x 杞磋缃�
type: 'time',
boundaryGap: false,
- nameTextStyle: {
- fontSize: 15
- },
axisLabel: { // x杞村叏閮ㄦ樉绀�
// rotate: 30,
margin: 6,
@@ -457,8 +470,7 @@
type: 'value',
name: yname,
max: function (value) {
- var ma = value.max > 100 ? value.max : 100
- return parseInt(ma)
+ return parseInt(value.max + 30)
},
axisLabel: {
formatter: '{value}',
@@ -480,7 +492,7 @@
}
}, {
type: 'value',
- name: '娴侀噺(m鲁/h)',
+ name: '娴侀噺(m鲁/d)',
axisLabel: {
formatter: '{value}',
textStyle: {
@@ -493,6 +505,9 @@
splitLine: {
show: false
}, // y杞� 缃戞牸绾夸笉鏄剧ず,
+ // inverse: true,
+ // nameLocation: 'start',
+ // max:500,
axisLine: {
lineStyle: {
color: '#FFFFFF',
@@ -578,20 +593,7 @@
}
}
RealTimeChart.setOption(op)
- })
- },
- drawChart: function () {
- window.onresize = function () {
- var h1 = document.documentElement.clientHeight// 鑾峰彇灞忓箷鐨勯珮搴�
- if (h1 > 700) {
- this.myChart.getDom().style.height = 3 + 'rem'
- this.myChart.getDom().style.width = 6 + 'rem'
- } else {
- this.myChart.getDom().style.height = 3 + 'rem'
- this.myChart.getDom().style.width = 6 + 'rem'
- }
- this.myChart.resize()
- } */
+ }) */
}
}
}
--
Gitblit v1.8.0