const myChart = ref(null);const myCharts = ref(null);onMounted(() => {// 這種會導致線仍然存在 重復生成myCharts.value = echarts.init(myChart.value);myCharts.value.setOption(option);});return {myChart,myCharts,};

現象：如下圖1 點擊圖例類目2，第一次如圖2消失，第二次重復點擊類目2如圖三，線保留 ，每點一次線疊加保留，問題很大

問題在于第二次ref對象獲取echarts.init(myChart.value)，導致的上述現象，個人項目趕時間，沒找到解決問題的根本方法,試了幾種方式取巧

方法一：

onMounted(() => {// 這種可行let myChart = echarts.init(document.getElementById("mainindicator"));myChart.setOption(option);});

方法二：

// 獲取標簽容器let indexChart = ref(null);// 這種可行，不使用ref對象且setup全局使用let indexChart22 = null; const state = reactive({indexChart2: null,});onMounted(async () => {console.log('初始化圖表');// 初始化// let graphChart = echarts.init(indexChart.value);indexChart22 = echarts.init(indexChart.value);console.log(indexChart22);// option 配置項，推薦放在外部引入。indexChart22.setOption(option);window.onresize = function () {//自適應大小, 不用的話不會自適應大小。indexChart.value.resize();};});return {...toRefs(state),indexChart,};

希望有好方法的給我留個言，或者有效的鏈接

?

?

?

總結

以上是生活随笔為你收集整理的vue3 echarts5 graph关系图谱 点击图例节点消失线不消失重复生成问题的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。