From 39913b145347f509a1137a398f9803fca7e4f4b8 Mon Sep 17 00:00:00 2001 From: ZhangXianQiang <1135831638@qq.com> Date: 星期四, 29 二月 2024 14:00:13 +0800 Subject: [PATCH] fix:修改线段图表 --- src/views/daoAnOffice/right/analysis/index.vue | 30 +++++++++++++++++++++++------- 1 files changed, 23 insertions(+), 7 deletions(-) diff --git a/src/views/daoAnOffice/right/analysis/index.vue b/src/views/daoAnOffice/right/analysis/index.vue index 2b282f2..555f47b 100644 --- a/src/views/daoAnOffice/right/analysis/index.vue +++ b/src/views/daoAnOffice/right/analysis/index.vue @@ -11,7 +11,6 @@ <template #content> <div class="charts-container"> <div id="analysisChart" ref="analysisChart"></div> - </div> </template> </RightTitle> @@ -21,7 +20,12 @@ import RightTitle from "@/components/right-title"; import * as echarts from 'echarts'; import { ref, onMounted } from 'vue'; + +// dom绀轰緥 const analysisChart = ref(null); +const echartRef = ref(null); + + const selectItems = ref([ { itemIndex: 1, name: '鏃堕棿缁熻', isActive: false }, { itemIndex: 2, name: '琛楅亾缁熻', isActive: true }, @@ -39,8 +43,18 @@ { name: '鐏屽彛琛楅亾', state1: 972, state2: 2124, state3: 1500 }, ]); +const testData1 = ref([ + { name: '閮芥睙鍫板競', state: { '2023-1': 1000, '2023-2': 2000, '2023-3': 1233 }, state2: { '2023-1': 12312, '2023-2': 23123, '2023-3': 2111 } }, + { name: '閮芥睙鍫板競', state: { '2023-1': 1000, '2023-2': 2000, '2023-3': 1233 }, state2: { '2023-1': 12312, '2023-2': 23123, '2023-3': 2111 } }, + { name: '閮芥睙鍫板競', state: { '2023-1': 1000, '2023-2': 2000, '2023-3': 1233 }, state2: { '2023-1': 12312, '2023-2': 23123, '2023-3': 2111 } }, + { name: '閮芥睙鍫板競', state: { '2023-1': 1000, '2023-2': 2000, '2023-3': 1233 }, state2: { '2023-1': 12312, '2023-2': 23123, '2023-3': 2111 } }, + { name: '閮芥睙鍫板競', state: { '2023-1': 1000, '2023-2': 2000, '2023-3': 1233 }, state2: { '2023-1': 12312, '2023-2': 23123, '2023-3': 2111 } }, + { name: '閮芥睙鍫板競', state: { '2023-1': 1000, '2023-2': 2000, '2023-3': 1233 }, state2: { '2023-1': 12312, '2023-2': 23123, '2023-3': 2111 } }, +]); -const echartsConfig = { + +// 鍦嗘煴鍥捐〃 +const barConfig = ref({ legend: { right: '0', icon: 'circle', @@ -83,8 +97,6 @@ }, xAxis: { type: 'category', axisTick: false }, yAxis: {}, - // Declare several bar series, each will be mapped - // to a column of dataset.source by default. series: [ { type: 'bar', @@ -153,13 +165,17 @@ }, }, ] -} +}); + +// line閰嶇疆 +const lineConfig = ref({}) +// let acitveData = ref(testData1.values[0]); onMounted(() => { - const myChart = echarts.init(analysisChart.value); - myChart.setOption(echartsConfig); + echartRef.value = echarts.init(analysisChart.value); + echartRef.value.setOption(barConfig.value); }) </script> -- Gitblit v1.8.0