图表宽度问题

Question

我正在开展一个项目，其设计类似于fiddle中的设计。

左侧的侧面导航，带有切换选项，图表位于右侧。

正在发生的事情是图表响应性非常棒，当我调整窗口大小时它非常完美。

但是在我的项目中，我有一个切换按钮，可以切换左侧的navigation栏，但工作正常。

当我隐藏导航栏时。 div宽度变为屏幕的100％，但图表的宽度保持不变，除非我在窗口上执行一些操作，如重新调整大小。

在小提琴中，您可以找到切换侧边栏时我所面对的问题。

注意：div赋予边框以指示切换侧边栏时div的宽度。

我确实谷歌，但我一无所获。

如果任何面临同样的问题并找到任何解决方案。请帮帮我。

提前致谢。

Answer 1

您可以拨打reflow功能

http://jsfiddle.net/uBUv9/3/

http://api.highcharts.com/highcharts#Chart.reflow

Answer 2

图表似乎在窗口调整大小事件上重新绘制/调整大小，因此您可以在切换侧边栏后触发该事件。

$('#toggle-button').click(function() {
    $('body').toggleClass('toggle-sidebar');
    $(window).resize();
})

Demo jsFiddle