Draw chart in stages to improve rendering speed?

[jpierce42]

Hi folks,

 

We recently upgraded our Flash-based FusionCharts to JS-only (version 3.4).  Our clients have noticed a slowdown in chart rendering speed, and we're looking for ways to improve performance.  We regularly request large amounts of data at a time (up to 5 years of daily data), so the slowness is most noticeable on these large date ranges. 

 

We noticed that one way to cut down chart rendering time considerably is to set drawAnchors = 0.  This speeds up chart rendering significantly (from 7 to 2 seconds, for example).  Right now, we're drawing anchors, but setting them to transparent so we can use tooltips.  We can't lose the tooltip functionality, so I'm wondering if either of the following is possible:

 

1)  Is there a way to include tooltips without drawing the anchors?

2)  If not, is there any way to split the chart rendering into stages?  E.g., draw the chart first without anchors, and then later render the anchors and tooltips?

 

Any other performance improvement ideas you have would definitely be welcome, too.  Thanks!

[Swarnam]

Hi,

 

Yes, try setting "anchoralpha" as  0 and drawAnchors as 1. This settings will display the tooltips.

 

To improve the performance, suggestion would be to feed data via JSON, turn off any gradients, turn off animations.

 

Hope this helps.

[jpierce42]

Hi Swarnam, thanks for your help!  Actually, the settings you described (anchorAlpha=0, drawAnchors=1) are what we had in place initially; we found that the code was still taking quite a while to add each anchor object, and we were hoping there was a way to keep the tooltip functionality without having to draw the anchors at all.  I'll assume the answer to that is no.

 

We are working on switching from XML to JSON; glad to know this should give a performance boost.  Any idea how much this will speed up performance?  I'm sure it's hard to give an exact figure without seeing the code, but just a ballpark, or some examples would be welcome.

 

As for the second question, is there any way to render a chart in two stages?  I.e., can we render without tooltips on the first pass, and then fill in the tooltips later?

[Swarnam]

Hi,

 

Yes, answer is no   . It is not possible to display a tooltip without the anchors.

 

Feeding data through XML, internally prior to rendering a JavaScript chart we would convert it to JSON. JSON creates a JavaScript object. The JavaScript object can be easily parsed and manipulated with JavaScript.

However, we do not have benchmarking saying JSON is X times faster than XML as of now.

 

No, you can render a chart in two stages.

 

Hope this helps.