不知道大家在用echarts的時候有沒有遇到這種情況：最開始盛放圖表的容器是隱藏（或者tab切換）的，然後再顯示的時候，裡面echarts圖表就沒用初始大小了。比如我遇到的這種：

有童鞋這會兒估計看出原因了：因為元素最初隱藏，再顯示之後沒有自動變化寬度，所以echarts圖表沒有初始寬高，官方文件的說法：

請注意：這個寬度在一些情況下設定 百分比 是沒有作用的，所以得設定為具體數字或者用js賦值，類似這種：

$('main').style.width = (document.body.clientWidth-300)*0.6+'px';

P.S：這裡沒說高度是因為如果不給容器固定高度，圖表是完成不顯示的（高度為0的容器肯定不會顯示哦）

那麼如果想設定echart圖表隨視窗的縮放變化呢？以下兩種寫法都可以：

第一種：

window.onresize = myChart.resize;
// .resize後不用加括號哦，一般如果window resize的時候不設定其他，可以這樣寫

第二種：

window.onresize = function () {
       this.myChart.resize();
       // .resize後加括號哦，這裡還可以寫其他的事件
};

echarts官方文件寫的很詳細哦，需要的童鞋自己去翻閱。希望本文對你有所幫助！

最後，歡迎關注有趣的（輕幽默、小雞湯）個人微信公眾號