From 9c803f20cc05395bac2d3386accfe230210c07dc Mon Sep 17 00:00:00 2001 From: Surpriseplus <845948745@qq.com> Date: 星期一, 19 十二月 2022 20:58:31 +0800 Subject: [PATCH] 1 --- src/components/echart34.vue | 57 ++++++++++++++++++++++++++++++--------------------------- 1 files changed, 30 insertions(+), 27 deletions(-) diff --git a/src/components/echart34.vue b/src/components/echart34.vue index bdcb374..91cccb7 100644 --- a/src/components/echart34.vue +++ b/src/components/echart34.vue @@ -10,49 +10,52 @@ components: {}, data() { //杩欓噷瀛樻斁鏁版嵁 - return {}; + return { myChart }; }, mounted() { this.lineChart(); + this.$bus.$on('resizeEchart', (res) => { + this.myChart.resize(); + }); }, //鏂规硶闆嗗悎 methods: { lineChart() { let option = { title: { - text: "椤圭洰杩涘害瀹屾垚鐧惧垎姣�", + text: '椤圭洰杩涘害瀹屾垚鐧惧垎姣�', textStyle: { - color: "#fff", + color: '#fff', }, }, grid: { - left: "0%", - right: "0%", - bottom: "0%", + left: '0%', + right: '0%', + bottom: '0%', containLabel: true, }, xAxis: { - type: "category", + type: 'category', data: [ - "涓縿涓滅嚎绠¢亾宸ョ▼鍗楁", - "涓縿涓滅嚎绠¢亾宸ョ▼涓", - "骞垮窞绔�", - "鍞愬北LNG", - "鏂扮枂杩炴湪娌佺珯鍦�", - "涓紖澶╃劧姘旂閬撻闄╂帓鏌ヨ埅绌烘憚褰辨祴閲�", + '涓縿涓滅嚎绠¢亾宸ョ▼鍗楁', + '涓縿涓滅嚎绠¢亾宸ョ▼涓', + '骞垮窞绔�', + '鍞愬北LNG', + '鏂扮枂杩炴湪娌佺珯鍦�', + '涓紖澶╃劧姘旂閬撻闄╂帓鏌ヨ埅绌烘憚褰辨祴閲�', ], axisLine: { lineStyle: { - color: "#ccc", + color: '#ccc', }, }, axisLabel: { show: true, textStyle: { - color: "#fff", + color: '#fff', }, formatter: function (params) { - var newParamsName = ""; // 鏈�缁堟嫾鎺ユ垚鐨勫瓧绗︿覆 + var newParamsName = ''; // 鏈�缁堟嫾鎺ユ垚鐨勫瓧绗︿覆 var paramsNameNumber = params.length; // 瀹為檯鏍囩鐨勪釜鏁� var provideNumber = 3; // 姣忚鑳芥樉绀虹殑瀛楃殑涓暟 var rowNumber = Math.ceil(paramsNameNumber / provideNumber); // 鎹㈣鐨勮瘽锛岄渶瑕佹樉绀哄嚑琛岋紝鍚戜笂鍙栨暣 @@ -63,7 +66,7 @@ if (paramsNameNumber > provideNumber) { /** 寰幆姣忎竴琛�,p琛ㄧず琛� */ for (var p = 0; p < rowNumber; p++) { - var tempStr = ""; // 琛ㄧず姣忎竴娆℃埅鍙栫殑瀛楃涓� + var tempStr = ''; // 琛ㄧず姣忎竴娆℃埅鍙栫殑瀛楃涓� var start = p * provideNumber; // 寮�濮嬫埅鍙栫殑浣嶇疆 var end = start + provideNumber; // 缁撴潫鎴彇鐨勪綅缃� // 姝ゅ鐗规畩澶勭悊鏈�鍚庝竴琛岀殑绱㈠紩鍊� @@ -72,7 +75,7 @@ tempStr = params.substring(start, paramsNameNumber); } else { // 姣忎竴娆℃嫾鎺ュ瓧绗︿覆骞舵崲琛� - tempStr = params.substring(start, end) + "\n"; + tempStr = params.substring(start, end) + '\n'; } newParamsName += tempStr; // 鏈�缁堟嫾鎴愮殑瀛楃涓� } @@ -86,35 +89,35 @@ }, }, yAxis: { - type: "value", + type: 'value', axisLine: { lineStyle: { - color: "#ccc", + color: '#ccc', }, }, axisLabel: { show: true, textStyle: { - color: "#fff", + color: '#fff', }, }, }, series: [ { data: [0.4, 0.2, 0.7, 0.65, 0.5, 0.1], - type: "bar", + type: 'bar', showBackground: true, barWidth: 20, backgroundStyle: { - color: "rgba(180, 180, 180, 0.2)", + color: 'rgba(180, 180, 180, 0.2)', }, }, ], }; - let myChart = this.$echarts.init(document.getElementById("echart34")); - myChart.setOption(option); - window.addEventListener("resize", function () { - myChart.resize(); + this.myChart = this.$echarts.init(document.getElementById('echart34')); + this.myChart.setOption(option); + window.addEventListener('resize', function () { + this.myChart.resize(); }); }, }, -- Gitblit v1.9.3