Welcome, Guest. Please login or register. Did you miss your activation email?

Author Topic: Making a sprite rotate in the direction of the mouse position  (Read 6689 times)

0 Members and 2 Guests are viewing this topic.

DarthBuzzKill

  • Newbie
  • *
  • Posts: 7
    • View Profile
Making a sprite rotate in the direction of the mouse position
« on: November 21, 2014, 12:13:21 am »
So I need to narrow down just how to do this.

I keep seeing different answers which confuse me.

So I assume this means I need to create 2 vectors, one that goes from the sprite to the mouse position, and another that is the unit vector of the sprite, and then work out the cross product, and then get the angle using the cross product.

Is that correct? Or can I also use the dot product to find the angle? From what I've gathered, the Dot Product only takes two vectors that are in the (X, Y) format and are not unit vectors. This is what confuses me about the dot product, because I can only see how to calculate 1 vector when using dot instead of cross. with cross I simply use a unit vector in addition to the other vector. Whereas with dot you apparently can't use a unit vector to find the angle. So in that case, what other vector do I need to calculate, so I can find the angle between that one and the one going to the mouse position.

To add on, what I'm trying to say is: What vectors do I need to create and what product do I need to use to find the angle between those vectors?
The way I see it, no matter which product, I need a distance vector from the sprite to the mouse position. But the 2nd vector seems to differ between the 2 products. So what should the 2nd vector be?

Also, I wouldn't be surprised if thor had some functions to handle all this easily, but I want to do it manually at first.
« Last Edit: November 21, 2014, 12:26:07 am by DarthBuzzKill »

Hapax

  • Hero Member
  • *****
  • Posts: 3379
  • My number of posts is shown in hexadecimal.
    • View Profile
    • Links
Re: Making a sprite rotate in the direction of the mouse position
« Reply #1 on: November 21, 2014, 12:25:12 am »
Once you have a vector that represents the difference between the sprite and mouse position, you could then calculate the angle of the hypotenuse.

Hint 1: look for TOA.
Hint 2: you'll probably need atan (inverse tangent).
Selba Ward -SFML drawables
Cheese Map -Drawable Layered Tile Map
Kairos -Timing Library
Grambol
 *Hapaxia Links*

DarthBuzzKill

  • Newbie
  • *
  • Posts: 7
    • View Profile
Re: Making a sprite rotate in the direction of the mouse position
« Reply #2 on: November 21, 2014, 12:27:33 am »
Once you have a vector that represents the difference between the sprite and mouse position, you could then calculate the angle of the hypotenuse.

Hint 1: look for TOA.
Hint 2: you'll probably need atan (inverse tangent).
So you're talking about the vector going from the sprite to the mouse position, right? I'm still confused on what the 2nd vector needs to be, because obviously you need 2 vectors.

So if I'm using the dot product:
angle = atan2(distanceVectorY, distanceVectorX) - atan2(vectorY, vectorX));

I don't understand what the 2nd vector in the 2nd atan2() has to be defined as. It can't be a velocity vector or a unit vector, so what kind of vector should it be?
« Last Edit: November 21, 2014, 01:14:44 am by DarthBuzzKill »

Arcade

  • Full Member
  • ***
  • Posts: 230
    • View Profile
Re: Making a sprite rotate in the direction of the mouse position
« Reply #3 on: November 21, 2014, 02:12:38 am »
This seems to be a general geometry question more than a question relating to SFML. I don't visit these forums very often, so I don't know how much the community cares about non-SFML related questions, but I'll try to give you an answer anyway  :)

First of all, you are making this too hard on yourself by trying to do a cross or dot product. This is a basic geometry problem where you know the size of two sides of a right triangle and your trying to solve for the angle. The horizontal side of your right triangle is the distance between the x coordinate of your object and the x coordinate of the mouse. The vertical side of the triangle is the distance between the y coordinate of your object and the y coordinate of the mouse. Here is a picture of what I'm talking about.



Now, to solve for the angle (theta) you use the formula:

theta = tan-1(opposide side / adjacent side)
or in our case:
theta = tan-1( (mouse.y - object.y) / (mouse.x - object.x) )

as Hapax hinted at, in C or C++ you would use the atan2 function for this:
angle = atan2(mouse.y - object.y, mouse.x - object.x);

A few more notes:
  • The result of atan2 will be in radians. You will need to convert this to degrees if you are planning on using SFML's sprite rotate function.
  • Remember that in SFML y=0 is the top of the screen and y increases as you move down. This is the opposite of how normal geometry works. Therefore you may have to multiply the y component by -1 when doing your angle calculation.
  • at 0 degrees means that the mouse is to the right of your object. Therefore, it will probably be wise to make your base object sprite be pointing to the right and then rotate it based on the angle.
  • If you are using SFML's sprite rotate function be sure to set the origin of your sprite to be the center.

Hopefully that was helpful
« Last Edit: November 21, 2014, 02:22:17 am by Arcade »

DarthBuzzKill

  • Newbie
  • *
  • Posts: 7
    • View Profile
Re: Making a sprite rotate in the direction of the mouse position
« Reply #4 on: November 21, 2014, 12:47:55 pm »
Thanks a bunch Arcade! It's finally working now, I actually ran into another problem which was that my mouse position was relative to the screen and not the window, but now that that's fixed it's working.