栅格系统使用echarts时,如何实现echarts外部元素的高度自适应?

我使用栅格系统做了布局,然后在el-col里写div结构,div作为echarts的容器。现在要做div的高度自适应浏览器窗口大小。可是众所周知栅格系统的高度是由内容撑开的,我直接给div的高写百分比来做自适应,echarts的高度就是0。div高度写固定px值或者vh又不是自适应。这就触及到我的知识盲区了。
我现在的页面div高度用了vh,一个浏览器有或没有书签栏就会导致多个echarts的div对不齐了,更别提它们的高度自适应了。
现在这个难点对我来说就像矛盾了,栅格由内容高度撑开,高度自适应使用百分比又依赖外层容器的高度。直接给div百分比,高度就是0,图表不显示。真难搞啊。
请大家赐教

echarts渲染之前先用js调整div的高度

高度百分比一定是基于一个值的百分比,栅格盒子也需要高度 像素或者百分比