echarts插件——关于echarts在默认隐藏的div中不显示的问题

相信很多实用echarts插件的朋友都会遇到这样的问题，echarts图表在其他的div中可以正常显示，但在一个初始时默认隐藏的div中却显示为空白。
这是因为ECharts 没有获取到div的高宽而导致初始化失败，这时候可以：1.明确指定div的style.width和style.height 2：在div显示后手动调用 echartsInstance.resize 调整尺寸。

对于第一种方式，宽高设置为百分比是不起作用的，应设置为像素值才可以，在“行内样式、css样式表中、js中”设置宽高都是可以的。如：

<button type="button" class="btn btn-success" id="btn">点击显示图表</button>
<div style="display:none;width:500px;height:300px;" id="echarts_box"></div>

<script>
(function(){
    $("#btn").click(function({
        $("#echarts_box").css("display","block");
    });

    var option = {...}
    var myChart= echarts.init(document.getElementById('echarts_box'));
     myChart.setOption(option);
})();
</script>

上面的div元素如果不加宽高属性，则点击按钮后echarts是显示不出来的。（没有高度）
现在就可以正常显示了。