How to stop the legend disappearing during the animation of Google Charts?

I am using the Google Charts API to create a column chart. I have some other parts of the page that are animated when they load (not in the Google API) and would like Google graphics to come to life as well. This is pretty easy to implement, but the weird thing is how the chart is animated, and then the legend appears after the animation finishes.

Is it possible to immediately call a legend so that it is visible during the animation of diagrams?

Here's a script showing some animation diagrams and the following legends: http://jsfiddle.net/Qquse/1343/ , passing some animation settings in the diagram parameters ...

var options = { animation: { duration: 3000, easing: 'out', 'startup': true } //etc... }; 

This thread: https://groups.google.com/forum/#!topic/google-chart-api/q15ggJ0sHNc may seem like I can do nothing about it, since this is a necessary feature of the way Google animates charts.

Thanks!

+8
javascript jquery html charts
source share
1 answer

It looks like it was a deliberate choice of the developers, because the entire graph is redrawn for each frame, the animation causes flickering in the legend, so it seems that it cannot be processed using Google graphs.

I would try a different approach. I would get rid of GC generation by adding legend: 'none' to the parameters, and then create my own with a transparent canvas or svg, which I overlay on top of the chart, allowing it to be all the time regardless of the animation.

0
source share

All Articles