# Trigonometry help!

**Lord Sivell**- Novice
- Posts: 32
- Loc: Australia

The problem is as follows:

I have one movieclip (the blue one) that needs to face the target it is going to. I know I have to use trig, but I don't know how to get it to work.

On paper I worked it out that the code inside the blue things movieClip should look something like this:

A = the _x difference between the blue clip and the target clip;

O = the _y difference between the blue clip and the target clip;

// (a as in Adjacent and o as in Opposite)

this._rotation = tan /*to the power of -1*/ *(O/A);

My biggest problem is the tan method that is: tan(angle) In which case I can't get it to be to the power off -1.

Well if any of this made any sense some help would be greatly appreciated:

I have one movieclip (the blue one) that needs to face the target it is going to. I know I have to use trig, but I don't know how to get it to work.

On paper I worked it out that the code inside the blue things movieClip should look something like this:

A = the _x difference between the blue clip and the target clip;

O = the _y difference between the blue clip and the target clip;

// (a as in Adjacent and o as in Opposite)

this._rotation = tan /*to the power of -1*/ *(O/A);

My biggest problem is the tan method that is: tan(angle) In which case I can't get it to be to the power off -1.

Well if any of this made any sense some help would be greatly appreciated:

**Voetsjoeba**- Novice
- Posts: 31
- Loc: Belgium, Ghent.

If you have the y distance and the x distance, you can easily get the angle out of that by using the atan or the atan2 method. I personally prefer using atan. It works like this:

Math.atan(ydistance/xdistance)

But, you need to take note that two angles can have the same tangent (example: 45 degrees and 45+180 degrees have the same tangent). Therefore, it can be both those angles, so you need to check if the point you clicked lays to the right of your movieclip or to the left. That will make sure which corner it is.

I don't have the time now, but I'll make some drawings for you this evening so you can understand. I don't have the time now to provide some example code, so this is actually a short explanation. A bigger one will be up this evening, hang on

So let's say you have your angle using an if statement whether your point is to the left or to the right of the blue movieclip and the atan method. You would then need to convert it to degrees (Flash uses radians, based on pi: 180° = pi), to be able to use the _rotation property.

PI radians = 180 degrees

<=> 1 radiant = 180 / PI degrees

So our converting function will be this:

Use that method on the angle you got by calculating atan, and you ahve your degrees to rotate to

Math.atan(ydistance/xdistance)

But, you need to take note that two angles can have the same tangent (example: 45 degrees and 45+180 degrees have the same tangent). Therefore, it can be both those angles, so you need to check if the point you clicked lays to the right of your movieclip or to the left. That will make sure which corner it is.

I don't have the time now, but I'll make some drawings for you this evening so you can understand. I don't have the time now to provide some example code, so this is actually a short explanation. A bigger one will be up this evening, hang on

So let's say you have your angle using an if statement whether your point is to the left or to the right of the blue movieclip and the atan method. You would then need to convert it to degrees (Flash uses radians, based on pi: 180° = pi), to be able to use the _rotation property.

PI radians = 180 degrees

<=> 1 radiant = 180 / PI degrees

So our converting function will be this:

**Code**: [ Select ]

Math.convertToDegrees = function(radians){

return radians*(180/Math.PI);

}

return radians*(180/Math.PI);

}

- Math.convertToDegrees = function(radians){
- return radians*(180/Math.PI);
- }

Use that method on the angle you got by calculating atan, and you ahve your degrees to rotate to

**Voetsjoeba**- Novice
- Posts: 31
- Loc: Belgium, Ghent.

Ok, here we go. As you know, the tangent of an angle, is it's sine divided by it's cosine. On the goniometric circle (with radius 1), we can see the tangent:

Because the triangles ABC and AED are congruent, the relation between CB and BA is the same as the one between ED and DA. CB is the sine of angle µ, and BA is it's cosine. (opposite side/hypotenuse with hypotenuse == 1, the same goes for the cosine). Our equasion becomes:

sin µ / cos µ = tan µ / 1. Which is correct. Tangent comes from the latin word tangere by the way, which means 'to touch'. That is exactly what the tangent does: it touches the side of the circle.

Math.atan() is used with y/x: Math.atan(ydistance/xdistance). This is because you need to provide the tangent to calculate the angle from, and the tangent is sin/cos, where sin is on the y (vertical) axis and cos is on the x (horizontal) axis.

But, there's a but. Two angles can have the same tangent:

When calculating the arc tangent ( == atan == tan^-1), Flash will return the angle to the right side of the triangle. But that means that if our point is at the left part of the circle, Flash will return the angle at the right side that has the same tangent.

Therefore, we need to check if our point is at the left or at the right of our circle. If it's at the left, we will have to add 180°, so Math.PI, because Flash uses radians.

Another thing to be aware of is that Flash doesn't go counterclockwise around the circle, but clockwise. And, that the _rotation property doesn't go from 0 to 360, but from -180 to 180. So we can't have a clip rotate to 225° using _rotation = 225. We have to substract 360 from that value to make it negative, and then rotate it to that negative number.

