Width

Hey vandsimy I’m glad you like the plugin.

I’d need to see the specific case where this is happening to figure out what might be happening.

There’s nothing in particular in the code that should ever be limiting the width to 600px when a chart is embedded in a post and I’ve actually never seen this issue crop up before.

Hey,

Sorry again for the delay. Life has been busy. Looking at that page I’m pretty sure the div that the chart is inside of is not a full width div which is why you aren’t getting a full width chart.

You’ll notice if you make the browser window small enough the chart is acting responsively.

OK, this is a weird one and I can’t duplicate it outside of your specific theme.

After looking at it for a bit I think what’s happening is that theme isn’t finished rendering until AFTER the Highcharts code has started rendering the charts. That means Highcharts is doing it’s thing before it knows the width of the containing div.

This isn’t the prettiest solution but probably the simplest fix would be to run the Highcharts reflow function on any charts in the page after small timeout (whatever is enough to give the them time to finish rendering).

Something along these lines SHOULD work:

var m_chart_refresh = {};

(function( $ ) {
	'use strict';

	m_chart_refresh.init = function() {
		setTimeout(function() {
			m_chart_refresh.reflow_charts();
		}, 500 );
	};

	m_chart_refresh.reflow_charts = function() {
		$( '.m-chart' ).each(function() {
			$(this).highcharts().reflow();
		});
	};

	$( function() {
		m_chart_refresh.init();
	} );
})( jQuery );

Obviously you’d want to adjust the timeout to be as small as possible while still reliably kicking in AFTER the theme has finished rendering.