From d3d7dcf919eda40a415b6dc744fb0b347d4293a8 Mon Sep 17 00:00:00 2001
From: zmc <zmc_li@foxmail.com>
Date: 星期三, 30 八月 2023 16:10:29 +0800
Subject: [PATCH] 扬尘Vue代码
---
src/views/line_graph/components/LineChart.vue | 33 +++++++++++++++++++++------------
1 files changed, 21 insertions(+), 12 deletions(-)
diff --git a/src/sfc/LineChart.vue b/src/views/line_graph/components/LineChart.vue
similarity index 79%
rename from src/sfc/LineChart.vue
rename to src/views/line_graph/components/LineChart.vue
index 38fd58f..e1c4b89 100644
--- a/src/sfc/LineChart.vue
+++ b/src/views/line_graph/components/LineChart.vue
@@ -44,14 +44,14 @@
},
mounted() {
this.intiChart();
- // this.chart.setOption(this.chartData)
window.addEventListener('resize', this.resizeChart);
},
watch: {
chartData() {
// option鍙樺寲鏃讹紝鍥惧舰鍐嶆鍒濆鍖�
this.setOption();
- }
+ },
+
},
beforeUnmount() {
if (this.chart) {
@@ -62,9 +62,6 @@
intiChart() {
// 鍒涘缓echarts瀹炰緥
this.chart = _echarts.init(this.$refs.chart);
-
- // 浣跨敤鍒氭寚瀹氱殑閰嶇疆椤瑰拰鏁版嵁鏄剧ず鍥捐〃
- // this.chart.setOption(option, true);
},
setOption() {
@@ -78,10 +75,10 @@
toolbox: {
// 宸ュ叿鏍�
feature: {
- dataZoom: {
- // 鍖哄煙缂╂斁
- yAxisIndex: 'none'
- },
+ // dataZoom: {
+ // // 鍖哄煙缂╂斁
+ // yAxisIndex: 'none'
+ // },
// 淇濆瓨涓哄浘鐗�
saveAsImage: {}
@@ -89,7 +86,13 @@
},
xAxis: {
name: this.xName,
- data: this.chartData.x
+ data: this.chartData.x,
+ type: 'category',
+ axisLabel: {
+ formatter: function (value) {
+ return value.slice(5);
+ }
+ }
},
yAxis: {
type: 'value',
@@ -112,7 +115,13 @@
// 璺熼〉闈㈠搷搴斿紡鍙樺寲
resizeChart() {
- this.chart.resize();
+ // this.chart.resize();
+ // delay(600).then(() => this.chart.resize());
+ this.$nextTick(() => {
+ if (this.chart) {
+ this.chart.resize();
+ }
+ });
}
}
};
@@ -121,7 +130,7 @@
<style>
.line-chart {
width: 100%;
- height: 500px;
+ height: 35vh;
margin-top: 25px;
}
</style>
--
Gitblit v1.9.3