echarts图表自适应，容器宽度设置为百分比，但是图表显示不全，缩到一起

<div  id="chartContainer" style="height:100%;width:100%;"></div>

chartContainer用来存放Echart图，设置宽高100%时出现Echart图没有铺满div

 需要强行设置宽高px

<div id="chartContainer" style="height:450px;width:1030px;"></div>

echarts的源码中计算宽度时：

Painter.prototype._getWidth = function() {
var root = this.root;
var stl = root.currentStyle || document.defaultView.getComputedStyle(root);
return ((root.clientWidth || parseInt(stl.width, 10)) - parseInt(stl.paddingLeft, 10) - parseInt(stl.paddingRight, 10)).toFixed(0) - 0;
};

原因在于echarts绘制图表计算宽度的时候，由于第二个tab的属性display: none;所以无法获取到clientWidth，而 parseInt(stl.width, 10)) 将width: 100%;转为100，所以计算出的图表宽度为100px

echarts图表自适应，容器宽度设置为百分比，但是图表显示不全，缩到一起

原文：https://www.cnblogs.com/nje19951205/p/12029739.html