# Line animation

**URL:** https://forum.kirupa.com/t/line-animation/315788
**Category:** Uncategorized
**Created:** [November 4, 2010, 3:14am UTC](https://forum.kirupa.com/t/line-animation/315788 "2010-11-04T03:14:53Z")
**Posts on this page:** 1
**Page:** 1

<div class="post-metadata">

### Author: ![intnpoe](https://avatars.discourse-cdn.com/v4/letter/i/22d042/32.png) [@intnpoe](https://forum.kirupa.com/u/intnpoe)
#### Post date: [November 4, 2010, 3:14am UTC](https://forum.kirupa.com/t/line-animation/315788/1 "2010-11-04T03:14:53Z")

</div>

hai…  
i want to draw line per segmen …  
in the script that i have made…i use unit vector to draw the line little by little

this is the my script  
Code:  
var garis:Sprite=new Sprite ;  
var x1,y1,x2,y2:Number;

x1=40;  
y1=75;  
x2=340;  
y2=60;

garis.graphics.lineStyle(5,0xCBFF65);  
garis.graphics.moveTo(x1,y1);  
garis.graphics.lineTo(x2,y2);

stage.addChild(garis);

var garis2:Sprite=new Sprite();

garis2.graphics.lineStyle(5,0x008855);

var panjang:Number;  
var a,b,dx,dy,ex,ey:Number;

dx=(x2-x1);  
dy=(y2-y1);

a=Math.pow(dx,2);  
b=Math.pow(dy,2);

panjang=Math.sqrt(a+b);//panjang vektor (x1, y1) dan (x2, y2)

ex=dx/panjang;// vektor satuan x  
ey=dy/panjang;// vektor satuan y

var counter:uint=0;  
var intervalDuration:Number=1;  
var interval:uint;

interval=setInterval(drawLine,intervalDuration);

function drawLine():void {

```
garis2.graphics.moveTo(x1, y1);
garis2.graphics.lineTo(x1+ex*(1+counter), y1+ey*(1+counter));
trace("drawLIne");
stage.addChildAt(garis2, 2);
counter++;
trace("x "+(arguments[0]+ex*counter));
trace("y "+(arguments[1]+ey*counter));

var k,l:Number;

k=Math.round(x1+ex*counter);
l=Math.round(y1+ey*counter);

if (k&gt;=x2&&l&gt;=y2) {
	trace("counter tengah "+counter);
	trace("interval clear!");
	trace("k "+ k);
	trace("l "+l);
	clearInterval(interval);
}

```

}  
is there other way to make the animation line like that??  
i just learning AS3…  
thks 4 ur help
