Responsive Highcharts not sizing correctly until window resize

javascript css highcharts zurb-foundation dynamic-resizing

I got this from another answer, so give thegreyspot some credit in this question.

solution: call $(window).resize(); after the graph is loaded (or when you fill it with data)

javascript css highcharts zurb-foundation dynamic-resizing

Just use the chart.reflow() function

javascript css highcharts zurb-foundation dynamic-resizing

Please take a look at these examples with responsive highcharts:

<div id="container" style="width:100%;margin: 0 auto"></div>

CodeHunter