分类： Bootstrap

在使用echarts的时候发现echarts的宽度变成了100px，明明设置的是100%,一般出现这种情况是在tab切换或者bootstrap的模态框里面，原因是当tab或者modal在隐藏的时候，无法获取到他的宽度值，echarts默认100px的宽度，我用的是bootstrap的modal,解决办法：

第一步、使用modal的shown.bs.modal方法获取弹出框的宽度。

官方文档：当模态框对用户来说可见时（需要等待CSS过渡完成），会触发该事件。如果是由点击引起的，被点击的元素是可用的，成为Event对象的relatedTarget属性。

第二步、使用echarts的resize方法，重新设置大小。

 $('#tree').on('shown.bs.modal', function () {
        myChart.resize({ width: $("#echarts").width(), height: 500 });
    })