onMounted(()=>{
        nextTick(()=>{
            let chartDom = document.getElementById('echarts1');
            let myChart = echarts.init(chartDom as HTMLElement);
            option && myChart.setOption(option);
            // 根据页面大小自动响应图表大小
            window.addEventListener("resize", function () {
            myChart.resize();
            });
            myChart.on('click', chartClick);
            let firstItemIndex = 0;
            //默认柱状图第一项变色
            //第一种方法：有bug待调整
            // myChart.dispatchAction({
            //     type:'highlight',
            //     dataIndex:firstItemIndex
            // })
             //默认柱状图第一项变色
            //第二种方法：项目的click方法比较复杂，需要再研究下逻辑
            chartClick({ dataIndex: firstItemIndex });  
            function chartClick(params){
            console.log("🚀 ~ file: charts.vue:57 ~ chartClick ~ params:", params)
            // 获取序列号
            let seriesIndex = params.dataIndex;
            let series = option.series[0];
            // 柱状图点击变色
            series.itemStyle.normal = {
                color:function(params){
                    if(params.dataIndex === seriesIndex){
                        return 'blue'    
                    }else{
                        return 'red'
                    }
                                    
                }
        };


            // 更新图表
            myChart.setOption(option);
    }
        })
    })