Iura Rusu
Iura Rusu

Reputation: 95

AS3 drawing lines, making shorter after that

i have a little math/coding problem witch i don`t have any idea how could i do it work in a simple way, so the problem is is need to make a line shorter, with 15

in my program i have : http://gyazo.com/aff5ff61fb9ad3ecedde3118d9c0895e

the line takes the center coordinates of both circles and draws from one to another, but i need it to be from the circumference of the circles, so it wont get inside the code im using is :

var  line:Shape = new Shape();
    line.graphics.lineStyle(3,0xFF0000,2);
    line.graphics.moveTo(sx,sy);
    line.graphics.lineTo(fx,fy);
    this.addChild(line);
    arrow2(sx,sy,fx,fy);

    var rline:Shape = new Shape();
    rline.graphics.lineStyle(3,0xFF0000,2);
    rline.graphics.moveTo(fx,fy);
    rline.graphics.lineTo(xa,ya);
    this.addChild(rline);

    var rline2:Shape = new Shape();
    rline2.graphics.lineStyle(3,0xFF0000,2);
    rline2.graphics.moveTo(fx,fy);
    rline2.graphics.lineTo(xb,yb);
    this.addChild(rline2);

the rline and rline2 function is for the arrow lines, now my question is how do i make it shorter not depending on it direction so it will not overlap the circle

Upvotes: 0

Views: 341

Answers (1)

divillysausages
divillysausages

Reputation: 8033

You can use vectors to solve your problem; they're pretty easy to get the hang of, and pretty much indispensable for things like game dev or what you're trying to do. You can get an overview here: http://www.mathsisfun.com/algebra/vectors.html or by searching "vector math" in google

So first step is to get a vector from one circle to another (pretty much what you've done):

var vector:Point = new Point( circle2.x - circle1.x, circle2.y - circle1.y );
var length:Number = vector.length; // store the length of the vector for later

This is the equivalent of saying "if you start at circle1 and move along vector, you'll arrive at circle2"

Next thing we're going to do is normalise it; all this does is set the length to 1 - the direction is unchanged - this makes it easier to work with for what you're looking to do. A vector with length 1.0 is called a unit vector:

vector.normalize( 1.0 ); // you can pass any length you like, but for this example, we'll stick with 1.0

Now, to draw a line from one circle to another, but starting from the outside, we simply find the start and the end points. The starting point is simple the position of circle1 plus vector (normalised to unit length) multiplied by the radius of circle1:

var sx:Number = circle1.x + vector.x * circle1.radius; // or circle1.width * 0.5 if you don't store the radius
var sy:Number = circle1.y + vector.y * circle1.radius;

The ending point can be found by starting at our start point, and continuing along our vector for a distance equal to the distance between the two circles (minus their radii). The length value that we created earlier is the distance between your two circles, from one center point to another, so we can use that to get the distance minus the radii:

var dist:Number = length - ( circle1.radius + circle2.radius ); // or circle1.width * 0.5 etc

And so the end point:

var ex:Number = sx + vector.x * dist;
var ey:Number = sy + vector.y * dist;

And to draw the line between them:

var line:Shape = new Shape;
line.graphics.lineStyle( 1.0, 0x000000 );
line.graphics.moveTo( sx, sy );
line.graphics.lineTo( ex, ey );
this.addChild( line )

Upvotes: 1

Related Questions