关于echarts:echarts的自适应问题窗口自适应侧边栏自适应eltab中的自适应

一、echart的图表提供了一个resize函数，当resize函数被触发时，图表会进行重绘。
二、罕用的浏览器，窗口自适应。
(1) 将搁置图表的容器div的宽设置为100%，不固定写死，height能够依据需要设置为vh或者px都行。

<div id="hh" style="width:100%;height:400px;"/>

(2) 对浏览器窗口大小进行监听

window.addEventListener('resize',function(){
   this.mychart.resize()        //当浏览器窗口大小发生变化时，图表能够进行自适应

})
三、侧边栏收起或者关上导致的搁置图表的容器div
利用vuex依据侧边栏的收起或者关上触发echart的resize办法

"$store.state.app.sidebar.opened"(){
  setTimeout(()=>{
    this.myChart.resize()
  },300)
}

四、el-tab切换时图表自适应宽度会变成100px压缩不自适应。
起因是el-tab的时候，其余不显示的tab下的div此时的display为none，在点击tab切换时候，div还未渲染实现，图表在执行js初始化的时候找不到这个元素，所以主动将”100%”转成了”100″，最初计算出来的图表就成了100px。
1、解决办法:

<div id="hh" style="width:100%;height:400px;" v-if="activeName==='hh'"/>

2、解决办法:

<div id="hh" style="width:100%;height:400px;" :lazy='true'/>