echarts折线图加载后显示空白,浏览器改变大小后才能显示出来
![在这里插入图片描述](https://i-blog.csdnimg.cn/blog_migrate/8d5061f7a42e7277c64537284bd3cebb.png)
第一次加载失败
原因是:echarts在默认隐藏的div中显示空白,有时候图表会放在多个标签页(tab)里,那些初始隐藏的标签在初始化图表的时候因为获取不到容器的实际高宽,可能会绘制失败(不显示图表、图表的高度为0或者宽度为0),解决办法是在echarts渲染之前先设置div的宽高,然后再调用echarts的setOption配置项和数据显示图表。
解决:需要手动设置一个宽高,在它初始化之前
即:![在这里插入图片描述](https://i-blog.csdnimg.cn/blog_migrate/c0f16b4761b05ed0679bd0c072ee2bdc.png)
使用内联样式 手动增加一个宽度
效果图:
![在这里插入图片描述](https://i-blog.csdnimg.cn/blog_migrate/5ef6f534fd331aa3d3ac5284ac0bdf89.png)