Here's a FLA for you that puts all this theory into practice. Enjoy

And I've added the code here ...

Because the triangles ABC and AED are congruent, the relation between CB and BA is the same as the one between ED and DA. CB is the sine of angle µ, and BA is it's cosine. (opposite side/hypotenuse with hypotenuse == 1, the same goes for the cosine). Our equasion becomes:

sin µ / cos µ = tan µ / 1. Which is correct. Tangent comes from the latin word tangere by the way, which means 'to touch'. That is exactly what the tangent does: it touches the side of the circle.

Math.atan() is used with y/x: Math.atan(ydistance/xdistance). This is because you need to provide the tangent to calculate the angle from, and the tangent is sin/cos, where sin is on the y (vertical) axis and cos is on the x (horizontal) axis.

But, there's a but. Two angles can have the same tangent:

When calculating the arc tangent ( == atan == tan^-1), Flash will return the angle to the right side of the triangle. But that means that if our point is at the left part of the circle, Flash will return the angle at the right side that has the same tangent.

Therefore, we need to check if our point is at the left or at the right of our circle. If it's at the left, we will have to add 180°, so Math.PI, because Flash uses radians.

Another thing to be aware of is that Flash doesn't go counterclockwise around the circle, but clockwise. And, that the _rotation property doesn't go from 0 to 360, but from -180 to 180. So we can't have a clip rotate to 225° using _rotation = 225. We have to substract 360 from that value to make it negative, and then rotate it to that negative number.

Here's a FLA for you that puts all this theory into practice. Enjoy

And I've added the code here ...

**Code**: [ Select ]

_global.d = 0;

_global.angle = 0;

pointer._rotation = 0;

Math.convertToDegrees = function(radians) {

return radians*(180/Math.PI);

};

MovieClip.prototype.rotateTo = function(to){

to > 180 ? to-=360 : null

this.onEnterFrame = function(){

this._rotation = to-(to-this._rotation)/1.2

this._rotation > to-1 && this._rotation < to+1 ? delete this.onEnterFrame : null

}

}

this.onMouseDown = function() {

mc = this.attachMovie("dot","dot"+d,d)

mc._x = this._xmouse

mc._y = this._ymouse

var diffX = this._xmouse-pointer._x;

var diffY = this._ymouse-pointer._y;

diffX>=0 ? _global.angle = Math.atan(diffY/diffX) : _global.angle = Math.PI+Math.atan(diffY/diffX);

pointer.rotateTo(Math.convertToDegrees(angle));

_global.d++;

};

_global.angle = 0;

pointer._rotation = 0;

Math.convertToDegrees = function(radians) {

return radians*(180/Math.PI);

};

MovieClip.prototype.rotateTo = function(to){

to > 180 ? to-=360 : null

this.onEnterFrame = function(){

this._rotation = to-(to-this._rotation)/1.2

this._rotation > to-1 && this._rotation < to+1 ? delete this.onEnterFrame : null

}

}

this.onMouseDown = function() {

mc = this.attachMovie("dot","dot"+d,d)

mc._x = this._xmouse

mc._y = this._ymouse

var diffX = this._xmouse-pointer._x;

var diffY = this._ymouse-pointer._y;

diffX>=0 ? _global.angle = Math.atan(diffY/diffX) : _global.angle = Math.PI+Math.atan(diffY/diffX);

pointer.rotateTo(Math.convertToDegrees(angle));

_global.d++;

};

- _global.d = 0;
- _global.angle = 0;
- pointer._rotation = 0;
- Math.convertToDegrees = function(radians) {
- return radians*(180/Math.PI);
- };
- MovieClip.prototype.rotateTo = function(to){
- to > 180 ? to-=360 : null
- this.onEnterFrame = function(){
- this._rotation = to-(to-this._rotation)/1.2
- this._rotation > to-1 && this._rotation < to+1 ? delete this.onEnterFrame : null
- }
- }
- this.onMouseDown = function() {
- mc = this.attachMovie("dot","dot"+d,d)
- mc._x = this._xmouse
- mc._y = this._ymouse
- var diffX = this._xmouse-pointer._x;
- var diffY = this._ymouse-pointer._y;
- diffX>=0 ? _global.angle = Math.atan(diffY/diffX) : _global.angle = Math.PI+Math.atan(diffY/diffX);
- pointer.rotateTo(Math.convertToDegrees(angle));
- _global.d++;
- };

**Lord Sivell**- Novice
- Posts: 32
- Loc: Australia

Page **1** of **1**

To Reply to this topic you need to LOGIN or REGISTER. It is free.

## Post Information

- Total Posts in this topic: 5 posts
- Users browsing this forum: No registered users and 6 guests

- You
**cannot**post new topics in this forum - You
**cannot**reply to topics in this forum - You
**cannot**edit your posts in this forum - You
**cannot**delete your posts in this forum - You
**cannot**post attachments in this forum