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

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

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

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

  

  上图所示,咱们能够利用bootstrap模态框的回调函数等模态框彻底打开再去从新渲染图表dom

  echarts官网API也为咱们提供了从新渲染图表的resize方法,这样咱们就能够结合bootstrap模态框的回调函数根据新的尺寸从新渲染函数

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

这样就能够再模态框下显示出来了。spa

若是你是另外一种html渲染的echarts图表,请参考https://www.cnblogs.com/roc-young/p/6949883.html;code

相关文章
相关标签/搜索