Highcharts + Bootstrap.表格响应问题

Question

当我把我的图表放在Bootstrap中时.table-responsive,图表并没有填满整个图表td.这是问题的一个问题.正如您可能看到的,我将宽度设置为100%,这在网格中起作用.

似乎还有一个奇怪的错误,当我用"Inspect element"打开chrome控制台时,问题就解决了(发生在jsFiddle中).

如何在<td>默认情况下使图表填满整个图表？

Answer 1

width初始化后,您必须设置图表的设置.初始化后,Highcharts只适应resize事件(试一试,如果你调整窗口大小,它会改变宽度),所以你可能想要触发resize事件.

这是一个使用resize事件的jsFiddle(ab):http://jsfiddle.net/b9DMn/1/

Highcharts会在创建其图表时自动获取其容器的宽度,但如果您在其中放置断点,您将看到表格单元格在该时间点仍然平均分配.事实上,正是图表触发了表格来扩展正确的单元格.如果你可以固定单元格宽度,那可能也会有所帮助.

这是一个固定单元格宽度的jsFiddle,因此当添加内容时它们不会增长和缩小:http://jsfiddle.net/b9DMn/2/