mui 折叠面板展示echart 图片问题

在实现app端数据展示时，需要在折叠面板展示echart图表，在实现过程中发现，除非页面初始化完成时，面板默认打开（mui-active）才可以加载正确图表，否则的话，图表样式就会乱掉。
从网上查询到可以将图表初始化的div放到外面，实际操作过程中发现，的确可以，但是折叠面板失效。
自己尝试发现如下方法可以实现，在页面初始化时，通过js进行width设置。代码如下：

经营分析 近四年纳税情况 近四年负税情况

				<li onchange="" class="mui-table-view-cell mui-collapse   ">
					<a class="mui-navigate-right" href="#">整体入库</a>
					
					 <div class="mui-collapse-content">
		            	<a style="padding-left: 27%;">近四年整体入库情况</a>
		            	<div style="height: 200px;margin: 0px;" id="barChart2"></div>
		            	
		            </div>
				</li>



		
		var option = {
		    tooltip: {
		        trigger: 'axis',
		        axisPointer: {
		            type: 'cross',
		            crossStyle: {
		                color: '#999'
		            }
		        }
		    },
		   
		    legend: {
		        data:['营业收入','营业成本','营业利润','利润率']
		    },
		    xAxis: [
		        {
		            type: 'category',
		            data: ['2015年','2016年','2017年','2018年'],
		            axisPointer: {
		                type: 'shadow'
		            }
		        }
		    ],
		    yAxis: [
		    	{
		            type: 'value',
		            name: '金额',
		            min: 0,
		            max: 300,
		            interval: 5,
		            axisLabel: {
		                formatter: '{value} 万元'
		            }
		        },
		        {
		            type: 'value',
		            name: '百分比',
		            min: 0,
		            max: 100,
		            interval: 50,
		            axisLabel: {
		                formatter: '{value} %'
		            }
		        }
		        
		    ],
		    series: [
		        {
		            name:'营业收入',
		            type:'bar',
		            data:[30, 130, 240, 200]
		        },
		        {
		            name:'营业成本',
		            type:'bar',
		            data:[23, 100, 180, 150]
		        },
		        {
		            name:'营业利润',
		            type:'bar',
		            data:[7, 30, 60, 50]
		        },
		        {
		            name:'利润率',
		            type:'line',
		            yAxisIndex: 1,
		            data:[12.0, 22.2, 15.3, 14.5]
		        }
		    ]
		};
	/**  在此处进行，宽度设置                         */
	var byId = function(id) {

			var domInit = $('#' + id);

			domInit.width($(window).width() * 0.9);
			
			var width = domInit.width();
			var height = domInit.height();
			
			
			return document.getElementById(id);
		};
	
		var barChart = echarts.init(byId('barChart'));
		barChart.setOption(option);	
		
		
		var option1 = {
	    tooltip: {
	        trigger: 'axis',
	        axisPointer: {
	            type: 'cross',
	            crossStyle: {
	                color: '#999'
	            }
	        }
	    },
	   
	    legend: {
	        data:['税负','行业平均税负']
	    },
	    xAxis: [
	        {
	            type: 'category',
	            data: ['2015年','2016年','2017年','2018年'],
	            axisPointer: {
	                type: 'shadow'
	            }
	        }
	    ],
	    yAxis: [
	    	{
	            type: 'value',
	            name: '百分比',
	            min: 0,
	            max: 7,
	            interval: 5,
	            axisLabel: {
	                formatter: '{value} %'
	            }
	        }
	        
	    ],
	    series: [
	        {
	            name:'税负',
	            type:'bar',
	            data:[3.0, 3.5, 3.7, 3.0]
	        },
	        {
	            name:'行业平均税负',
	            type:'bar',
	            data:[3.5, 3.6, 4.0, 3.7]
	        }
	    ]
		};

		var barChart1 = echarts.init(byId('barChart1'));
		barChart1.setOption(option1);	
		
		
		
		var option2 = {
		    tooltip: {
		        trigger: 'axis',
		        axisPointer: {
		            type: 'cross',
		            crossStyle: {
		                color: '#999'
		            }
		        }
		    },
		   
		    legend: {
		        data:['1入库税额','2入库费额','3入库税额']
		    },
		    xAxis: [
		        {
		            type: 'category',
		            data: ['2015年','2016年','2017年','2018年'],
		            axisPointer: {
		                type: 'shadow'
		            }
		        }
		    ],
		    yAxis: [
		    	{
		            type: 'value',
		            name: '金额',
		            min: -1000,
		            max: 5000,
		            interval: 5,
		            axisLabel: {
		                formatter: '{value} 万元'
		            }
		        }
		        
		    ],
		    series: [
		        {
		            name:'1入库税额',
		            type:'bar',
		            data:[3000, 3300, 3900, 4200]
		        },
		        {
		            name:'2入库费额',
		            type:'bar',
		            data:[2300, 2700, 3400, 3800]
		        },
		        {
		            name:'3入库税额',
		            type:'bar',
		            data:[700, 1300, 1600, 2050]
		        }
		    ]
		};
		
		var barChart2 = echarts.init(byId('barChart2'));
		barChart2.setOption(option2);