echart界面缩放问题解决

echart缩放样式

:style="{ zoom: screenWidth < 1920 ? screenWidth/1920 : 1}"

echart缩放调整

this.screenWidth = document.body.clientWidth; if( document.body.clientWidth < 1920){         this.echartsZoomFix() }

echart缩放方法

// echart listId [图表Id]   isZoom/是否缩放  true/缩放  false/重置 echartsZoomFix(listId,isZoom) {     // let strip = document.getELementsById("")[0];     let domId = listId     let fixDom = [];     //响应式处理     this.screenWidth = document.body.clientWidth;     let zoom = this.screenWidth / 1920;     let proportion = 1 / zoom;     domId.forEach((item) => {         if(document.getElementById(item) && document.getElementById(item).children){             fixDom.push(document.getElementById(item).children[0])         }     });     // 进行缩放     if(isZoom){         fixDom.forEach((item) => {             item.style.zoom = proportion;             item.style.transform = 'scale(' + zoom + ')';             item.style.transformOrigin = '0% 0%';             item.style.width = proportion * 100 + '%';             item.style.height = proportion * 100 + '%';         });     }else{         // 清空缩放         fixDom.forEach((item) => {             item.style.zoom = '';             item.style.transform = '';             item.style.transformOrigin = '';             item.style.width =  100 + '%';             item.style.height =  100 + '%';         });     } },