前端--echarts--使用tab时 echarts图表无法正常加载（无法正常显示）

项目里图表高度设置了固定的360px。

从网上查的好多结果，都说是因为 第二个tab的宽度 没有设置 或者设置为0或者 设置的值很小，导致的第二个tab里的图表无法显示出来。

项目中使用到了Echarts来在展示图表，两个tab切换页面中都存在图表，页面加载完成后

对所有图表进行了初始化和绘制，然后切换查看时，发现图表的宽度不正确.，第一个tab显示是很正常的，但是第二个tab中内容显示不出来。

第一个tab ：图表1 （当前负荷）
第二个tab ：图表2 （当前电量）

原因：因为页面加载时， 第二个tab ：图表2 （当前电量）因为是隐藏图表所以没有给 设置具体的宽度，所以不能显示，而第一个tab ：图表1 （当前负荷）有具体的宽度，所以可以正常显示，，，，，，，，，，，，，，，，，，，，，，在页面进行加载时，隐藏的图表找不到对应的div大小，所以默认给了一个大小。而这个默认宽度很小，所以导致echarts图表显示不完全。

。
。
。

解决办法：在所有图表加载之前，重新设置 图表div的宽度和高度，就可以了，因为第一个tab里的图表1可以正常显示，那么就获取图表1的宽度，赋值给 图表2的宽度，，，，，，，我这里 图表1当前负荷 的宽度 不是固定的，是使用的bootstrap前端框架的 ，只有页面加载完，才可以知道 图表1div的具体宽度 （所有图表高度固定 360px），页面加载完得到 图表1div高度， 然后在 修改 图表2当前电量 div 宽度==图表1div宽度。

下面是主要的 html 代码，，其他用不到

<div class="tabs-container">
      <ul class="nav nav-tabs">
          <li><a class="nav-link active" data-toggle="tab" href="#tab-1" οnclick="tab_method('1');return false;">当前负荷</a></li>
          <li><a class="nav-link" data-toggle="tab" href="#tab-2" οnclick="tab_method('2');return false;">当前电量</a></li>
          <li><a class="nav-link" data-toggle="tab" href="#tab-3" οnclick="tab_method('3')