解决echarts图表在tab选项卡里宽度100%变成100px

使用element的el-tab-pane组件，切换到第二个组件的时候，底下的echars图宽度显示为100px，如下图

打开控制台发现已经默认成了100px。

导致这样的原因是因为：我的图表在tab选项卡里，因为热力图一开始是display：none；在一开始初始化执行js的时候找不到这个元素，所以会出现问题。
解决方法：在echarts初始化之前先用js获取当前屏幕的大小，然后再给他设置宽度就可以了。
代码如下：

  <div 
    id="frequencyChart" 
    :style="{width: 'chartWidth',height:'300px'}" 
    class="history-chart" />

    document.getElementById('frequencyChart').style.width =
      (window.innerWidth / 5) * 4 + 'px';// 宽度自定义
    this.chartMeteo = echarts.init(document.getElementById('frequencyChart'));
    ...
    this.chartMeteo.setOption(option);

效果图：