作者：MongoGoing
來源：SegmentFault 思否社群
前言
在項目中使用echarts開發圖表，經常會有幾個圖表并排展示的需求，而圖表又是需要平均配置設定空間的時候，我會首先想到flex布局，flex布局也是開發自适應網站時的首選布局方式，目前最推薦的頁面布局技巧
遇到的問題
在flex布局中，外層父div包裹了三個子div，三個子div高度需要平均，設定了子div的flex均為1使其高度平均自動配置設定，注意如果是在垂直方向上，父元素需要設定flex-direction: column;，在頁面全屏和縮小的時候，echarts的resize可能會使某一個圖表高度自适應失敗
預期的效果
分析原因
我猜測：echarts在調用resize時會重繪，如果你的子div沒有設定高度，隻是設定了flex：1；那麼會有如下場景發生：觸發三個圖表resize後，子元素高度全為0，父元素高度也為0，會導緻第一個重繪完成的圖表所在的子div高度不明确，可能會使得第一個繪制完成的圖表高度在resize後還是預設的高度
解決辦法
給每個子div設定一個預設最小高度，這個高度不能與你預期的高度差太多，可以使用百分比，如下：
父div：
子div：
- END -
