隐藏选项卡内的绘图,宽度= 0,高度= 400的尺寸无效

当我在隐藏标签中插入图表时,如第二,第三等,我有这个错误。这里是错误:

Invalid dimensions for plot, width = 0, height = 400 in js/jquery.flot.min.js:6. 

我使用了bootstrap 2和jquery:

  

这是图书馆:

     

和CSS:

 #plotarea { max-width: none; height: 400px; } #pie { max-width: none; height: 400px; } #barmonth { max-width: none; height: 400px; } #baryear { max-width: none; height: 400px; } 

带有每个图表id的div(总是将id更改为我需要显示的图表,如plotarea,pie,barmonth,baryear等):

 

我添加这种样式来修复宽度错误.ui-tabs .ui-tabs-hide { left: -10000px; visibility: hidden !important; } .ui-tabs .ui-tabs-hide { left: -10000px; visibility: hidden !important; } .ui-tabs .ui-tabs-hide { left: -10000px; visibility: hidden !important; } ,但即使这样,图表也不会在这些隐藏的标签内绘制图表,只绘制第一个视图中的第一个标签…如果有一个表单可以修复它,你现在可以吗?

我使用魅力模板。

最好的祝福!

好吧,我已经做到了!

如果你有这个库 ,你只需要在styles.css(样式表文件)中更改它:

 max-width: none; height: 400px; 

有了这个:

 width: 100%; height: 400px; 

现在,图表总是在每个屏幕中resize。

我遇到过同样的问题。 一个不同的解决方案对我有用。

  • 确保设置高度和宽度
  • 确保flot没有找到一些不存在的div。 这是因为我从有三个图的页面复制它,而我使用了第一个和第三个。 我可以通过使用chrome的控制台找到它(它在找不到页面中的第二个div后崩溃了。因此第三个没有被绘制。只需注释掉js中未使用的绘图并且它工作正常)

我在IE8下有同样的问题,有时Android,我的图表最初隐藏了切换function,导致错误尝试在隐藏的div中绘制图表。 CSS已经定义,所以没有帮助。

在绘制div元素解决问题之后移动jQuery隐藏和切换代码。