Chart Drawing Animation

[Cyle Hunter]

In my application I'm calling a function on page load that draws a barchart from JSON data retrieved server-side. I'm trying to include a transition effect on my barchart as it's initially drawn. Is the only way to accomplish this to initialize the chart with an empty datatable, change the datatable and redraw? It's a bit of an awkward solution for me as I currently have a single function responsible for drawing any kind of chart based on JSON data it receives & I would like to keep it as agnostic as possible, I don't want to have to write individually scripts for each and every one of my charts that get drawn to handle this.

Are there any unobtrusive solutions for drawing animations?

[asgallant]

There's no support for animating the initial draw, but since you have a function that can take a JSON string and draw a chart with it, why not initialize it with a JSON string for an empty chart, then update with data?

[Cyle Hunter]

@asgallant Doesn't quite work that way it seems, for the transition to take effect you have to change existing data you can't just add data to a blank table unfortunately.

[asgallant]

Here's a hack around the problem: http://jsfiddle.net/asgallant/VkeqJ/

Basically, you need to draw the chart initially with a data series that is invisible and doesn't trigger any mouse interactions, then redraw with the actual data.

[Cyle Hunter]

That looks like it's a lot more feasible if I was to build something that is reusable, thanks for the help!