From eeef5d4039d2b3fee6854ddc2789aa23232b2cfb Mon Sep 17 00:00:00 2001
From: zmc <zmc_li@foxmail.com>
Date: 星期三, 27 九月 2023 17:24:10 +0800
Subject: [PATCH] 登陆页换了背景，加了风险排名
---
src/views/line_graph/components/LineChart.vue | 53 +++++++++++++++++++++++------------------------------
1 files changed, 23 insertions(+), 30 deletions(-)
diff --git a/src/views/line_graph/components/LineChart.vue b/src/views/line_graph/components/LineChart.vue
index 17021bd..e509576 100644
--- a/src/views/line_graph/components/LineChart.vue
+++ b/src/views/line_graph/components/LineChart.vue
@@ -3,11 +3,11 @@
浣跨敤鍚屼竴涓浘褰㈠疄渚嬶紝鎺ュ彈鐖剁粍浠朵紶鍏ョ殑鎶樼嚎鍥緊ption
-->
<template>
- <div ref="chart" class="line-chart"></div>
+ <div ref="chart" class="line-chart11"></div>
</template>
<script>
-import * as _echarts from 'echarts';
+import * as _echarts from 'echarts'
export default {
props: {
@@ -18,7 +18,7 @@
return {
x: [],
y: []
- };
+ }
}
},
title: {
@@ -40,28 +40,23 @@
data() {
return {
chart: null
- };
+ }
},
mounted() {
- this.intiChart();
- window.addEventListener('resize', this.resizeChart);
+ this.intiChart()
+ window.addEventListener('resize', this.resizeChart)
},
watch: {
chartData() {
// option鍙樺寲鏃讹紝鍥惧舰鍐嶆鍒濆鍖�
- this.setOption();
- },
-
- },
- beforeUnmount() {
- if (this.chart) {
- this.chart.dispose();
+ this.setOption()
}
},
+
methods: {
intiChart() {
// 鍒涘缓echarts瀹炰緥
- this.chart = _echarts.init(this.$refs.chart);
+ this.chart = _echarts.init(this.$refs.chart)
},
setOption() {
@@ -88,11 +83,11 @@
name: this.xName,
data: this.chartData.x,
type: 'category',
- axisLabel: {
- formatter: function (value) {
- return value.slice(5);
- }
+ axisLabel: {
+ formatter: function (value) {
+ return value.slice(5)
}
+ }
},
yAxis: {
type: 'value',
@@ -109,27 +104,25 @@
data: this.chartData.y
}
]
- };
- this.chart.setOption(option);
+ }
+ this.chart.setOption(option)
},
// 璺熼〉闈㈠搷搴斿紡鍙樺寲
resizeChart() {
- // this.chart.resize();
- this.$nextTick(() => {
- if (this.chart) {
- this.chart.resize();
- }
- });
+ setTimeout(() => {
+ this.chart.resize()
+ }, 1000)
}
}
-};
+}
</script>
<style>
-.line-chart {
- width: 100%;
- height: 35vh;
+.line-chart11 {
+ width: 600px;
+ height: 300px;
margin-top: 25px;
+ margin-left: 30px;
}
</style>
--
Gitblit v1.9.3