Chart Dimensions with display: none

[dan.jackson]

Hi everyone,

 

We have just begun the roll-out of Fusion Charts for our system and have (pretty quickly) come across an issue that is inhibiting our ability to continue with this roll-out. 

 

Our issue may be similar to that of this forum post: http://forum.fusioncharts.com/topic/15776-fusion-charts-in-hidden-divs/?hl=hidden however I am not 100% sure if the issue reported is the same as ours or more to do with exporting, which is the reason for this post.

 

Basically if you render a chart within a <div /> that has display: none; set, then using JavaScript you display the <div /> the chart will have rendered using the default height and width instead of those specified.

 

For example:

 

A)  If I render the chart normally (without display: none;) then see fusion_charts_from_show.png (attached).

 

 If I then render the chart with the <div /> as display: none; and then show it, it renders like in fusion_charts_from_hidden.png (attached).

 

A is correct, while B is incorrect.

 

Is there a fix or a way to make the chart render correctly when we show the hidden <div />?  Preferably we do not want to run any JavaScript or anything when showing panels.

 

Any help will be appreciated.

 

For your information we are using: @version fusioncharts/3.3.1-sr3.21100

 

 

 

 

[Guest Sashibhusan]

Hi,

 

It seems you have set the chart dimension in pixel values. Could you please try once by setting the chart dimension in percentage?

 

Please note that before chart rendering in the browser, the FusionCharts framework will check for the DOM ready event (whether the DIV container is ready for placing the chart or not) and in your case, on each time show/hide of DIV container, the chart will try to take re-render with the default dimension, as the container is already present.

 

Hope this helps!