Return to Snippet

Revision: 41838
at February 23, 2011 22:00 by TeamFlash


Initial Code
import com.greensock.*;
import com.greensock.easing.*;
// ---------------------------
// Bar Char graph animation
// ---------------------------
// Enter number of bars
var bars:Number=2;
var animationDirection:String="vertical";// horizontal
var graphLabels:Boolean=true;// Are there any labels above or on bars?

// Trigger this function to start animation
setUp();

// Fade in axis
axis_mc.alpha=0;
TweenMax.to(axis_mc, 1, {alpha:1});

// Test to see direction and set bars ready to animate
function setUp():void{
	switch (animationDirection) {
		case "vertical" :
			for (var i:Number = 1; i<=bars; i++) {
				this["bar"+i].y = this["bar"+i].y + this["bar"+i].height;
			}
			break;
		case "horizontal" :
			for (var j:Number = 1; j<=bars; j++) {
				this["bar"+j].x = this["bar"+j].x - this["bar"+j].width;
			}
			break;
	}
	if(graphLabels)	hideLabels();
	TweenMax.delayedCall(1,animateBars);
}

// Test to see direction and animate bars
function animateBars():void{
	switch (animationDirection) {
		case "vertical" :
			for (var i:Number = 1; i<=bars; i++) {
				TweenMax.to(this["bar"+i], 1, {y:this["bar"+i].y-this["bar"+i].height, delay:0.2*i, ease:Circ.easeOut});
			}
			break;
		case "horizontal" :
			for (var j:Number = 1; j<=bars; j++) {
				TweenMax.to(this["bar"+j], 1, {x:this["bar"+j].x+this["bar"+j].width, delay:0.2*j, ease:Circ.easeOut});
			}
			break;
	}
}

function hideLabels(){
	for(var i:Number = 1; i<=bars ; i++)
	{
		this["barLabel"+i].alpha = 0;
	}
	TweenMax.delayedCall(2,animateLabels);
}

function animateLabels(){
	for(var i:Number = 1; i<=bars ; i++)
	{
		TweenMax.to(this["barLabel"+i],0.5,{alpha:1, delay:0.2*i});
	}
}

// ---------------------------
// Bar Char graph animation
// ---------------------------

Initial URL


Initial Description


Initial Title
Animating a bar chart

Initial Tags
animation

Initial Language
ActionScript 3