Forcing 'rallychart' component to redraw on container resize

Question

I have a border layout applied to my app where the left (west) panel is collapsible and the right (center) panel contains a rallychart component. The idea was that when the left panel was collapsed, the user would get a larger version of the chart since there would be more area to draw it. The problem I'm experiencing is that when the left panel is collapsed, the chart does not redraw. This surprises me since if the center container is resized in any other way (window size changes) the chart will redraw to fill the larger container automatically.

Is there a way I can force the rallychart to redraw? Perhaps by triggering the same event that the window size change event triggers?

Answer 1

Rally.ui.Chart wraps an instance of a third party component which provides an Ext interface to the underlying Highchart object.

You can get a reference to that like this:

var chartWrapper = chart.down('highchart');

The code for that component lives here: https://github.com/RallySoftware/Highcharts_ExtJs_4/blob/master/Chart/ux/HighChart.js

In there you can see that it wires up a handler for window resize that calls the onResize method. Even though that's marked private I think that should work and is your best option.

chartWrapper.onResize();

Answer 2

Take a look at the answer to this question; it will probably get you there: a combination of reloading the store and refreshing the chart component.