Make an object face the mouse cursor?

Questions about the LÖVE API, installing LÖVE and other support related questions go here.
Forum rules
Before you make a thread asking for help, read this.
Post Reply
TOLG11
Prole
Posts: 2
Joined: Fri May 11, 2018 12:03 am

Make an object face the mouse cursor?

Post by TOLG11 »

I'm new to using love2d and I was confused on how to go about making a player face towards the mouse. I don't need exact code, I would just like to be led into the direction I should be headed to make this happen. Thanks :awesome:
User avatar
veethree
Inner party member
Posts: 877
Joined: Sat Dec 10, 2011 7:18 pm

Re: Make an object face the mouse cursor?

Post by veethree »

math.atan2.
User avatar
zorg
Party member
Posts: 3465
Joined: Thu Dec 13, 2012 2:55 pm
Location: Absurdistan, Hungary
Contact:

Re: Make an object face the mouse cursor?

Post by zorg »

Also not strictly specific to löve either; it's just math.
Me and my stuff :3True Neutral Aspirant. Why, yes, i do indeed enjoy sarcastically correcting others when they make the most blatant of spelling mistakes. No bullying or trolling the innocent tho.
User avatar
NotARaptor
Citizen
Posts: 59
Joined: Thu Feb 22, 2018 3:15 pm

Re: Make an object face the mouse cursor?

Post by NotARaptor »

"math.atan2" is indeed the right answer :)

But to be more specific, but still with zero code -
I was confused on how to go about making a player face towards the mouse
The "player" isn't special. The "mouse" isn't special. If you think about it in those terms you'll be looking for a "PlayerLookAtMouseComponent" on the Unity store.

Simplify and generalise. You have an object at point A which you want to rotate to face point B. It doesn't matter if B is the mouse position, the centre of the screen, the end effector of a robot arm, or the centroid of a complex polygon - it's just a point.

If we assume that the object (player) initially faces right (+X), and rotates anticlockwise from there, it's a really simple trig problem.
one.png
one.png (3.13 KiB) Viewed 4891 times
Simply apply SOHCAHTOA. The tangent of α is the opposite divided by the adjacent, or (yB-yA)/(xB-xA). So α=atan((yB-yA)/(xB-xA))

This only deals with one quadrant though. The point B can be in the top-right (where it is) but also top-left, bottom-left and bottom-right. The arctangent only returns value between -pi/2 and pi/2, so clearly we don't have the full picture. Another "gotcha" is the division - if A is directly above or below B, (xB-xA) will be zero, so the division won't be possible to do.

It might be worth working out each of these special cases and making your own function to handle them, just to understand how it works. However you don't need to - virtually all programming languages these days have atan2 built in, which handles them all for you.

α=atan2(yB-yA,xB-xA)
User avatar
pgimeno
Party member
Posts: 3656
Joined: Sun Oct 18, 2015 2:58 pm

Re: Make an object face the mouse cursor?

Post by pgimeno »

Worth noting that that formula applies when the sprite is drawn with the player pointing right, which is the value for 0°. If it is not, you may need to subtract an offset from the angle, to match the sprite. Remember angle is returned in radians.
User avatar
NotARaptor
Citizen
Posts: 59
Joined: Thu Feb 22, 2018 3:15 pm

Re: Make an object face the mouse cursor?

Post by NotARaptor »

Good point on the radians there, that might not be obvious to everyone.

Another thing I didn't actually mention is that I'm assuming the position of A (the player) is also the centre of rotation for it - if you draw the player at that position without an offset, it would naturally rotate around the upper-left corner rather than the centre, which is probably what you want.

To get a little bit more code-y this time, if we assume you're rendering the player with love.graphics.draw(), and the player sprite (image, quad, whatever) is PLAYER_WIDTH pixels wide and PLAYER_HEIGHT pixels tall, and you want it to rotate and be placed about its centre, you should call it like this:

Code: Select all

love.graphics.draw(PLAYER_SPRITE, x, y, alpha, 1, 1, PLAYER_WIDTH/2, PLAYER_HEIGHT/2
TOLG11
Prole
Posts: 2
Joined: Fri May 11, 2018 12:03 am

Re: Make an object face the mouse cursor?

Post by TOLG11 »

Thanks guys! Just got it to work! :D
Post Reply

Who is online

Users browsing this forum: Google [Bot] and 6 guests