angularJs解决模态框下echarts不显示问题

例如：摸态框myModal.html,给它命名一个id，id='myModal';

　　myModal.html页面想画一个echarts图表

　　这里是angularJs已经封装好的echarts在html中的写法：<div id="box" data-echarts data-options="pie.option" style="width:250px;height: 100px;"></div>

　　

　　上图所示，我们可以利用bootstrap模态框的回调函数等模态框完全打开再去重新渲染图表

　　echarts官网API也为我们提供了重新渲染图表的resize方法，这样我们就可以结合bootstrap模态框的回调函数根据新的尺寸重新渲染

var box=$('#box');//图表所在的dom结构
$('#myModal').on('shown.bs.modal',function(){
    box.resize()   //重绘
})；

这样就可以再模态框下显示出来了。

如果你是另一种html渲染的echarts图表，请参考https://www.cnblogs.com/roc-young/p/6949883.html；

 

转载于:https://www.cnblogs.com/shixy1617/p/9402799.html