From 0ae83a895e80a4b9777a27f613d721a7e5e2ac18 Mon Sep 17 00:00:00 2001
From: ali <ali9696@163.com>
Date: 星期二, 03 九月 2024 10:18:27 +0800
Subject: [PATCH] 整体样式修改
---
energy_management_ui/src/views/stage/alarm/LinChart.vue | 84 +++++++++++++++++++++--------------------
1 files changed, 43 insertions(+), 41 deletions(-)
diff --git a/energy_management_ui/src/views/stage/alarm/LinChart.vue b/energy_management_ui/src/views/stage/alarm/LinChart.vue
index ba88800..06ebe8f 100644
--- a/energy_management_ui/src/views/stage/alarm/LinChart.vue
+++ b/energy_management_ui/src/views/stage/alarm/LinChart.vue
@@ -1,26 +1,26 @@
<template>
- <div :class="className" :style="{height:height,width:width}" />
+ <div :class="className" :style="{ height: height, width: width }" />
</template>
<script>
-import echarts from 'echarts'
-require('echarts/theme/macarons') // echarts theme
+import echarts from "echarts";
+require("echarts/theme/macarons"); // echarts theme
/*import resize from './mixins/resize'*/
export default {
- /* mixins: [resize],*/
+ /* mixins: [resize],*/
props: {
className: {
type: String,
- default: 'chart'
+ default: "chart"
},
width: {
type: String,
- default: '100%'
+ default: "100%"
},
height: {
type: String,
- default: '350px'
+ default: "350px"
},
autoResize: {
type: Boolean,
@@ -34,49 +34,51 @@
data() {
return {
chart: null
- }
+ };
},
watch: {
chartData: {
deep: true,
handler(val) {
- this.setOptions(val)
+ this.setOptions(val);
}
}
},
mounted() {
this.$nextTick(() => {
- this.initChart()
- })
+ this.initChart();
+ });
},
beforeDestroy() {
if (!this.chart) {
- return
+ return;
}
- this.chart.dispose()
- this.chart = null
+ this.chart.dispose();
+ this.chart = null;
},
methods: {
initChart() {
- this.chart = echarts.init(this.$el, 'macarons')
- this.setOptions(this.chartData)
+ this.chart = echarts.init(this.$el, "macarons");
+ this.setOptions(this.chartData);
},
setOptions({ expectedData, actualData } = {}) {
this.chart.setOption({
-
title: {
- text: '鍏宠仈鐐逛綅鑳借��(鍗曚綅: Kwh)'
+ text: "鍏宠仈鐐逛綅鑳借��(鍗曚綅: Kwh)"
},
tooltip: {
- trigger: 'axis'
+ trigger: "axis"
},
legend: {
- data: ['FT01', 'FT02' , 'FT03' , 'FT04']
+ data: ["FT01", "FT02", "FT03", "FT04"],
+ textStyle: {
+ color: "#fff"
+ }
},
grid: {
- left: '3%',
- right: '4%',
- bottom: '3%',
+ left: "3%",
+ right: "4%",
+ bottom: "3%",
containLabel: true
},
toolbox: {
@@ -85,41 +87,41 @@
}
},
xAxis: {
- type: 'category',
+ type: "category",
boundaryGap: false,
- data: ['2鏈�1鏃�', '2鏈�2鏃�', '2鏈�3鏃�', '2鏈�4鏃�']
+ data: ["2鏈�1鏃�", "2鏈�2鏃�", "2鏈�3鏃�", "2鏈�4鏃�"]
},
yAxis: {
- type: 'value'
+ type: "value"
},
series: [
{
- name: 'FT01',
- type: 'line',
- stack: '鎬婚噺',
+ name: "FT01",
+ type: "line",
+ stack: "鎬婚噺",
data: [210, 172, 181, 224]
},
{
- name: 'FT02',
- type: 'line',
- stack: '鎬婚噺',
+ name: "FT02",
+ type: "line",
+ stack: "鎬婚噺",
data: [210, 182, 191, 234]
},
{
- name: 'FT03',
- type: 'line',
- stack: '鎬婚噺',
+ name: "FT03",
+ type: "line",
+ stack: "鎬婚噺",
data: [210, 182, 191, 234]
},
{
- name: 'FT04',
- type: 'line',
- stack: '鎬婚噺',
+ name: "FT04",
+ type: "line",
+ stack: "鎬婚噺",
data: [210, 182, 191, 234, 290]
- },
+ }
]
- })
+ });
}
}
-}
+};
</script>
--
Gitblit v1.9.3