+
碳排放
diff --git a/src/views/drainage/index.vue b/src/views/drainage/index.vue
index 31c2d72..a3d35a2 100644
--- a/src/views/drainage/index.vue
+++ b/src/views/drainage/index.vue
@@ -1,13 +1,291 @@
-
- 排水
-
+
-
\ No newline at end of file
diff --git a/src/views/energyEfficiency/index.vue b/src/views/energyEfficiency/index.vue
index 1250668..2e9009a 100644
--- a/src/views/energyEfficiency/index.vue
+++ b/src/views/energyEfficiency/index.vue
@@ -19,51 +19,51 @@ const systemRightList = ref([
{
name: '今日',
value: '3122',
- unit:'kWh'
+ unit: 'kWh'
},
{
name: '昨日',
value: '9400',
- unit:'kWh'
+ unit: 'kWh'
},
{
- name:'同比',
- value:'-201',
- unit:'%'
+ name: '同比',
+ value: '-201',
+ unit: '%'
}
],//日
[
{
name: '本月',
value: '3122',
- unit:'kWh'
+ unit: 'kWh'
},
{
name: '上月',
value: '9400',
- unit:'kWh'
+ unit: 'kWh'
},
{
- name:'同比',
- value:'-201',
- unit:'%'
+ name: '同比',
+ value: '-201',
+ unit: '%'
}
],//月
[
{
name: '今年',
value: '3122',
- unit:'kWh'
+ unit: 'kWh'
},
{
name: '去年',
value: '9400',
- unit:'kWh'
+ unit: 'kWh'
},
{
- name:'同比',
- value:'-201',
- unit:'%'
+ name: '同比',
+ value: '-201',
+ unit: '%'
}
]//年
])
@@ -359,14 +359,18 @@ const drawEnergyFlow = () => {
let option = {
series: [
{
+ // select:{
+ // disabled:true
+ // },
type: "sankey",
layout: "none",
top: "5%",
bottom: "4%",
left: "6%",
right: "5%",
- nodeWidth: '13',
- // nodeAlign:'right',
+ nodeWidth: '12',
+
+ nodeAlign:'right',
focusNodeAdjacency: "allEdges",
data: itemStyleSource,
links: [
@@ -393,7 +397,7 @@ const drawEnergyFlow = () => {
fontSize: 14,
formatter: function (params) {
- if (params.dataIndex == 0) {
+ if (params.dataIndex === 0) {
return (
"{a|" +
params.data.name +
@@ -450,6 +454,166 @@ const drawEnergyFlow = () => {
};
myChart.setOption(option)
}
+
+// 电费电价
+const drawElectricityPrice = () => {
+ let myChart = echarts.init(document.getElementById('electricity-price'))
+ let option = {
+ tooltip: {
+ trigger: 'axis',
+ backgroundColor: "rgba(1, 13, 19, 0.5)",
+ borderWidth: 0,
+ axisPointer: { // 坐标轴指示器，坐标轴触发有效
+ type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
+ },
+ textStyle: {
+ color: "rgba(212, 232, 254, 1)",
+ // fontSize: fontChart(0.24),
+ },
+ confine: true
+ },
+ legend: {
+ show: true,
+ data:['电费','销售电价'],
+ selected:{
+ '电费': true,
+ '销售电价': true,
+ },
+ icon: 'rect',
+ itemGap:14,
+ top:"8",
+ layout: 'vertical',
+ itemHeight: '10',
+ // itemWidth:'10',
+ textStyle: {
+ color: "rgba(221, 255, 253, 1)"
+ }
+ },
+ grid: {
+ top: "20%",
+ left: "4%",
+ right: "4%",
+ bottom: "4%",
+ containLabel: true,
+ },
+
+ xAxis: {
+ type: 'category',
+ data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月'],
+ axisLine: {
+ show: true,
+ lineStyle: {
+ color: '#557775'
+ }
+ },
+ axisTick: {
+ show: false,
+ },
+ axisLabel: {
+ // interval: 0,
+ // rotate: 40,
+
+ show: true,
+ textStyle: {
+ fontFamily: 'Microsoft YaHei',
+ color: "#DDFFFD",
+ }
+ },
+ },
+
+ yAxis: [{
+ name: '单位:kWh',
+ nameTextStyle: {
+ color: "rgba(221, 255, 253, 1)",
+ padding: [0, 0, 0, 10]
+ },
+ // 表现为上下位置
+ type: 'value',
+ max: '50',
+ splitNumber: 5,
+ axisLine: {
+ show: false,
+ lineStyle: {
+ color: '#666666',
+ }
+ },
+ splitLine: {
+ show: false
+ },
+ axisLabel: {
+ textStyle: {
+ fontFamily: 'Microsoft YaHei',
+ color: "#DDFFFD",
+ fontSize: 12
+ }
+ }
+ },
+ {
+ // splitNumber:
+ name: '单位:元/kWh',
+ position: 'right', // 放在右边
+ nameTextStyle: {
+ padding: [0, 15, 0, 0],
+ color: 'rgba(221, 255, 253, 1)'
+ },
+ axisLabel: {
+ show: true,
+ // fontSize: 18,
+ color: 'rgba(221, 255, 253, 1)',
+ formatter: function (value) {
+ // 在标签后面添加百分号
+ return value.toFixed(1);
+ },
+ },
+ axisLine: {
+ show: false,
+ },
+ axisTick: {
+ show: false,
+ },
+ splitLine: {
+ show: true,
+ lineStyle: {
+ type: "dashed",
+ color: "rgba(1, 39, 37, 0.30)",
+
+ // color: '#eff6ff'
+ }
+ },
+ },
+ ],
+ series: [{
+ name: '电费',
+ type: 'bar',
+ barWidth: '15',
+ itemStyle: {
+ normal: {
+ color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
+ offset: 0,
+ color: 'rgba(82, 217, 208, 1)'
+ }, {
+ offset: 1,
+ color: 'rgba(82, 217, 208, 0)'
+ }]),
+
+ },
+ },
+ data: [40, 35, 15, 10, 19, 24, 14]
+ },
+ {
+ name: '销售电价',
+ type: 'line',
+ yAxisIndex: 1, // 与第二个 y 轴关联
+ itemStyle: {
+ color: 'rgba(1, 246, 139, 1)', // 设置折线颜色为黄色
+ },
+ symbol:"none",
+ data: [0.1, 0.2, 0.6, 1, 0.4, 0.8, 0.9], // 折线图的数据
+ },
+ ]
+ };
+ myChart.setOption(option)
+}
// dom加载
onMounted(() => {
// 能耗总量
@@ -458,6 +622,8 @@ onMounted(() => {
drawManagement()
// 能效流向
drawEnergyFlow()
+// 电费电价
+ drawElectricityPrice()
})
@@ -510,12 +676,13 @@ onMounted(() => {