From 487754376a1eb675d430a64b7a4aa9e7ffeb405b Mon Sep 17 00:00:00 2001
From: zhuzhuanzhuan
Date: 星期五, 25 八月 2023 09:54:15 +0800
Subject: [PATCH] 调整
---
src/views/mdc/base/modules/comparativeAnalysis/comparativeAnalysisBar.vue | 324 ++++++++++++++++++++++++++++++++++++++++++++++++++---
1 files changed, 304 insertions(+), 20 deletions(-)
diff --git a/src/views/mdc/base/modules/comparativeAnalysis/comparativeAnalysisBar.vue b/src/views/mdc/base/modules/comparativeAnalysis/comparativeAnalysisBar.vue
index 18c9796..2cedc86 100644
--- a/src/views/mdc/base/modules/comparativeAnalysis/comparativeAnalysisBar.vue
+++ b/src/views/mdc/base/modules/comparativeAnalysis/comparativeAnalysisBar.vue
@@ -1,5 +1,5 @@
<template>
- <div class="comparative_Bar" style="width: 100%;height: 700px;display: flex;flex-direction: column;overflow: scroll">
+ <div class="comparative_Bar" style="width: 100%;height: 900px;display: flex;flex-direction: column;overflow: scroll">
<div id="compAnalBar1" style="flex: 1;"></div>
<div id="compAnalBar2" style="flex: 1;"></div>
</div>
@@ -56,6 +56,7 @@
textStyle: {
color: '#90979c'
},
+ color: ['#6496e9', '#4fe1c5'],
data: ['寮�鏈虹巼', '鍒╃敤鐜�']
},
toolbox: {
@@ -154,14 +155,34 @@
name: '寮�鏈虹巼',
type: 'bar',
//barWidth: 30,
+ barWidth: 25,
itemStyle: {
normal: {
- color: '#4169E1'
+ color: function(params) {
+ let colorList = [
+ ["#6496e9","#6bded3"],
+ // ["#849db8","#b4b8cc"],
+ // ["#4fe1c5","#4ecee1"],
+ // // ["#9978fa","#88a1fa"],
+ // ["#ffbb65","#fdc68b"],
+ ];
+ // return colorList[params.dataIndex];
+ let colorItem = colorList[params.dataIndex];
+ return new echarts.graphic.LinearGradient(0,0,0,1,[{
+ offset:0,
+ color:'#6496e9'
+ },
+ {
+ offset:1,
+ color:"#6bded3"
+ }],false)
+ },
+ barBorderRadius: [5, 5, 0, 0],
}
},
data: [0],
- barCategoryGap: '20%',
- barGap : '-10%',
+ // barCategoryGap: '20%',
+ // barGap : '-10%',
markPoint : {
data : [
{type : 'max', name: '鏈�澶у��',symbolSize:70},
@@ -178,11 +199,31 @@
name: '鍒╃敤鐜�',
type: 'bar',
//barWidth: 30,
- barCategoryGap: '20%',
- barGap : '-10%',
+ barWidth: 25,
+ // barCategoryGap: '20%',
+ // barGap : '-10%',
itemStyle: {
normal: {
- color: '#00ee00'
+ color: function(params) {
+ let colorList = [
+ // ["#6496e9","#6bded3"],
+ // ["#849db8","#b4b8cc"],
+ ["#4fe1c5","#4ecee1"],
+ // ["#9978fa","#88a1fa"],
+ // ["#ffbb65","#fdc68b"],
+ ];
+ // return colorList[params.dataIndex];
+ let colorItem = colorList[params.dataIndex];
+ return new echarts.graphic.LinearGradient(0,0,0,1,[{
+ offset:0,
+ color:"#4fe1c5"
+ },
+ {
+ offset:1,
+ color:"#4ecee1"
+ }],false)
+ },
+ barBorderRadius: [5, 5, 0, 0],
}
},
data: [0],
@@ -200,7 +241,187 @@
}
]
};
- let compAnalBarOption2 = {
+ // let compAnalBarOption2 = {
+ // tooltip: {
+ // trigger: 'axis',
+ // axisPointer: {
+ // type: "shadow",
+ // textStyle: {
+ // color: "#fff"
+ // }
+ //
+ // }
+ // },
+ // legend: {
+ // x: '4%',
+ // top: '11%',
+ // textStyle: {
+ // color: '#90979c'
+ // },
+ // data: ['寮�鏈烘椂闂�', '鍏虫満鏃堕棿'],
+ // color:['#6496e9','#b4b8cc']
+ // },
+ // toolbox: {
+ // show : true,
+ // feature : {
+ // mark : {show: true},
+ // magicType : {show: true, type: ['line', 'bar']},
+ // restore : {show: true},
+ // saveAsImage : {show: true,name:'璁惧杩愯鏃堕棿瀵规瘮鍒嗘瀽鍥�'}
+ // }
+ // },
+ // calculable: true,
+ // grid: {
+ // borderWidth: 0,
+ // top: 110,
+ // bottom: 95,
+ // textStyle: {
+ // color: "#fff"
+ // }
+ // },
+ // xAxis: [
+ // {
+ // type: 'category',
+ // splitLine: {
+ // "show": false
+ // },
+ // axisTick: {
+ // "show": false
+ // },
+ // splitArea: {
+ // show: false
+ // },
+ // boundaryGap : true,
+ // axisLabel : {
+ // interval : 0,
+ // rotate : 0,
+ // show: true,
+ // wigth:20,
+ // splitNumber: 8,
+ // textStyle: {
+ // fontFamily: "寰蒋闆呴粦",
+ // fontSize: 12
+ // }
+ // },
+ // data : [0]
+ // }
+ // ],
+ // yAxis: [
+ // {
+ // type: 'value',
+ // splitLine: {
+ // show: false
+ // },
+ // axisLine: {
+ // lineStyle: {
+ // color: '#90979c'
+ // }
+ // },
+ // axisTick: {
+ // show: false
+ // },
+ // axisLabel: {
+ // interval: 0
+ //
+ // },
+ // splitArea: {
+ // show: false
+ // }
+ // }
+ // ],
+ // dataZoom: [{
+ // show: true,
+ // height: 30,
+ // xAxisIndex: [0],
+ // bottom: 30,
+ // start: 0,
+ // end: 100,
+ // handleIcon: 'path://M306.1,413c0,2.2-1.8,4-4,4h-59.8c-2.2,0-4-1.8-4-4V200.8c0-2.2,1.8-4,4-4h59.8c2.2,0,4,1.8,4,4V413z',
+ // handleSize: '110%',
+ // handleStyle: {
+ // color: "#d3dee5"
+ // },
+ // textStyle: {
+ // color: "#fff"
+ // },
+ // borderColor: "#90979c"
+ // }, {
+ // type: "inside",
+ // show: true,
+ // height: 15,
+ // start: 1,
+ // end: 35
+ // }],
+ // series: [
+ // {
+ // name: '寮�鏈烘椂闂�',
+ // type: 'bar',
+ // //barWidth: 30,
+ // barWidth: 25,
+ // // stack: 'sum',
+ // // barCategoryGap: '20%',
+ // itemStyle: {
+ // normal: {
+ // color: function(params) {
+ // let colorList = [
+ // ["#6496e9","#6bded3"],
+ // // ["#849db8","#b4b8cc"],
+ // // ["#4fe1c5","#4ecee1"],
+ // // // ["#9978fa","#88a1fa"],
+ // // ["#ffbb65","#fdc68b"],
+ // ];
+ // // return colorList[params.dataIndex];
+ // let colorItem = colorList[params.dataIndex];
+ // return new echarts.graphic.LinearGradient(0,0,0,1,[{
+ // offset:0,
+ // color:'#6496e9'
+ // },
+ // {
+ // offset:1,
+ // color:"#6bded3"
+ // }],false)
+ // },
+ // barBorderRadius: [5, 5, 0, 0],
+ // }
+ // },
+ // data: [0]
+ // },
+ // {
+ // name: '鍏虫満鏃堕棿',
+ // type: 'bar',
+ // //barWidth: 30,
+ // barWidth: 25,
+ // // stack: 'sum',
+ // // barCategoryGap: '20%',
+ // itemStyle: {
+ // normal: {
+ // color: function(params) {
+ // let colorList = [
+ // // ["#6496e9","#6bded3"],
+ // ["#849db8","#b4b8cc"],
+ // // ["#4fe1c5","#4ecee1"],
+ // // // ["#9978fa","#88a1fa"],
+ // // ["#ffbb65","#fdc68b"],
+ // ];
+ // // return colorList[params.dataIndex];
+ // let colorItem = colorList[params.dataIndex];
+ // return new echarts.graphic.LinearGradient(0,0,0,1,[{
+ // offset:0,
+ // color:'#849db8'
+ // },
+ // {
+ // offset:1,
+ // color:"#b4b8cc"
+ // }],false)
+ // },
+ // barBorderRadius: [5, 5, 0, 0],
+ // }
+ // },
+ // data: [0]
+ // }
+ // ]
+ // };
+ let compAnalBarOption2 = {
tooltip: {
trigger: 'axis',
axisPointer: {
@@ -217,6 +438,7 @@
textStyle: {
color: '#90979c'
},
+ color:['#6496e9','#b4b8cc'],
data: ['寮�鏈烘椂闂�', '鍏虫満鏃堕棿']
},
toolbox: {
@@ -225,7 +447,7 @@
mark : {show: true},
magicType : {show: true, type: ['line', 'bar']},
restore : {show: true},
- saveAsImage : {show: true,name:'璁惧杩愯鏃堕棿瀵规瘮鍒嗘瀽鍥�'}
+ saveAsImage : {show: true,name:'璁惧杩愯鏁堢巼瀵规瘮鍒嗘瀽鍥�'}
}
},
calculable: true,
@@ -315,31 +537,92 @@
name: '寮�鏈烘椂闂�',
type: 'bar',
//barWidth: 30,
- stack: 'sum',
- barCategoryGap: '20%',
+ barWidth: 25,
itemStyle: {
normal: {
- color: '#4169E1'
+ color: function(params) {
+ let colorList = [
+ ["#6496e9","#6bded3"],
+ // ["#849db8","#b4b8cc"],
+ // ["#4fe1c5","#4ecee1"],
+ // // ["#9978fa","#88a1fa"],
+ // ["#ffbb65","#fdc68b"],
+ ];
+ // return colorList[params.dataIndex];
+ let colorItem = colorList[params.dataIndex];
+ return new echarts.graphic.LinearGradient(0,0,0,1,[{
+ offset:0,
+ color:'#6496e9'
+ },
+ {
+ offset:1,
+ color:"#6bded3"
+ }],false)
+ },
+ barBorderRadius: [5, 5, 0, 0],
}
},
- data: [0]
+ data: [0],
+ // barCategoryGap: '20%',
+ // barGap : '-10%',
+ markPoint : {
+ data : [
+ {type : 'max', name: '鏈�澶у��',symbolSize:70},
+ {type : 'min', name: '鏈�灏忓��',symbolSize:70}
+ ]
+ },
+ markLine : {
+ data : [
+ {type : 'average', name: '骞冲潎鍊�'}
+ ]
+ }
},
{
name: '鍏虫満鏃堕棿',
type: 'bar',
//barWidth: 30,
- stack: 'sum',
- barCategoryGap: '20%',
+ barWidth: 25,
+ // barCategoryGap: '20%',
+ // barGap : '-10%',
itemStyle: {
normal: {
- color: '#A8A8A8'
+ color: function(params) {
+ let colorList = [
+ // ["#6496e9","#6bded3"],
+ ["#849db8","#b4b8cc"],
+ // ["#4fe1c5","#4ecee1"],
+ // ["#9978fa","#88a1fa"],
+ // ["#ffbb65","#fdc68b"],
+ ];
+ // return colorList[params.dataIndex];
+ let colorItem = colorList[params.dataIndex];
+ return new echarts.graphic.LinearGradient(0,0,0,1,[{
+ offset:0,
+ color:"#849db8"
+ },
+ {
+ offset:1,
+ color:"#b4b8cc"
+ }],false)
+ },
+ barBorderRadius: [5, 5, 0, 0],
}
},
- data: [0]
+ data: [0],
+ markPoint : {
+ data : [
+ {type : 'max', name: '鏈�澶у��',symbolSize:70},
+ {type : 'min', name: '鏈�灏忓��',symbolSize:70}
+ ]
+ },
+ markLine : {
+ data : [
+ {type : 'average', name: '骞冲潎鍊�'}
+ ]
+ }
}
]
};
-
if(this.OpenCloseList != null){
this.equipmentList = []
this.openRate =[]
@@ -348,8 +631,9 @@
this.closeLong = []
for(var i = 0;i<this.OpenCloseList.length;i++){
this.equipmentList.push(this.OpenCloseList[i].equipmentId)
- this.openRate.push(this.OpenCloseList[i].openRate)
- this.utilizationRate.push(this.OpenCloseList[i].utilizationRate)
+ this.openRate.push((this.OpenCloseList[i].openRate*100).toFixed(2))
+ // (this.openRate * 100).toFixed(2)
+ this.utilizationRate.push((this.OpenCloseList[i].utilizationRate*100).toFixed(2))
this.openLong.push(this.OpenCloseList[i].openLong)
this.closeLong.push(this.OpenCloseList[i].closeLong)
}
--
Gitblit v1.9.3