AS3: Pointing at Mouse

[trig1]

AS3: Main

This tutorial will produce something like this in AS3 code.

Create a new AS3 document. Draw an arrow pointing left, and make it a movieclip. Give it an instance name of "arrow". Then put this code onto the main frame of the timeline:

import DisplayObject.*;
this.addEventListener(Event.ENTER_FRAME, OEF);
function OEF(Event){
xdif = mouseX-arrow.x;
ydif = mouseY-arrow.y;
arrow.rotation = Math.atan2(ydif, xdif)/(Math.PI/180);
}

What does this mean? Lets break it down:

import DisplayObject.*; - This code imports the mouseX and mouseY values.

this.addEventListener(Event.ENTER_FRAME,OEF); - This creates a new eventListener, that runns the function "OEF", and makes it run every frame. This is the AS2 equivalent of onEnterFrame = function().

function OEF(Event){ - This defines the OEF function.

xdif = mouseX-arrow.x;
ydif = mouseY-arrow.y; - These codes work out the x and y differences between the arrow and the mouse.

arrow.rotation = Math.atan2(ydif, xdif)/(Math.PI/180); - This uses trigonometry to work out the angle using the x and y differences.

This is my first tutorial, and its one of the first AS3 ones! Lucky I nabbed an easy topic before they all went...

[Fatal]

Nice tutorial.

But i think i need to learn the absolute basics of AS3 before something like this lol

[Pyromaniac]

Lol I JUST made this topic, well mine shoots to the mouse as well. Oh well.

[Cybex]

You didn't really explain how it works, just what it does. Perhaps it would've been better if you explained how -rotation is in degress but trigonometry works in radians for flash, so you have to convert it. And breifly explained what the atan2 function does trigonometry wise.

[trig1]

At 5/2/07 05:31 PM, Pyromaniac wrote: Lol I JUST made this topic, well mine shoots to the mouse as well. Oh well.

Lol, we both just posted on each others topic saying we made the same thing :P

Oh well, its all good.

[Jindo]

I tried it and got a couple (6) compile errors :P.

I adjusted it slightly and found:

~You need to define xdif and ydif first:

var xdif:Number = 0;
var ydif:Number = 0;

~The import DisplayObject was causing errors, removing it made the flash work.

~Here's my new code, not sure if it's suppose to be like this, but yeah :P.

var xdif:Number = 0;
var ydif:Number = 0;
this.addEventListener(Event.ENTER_FRAME, OEF);
function OEF(Event) {
xdif = mouseX-arrow.x;
ydif = mouseY-arrow.y;
arrow.rotation = Math.atan2(ydif, xdif)/(Math.PI/180);
}

[trig1]

At 5/3/07 02:44 AM, Jindo wrote: I tried it and got a couple (6) compile errors :P.

Hmm... how strange, it works perfectly for me...

Are you using CS3? I'm just using the flash 9 alpha.

[TrueDarkness]

At 5/3/07 11:09 AM, trig1 wrote:

At 5/3/07 02:44 AM, Jindo wrote: I tried it and got a couple (6) compile errors :P.

Hmm... how strange, it works perfectly for me...

Are you using CS3? I'm just using the flash 9 alpha.

That would probably be the problem :)
Yeah I got the 6 errors too and tweaked. Works fine now. Nice job though.

[ShittyFlash]

wowzers thats awesome! :)

[Denvish]

At 5/2/07 05:34 PM, Cybex wrote: You didn't really explain how it works, just what it does. Perhaps it would've been better if you explained how -rotation is in degress but trigonometry works in radians for flash, so you have to convert it. And breifly explained what the atan2 function does trigonometry wise.

Great reference for that is here, for anybody that's interested. Trig doesn't come naturally to me (ie, I can never remember what cos/sin/tan/atan/atan2 do), so I refer to that page all the time.

Couple of functions I'm currently using (in AS2, though):

function TRAD(xxx) {return(xxx*Math.PI/180);} //CONVERT DEGREES TO RADIANS
function TDEG(xxx) {return(xxx*180/Math.PI);} //CONVERT RADIANS TO DEGREES