echarts在默认隐藏的div中不显示的问题
简介这两天一直遇到一个问题,就是Echarts如果放在一个默认隐藏的div元素中,后面再显示这个div,但是图标不出来,找了很多博客,原来是高度没有设置。
问题:希望在点击一个按钮后显示图表,所以需要先将图表进行隐藏,但是点击显示后,图表却不显示,找了很多原因,有些说需要调用resize函数,但是没有任何作用。最终的原因是因为ECharts没有获取到div的高宽而导致初始化失败。所以只需要把div的高度设置好即可。
如:
<!--折线图-->
<Drawer title="图表"
:closable="false"
v-model="examLineEchart"
width="840">
<chart-line style="height: 300px;width:840px;"
:value="examEchartData"
ref="examLineEchartRef" />
</Drawer>