Jquery Fusion Chart Doesn't Render Completely Until After Being Resized

[evanhobbs]

Hi, I'm using the jquery plugin for fusion charts. Originalliy I was using the 'auto' for the renderer but the y axis name was being truncated in weird ways so I switched to the javascript 'renderer'.

 

It seems to render ok except for the fact the line (using line.swf) doesn't show up on the graph. If I move my mouse around the data points are there because the little tooltips pop up... Like this:

 

 

BUT if I resize the window (I have width set to 100% on the chart) the line does show up just fine and the charts looks correct. Like this:

 

 

Anyone know why this might be happening?

 

Here is the initialization I am doing (chart & styles objects are prebuilt elsewhere... this.$el is the jquery element I'm using).

 

 

var dataSource = {

   chart: chart,

   styles: styles,

  data: this.collection.toJSON()

};

 

this.$el.insertFusionCharts({

   swfUrl: '/extra/FusionCharts/Line.swf',

   dataSource: dataSource,

   dataFormat: "json",

   width: "100%",

   height: "325",

   bgColor: "#ffffff",

   renderer: 'javascript'

});

 

Thanks,

Evan

 

[Guest Sumedh]

Hi Evan,

 

Welcome to FusionCharts Forum!

 

We are unable to replicate the same.

 

Chart is getting resized properly. Please find attached screen-shot and sample for your reference.

 

Chart has been rendered using latest FusionCharts XT files i.e., FusionCharts XT v3.3.1 Service Release 1 files.(jquery.min.js version: 1.8.3 included in the sample folder).

 

Hope this helps!

 

jQuery_Resize.zip