Animated Pie Chart in AS3 - actionscript-3

Question

i'm trying to make an animated pie chart in AS3, which it only shows a single var, but this var updates every X seconds. What I wanna do, it's to animated this pie chart to update to the new "status" with a tween animation. Something I can't make work. I already tried with tweenmax and such.
This is my pie chart code generator:
var degree: Number = 90;
var degChange: Number = 1;
var circleR: Number = 100;
var circleX: Number = 100;
var circleY: Number = 100;
var angleR: Number = circleR / 4;
var spBoard: Sprite = new Sprite();
spBoard.x = circleX;
spBoard.y = circleY;
C1.Maskmc.addChild(spBoard);
var shFill: Shape = new Shape();
shFill.graphics.lineStyle(1, 0x000000);
shFill.graphics.moveTo(0, 0);
shFill.graphics.lineTo(circleR, 0);
shFill.x = 0;
shFill.y = 0;
var shAngle: Shape = new Shape();
spBoard.addChild(shFill);
function updatePicture(t: Number): void {
var radianAngle: Number //=// t * Math.PI / 180.0;
var i: int;
shFill.graphics.clear();
shFill.graphics.moveTo(0, 0);
shFill.graphics.beginFill(0xFF00FF, 1);
for (i = 0; i <= t; i++) {
shFill.graphics.lineTo(circleR * Math.cos(i * Math.PI / 180), -circleR * Math.sin(i * Math.PI / 180));
trace(i)
}
shFill.graphics.lineTo(0, 0);
shFill.graphics.endFill();
}
var clockTimerTRas: Timer = new Timer(1000, 0);
clockTimerTRas.addEventListener(TimerEvent.TIMER, UpdateP);
clockTimerTRas.start();
function UpdateP(evt: Event): void {
var TurnoEstaHora
var TurnoActual_A: int = (it takes a var from a php here)
degree = TurnoActual_A * (11.305)
updatePicture(degree);
}
Which as i said before, it only makes a circle or incomplete circle depending on the var that loads from the PHP.
So far it works something like this, https://media.giphy.com/media/qiutE2wCo1YXe/giphy.gif
I wanna tween that animation. Any ideas?
Thank you!

Answer 1

Here an example:
import flash.display.Sprite;
import fl.transitions.Tween;
import fl.transitions.easing.*;
var tempSprite:Sprite = new Sprite();
addChild(tempSprite);
tempSprite.x = 100;
tempSprite.y = 100;
function convertAngleToRadians(angle:Number):Number
{
return angle / 180 * Math.PI;
}
function fillRound(
graphics:Graphics,
color:uint = 0x000000,
alpha:Number = 1,
radius:Number = 10,
startAngle:Number = 0,
endAngle:Number = 360,
angleStep:Number = 1):void
{
var tempRadians:Number;
var startRadians:Number = convertAngleToRadians(startAngle);
var endRadians:Number = convertAngleToRadians(endAngle);
var radiansStep:Number = convertAngleToRadians(angleStep);
var tempPoint:Point;
graphics.beginFill(color, alpha);
if (endAngle % 360 == startAngle % 360)
{
graphics.drawCircle(0, 0, radius);
}else
{
var pointsCount:Number = Math.ceil((endAngle - startAngle) / angleStep);
for (var pointIndex:int = 0; pointIndex <= pointsCount; pointIndex++)
{
tempRadians = startRadians + pointIndex * radiansStep;
tempPoint = new Point();
tempPoint.x = Math.cos(tempRadians) * radius;
tempPoint.y = Math.sin(tempRadians) * radius;
graphics.lineTo(tempPoint.x, tempPoint.y);
}
}
graphics.endFill();
}
var _curPieStep:Number = 0;
function get curPieStep():Number
{
return _curPieStep;
}
function set curPieStep(value:Number):void
{
_curPieStep = value;
drawPie();
}
var pieMaxStep:int = 30;
var pieAngleStep:int = 360 / pieMaxStep;
function drawPie():void
{
tempSprite.graphics.clear();
fillRound(tempSprite.graphics, 0xFF0000, 1, 100, 0, pieAngleStep * curPieStep);
}
var myTween:Tween = new Tween(this, "curPieStep", Bounce.easeOut, 0, pieMaxStep, 4, true);
You may just copy'n'paste it into Flash IDE and check the result.

Answer 2

Try this
import flash.utils.Timer;
import flash.events.TimerEvent;
var degree: Number = 90;
var degChange: Number = 1;
var circleR: Number = 100;
var circleX: Number = 100;
var circleY: Number = 100;
var angleR: Number = circleR / 4;
var spBoard: Sprite = new Sprite();
spBoard.x = circleX;
spBoard.y = circleY;
C1.Maskmc.addChild(spBoard);
var shFill: Shape = new Shape();
shFill.graphics.lineStyle(1, 0x000000);
shFill.graphics.moveTo(0, 0);
shFill.graphics.lineTo(circleR, 0);
shFill.x = 0;
shFill.y = 0;
shFill.graphics.clear();
shFill.graphics.moveTo(0, 0);
shFill.graphics.beginFill(0xFF00FF, 1);
var shAngle: Shape = new Shape();
spBoard.addChild(shFill);
function updatePicture(t: Number): void {
var radianAngle: Number //=// t * Math.PI / 180.0;
var i: int;
i = clockTimerTRas.currentCount ;
shFill.graphics.lineTo(circleR * Math.cos(i * Math.PI / 180), -circleR * Math.sin(i * Math.PI / 180));
trace(i)
}
var TurnoActual_A: int = (100) ;
var clockTimerTRas: Timer = new Timer(10, TurnoActual_A);
clockTimerTRas.addEventListener(TimerEvent.TIMER, UpdateP);
clockTimerTRas.start();
function UpdateP(evt: Event): void {
var TurnoEstaHora
degree = TurnoActual_A * (11.305)
updatePicture(degree);
}