@@ -8,20 +8,20 @@ import { numberFormat } from '@/utils/utils'
88const props = defineProps ({
99 id: {
1010 type: String ,
11- default: ' lineChartId'
11+ default: ' lineChartId' ,
1212 },
1313 width: {
1414 type: String ,
15- default: ' 100%'
15+ default: ' 100%' ,
1616 },
1717 height: {
1818 type: String ,
19- default: ' 200px'
19+ default: ' 200px' ,
2020 },
2121 option: {
2222 type: Object ,
23- required: true
24- } // option: { title , data }
23+ required: true ,
24+ }, // option: { title , data }
2525})
2626
2727const color = [' rgba(82, 133, 255, 1)' , ' rgba(255, 207, 47, 1)' ]
@@ -38,27 +38,27 @@ function initChart() {
3838 props .option ?.yData .forEach ((item : any , index : number ) => {
3939 series .push ({
4040 itemStyle: {
41- color: color [index ]
41+ color: color [index ],
4242 },
4343 areaStyle: item .area
4444 ? {
45- color: areaColor [index ]
45+ color: areaColor [index ],
4646 }
4747 : null ,
48- ... item
48+ ... item ,
4949 })
5050 })
5151 }
5252 const option = {
5353 title: {
5454 text: props .option ?.title ,
5555 textStyle: {
56- fontSize: ' 16px'
57- }
56+ fontSize: ' 16px' ,
57+ },
5858 },
5959 tooltip: {
6060 trigger: ' axis' ,
61- valueFormatter : (value : any ) => numberFormat (value )
61+ valueFormatter : (value : any ) => numberFormat (value ),
6262 // axisPointer: {
6363 // type: 'cross',
6464 // label: {
@@ -70,35 +70,35 @@ function initChart() {
7070 right: 0 ,
7171 itemWidth: 8 ,
7272 textStyle: {
73- color: ' #646A73'
73+ color: ' #646A73' ,
7474 },
75- icon: ' circle'
75+ icon: ' circle' ,
7676 },
7777 grid: {
7878 left: ' 1%' ,
7979 right: ' 1%' ,
8080 bottom: ' 0' ,
8181 top: ' 18%' ,
82- containLabel: true
82+ containLabel: true ,
8383 },
8484 xAxis: {
8585 type: ' category' ,
86- data: props .option .xData
86+ data: props .option .xData ,
8787 },
8888 yAxis: {
8989 type: ' value' ,
9090 splitLine: {
9191 lineStyle: {
92- color: ' #EFF0F1'
93- }
92+ color: ' #EFF0F1' ,
93+ },
9494 },
9595 axisLabel: {
9696 formatter : (value : any ) => {
9797 return numberFormat (value )
98- }
99- }
98+ },
99+ },
100100 },
101- series: series
101+ series: series ,
102102 }
103103
104104 // 渲染数据
@@ -117,7 +117,7 @@ watch(
117117 initChart ()
118118 })
119119 }
120- }
120+ },
121121)
122122
123123onMounted (() => {
@@ -128,7 +128,8 @@ onMounted(() => {
128128})
129129
130130onBeforeUnmount (() => {
131- echarts .getInstanceByDom (document .getElementById (props .id )! )?.dispose ()
131+ console .log (document .getElementById (props .id ))
132+ echarts ?.getInstanceByDom (document .getElementById (props .id )! )?.dispose ()
132133 window .removeEventListener (' resize' , changeChartSize )
133134})
134135 </script >
0 commit comments