Page 1 of 1

Rotation around point other than origin.

Posted: Sun Jun 30, 2013 8:24 am
by laserpanda
I'm making a little hockey game, and I'm having trouble making the stick rotate as illustrated in the picture.
owZvrdb.png
owZvrdb.png (3.29 KiB) Viewed 457 times
where the stick rotates from the same point in the skaters hand regardless of the skater's rotation, but I'm not really sure where to start. If possible, I'd also like to keep the stick from rotating through the player's body no matter which direction they're facing.

Re: Rotation around point other than origin.

Posted: Sun Jun 30, 2013 8:41 am
by raidho36
Thers's geometry solution to that, but this is acheived easily via transformations, since they stack on top of one another. Transform your player to desired rotation and position, render it, then add up another transform for the stick (relative to the player, this what's the thing of transform stacking) and render it too.

Re: Rotation around point other than origin.

Posted: Sun Jun 30, 2013 12:27 pm
by micha
First there is a simple, but not beautiful solution: Draw (in you graphics program, not in LÖVE) the player with different angles for the stick and then compose the animation from these images. That way you only have one image, which is the player together with the stick and this is rotated around the same point all the time.

Now the proper, but more difficult solution:
First find the coordinates of the joint (between stick and player), relative to the players origin (I use the center of his head). Let's say in this case this is 20 pixels to the right and 30 pixels up (just as an example). So

Code: Select all

deltaX = 20
deltaY = -30
Now if you rotate the player around the origin with a certain angle, then the relative coordinates of the joint are

Code: Select all

deltaXrotated = deltaX * cos(angle) - deltaY * sin(angle)
deltaYrotated = deltaX * sin(angle) + deltaY * cos(angle)
Which leads to the absolute position of the joint:

Code: Select all

jointX = playerX + deltaXrotated
jointY = playerY + deltaYrotated
And the modified angle of the stick is

Code: Select all

angleModified = angle + angleStick

Re: Rotation around point other than origin.

Posted: Sun Jun 30, 2013 12:31 pm
by Lafolie
Couldn't this be easily solved with use of Pythagoras Theorem?

Re: Rotation around point other than origin.

Posted: Sun Jun 30, 2013 12:41 pm
by micha
Pythagoras Theorem gives you the lengths of a diagonal line, given the coordinates of the end points. In this case the lengths and the angles is sort of given and the coordinates of the end point (the joint) has to be found.

Re: Rotation around point other than origin.

Posted: Sun Jun 30, 2013 1:46 pm
by laserpanda
micha wrote:First there is a simple, but not beautiful solution: Draw (in you graphics program, not in LÖVE) the player with different angles for the stick and then compose the animation from these images. That way you only have one image, which is the player together with the stick and this is rotated around the same point all the time.

Now the proper, but more difficult solution:
First find the coordinates of the joint (between stick and player), relative to the players origin (I use the center of his head). Let's say in this case this is 20 pixels to the right and 30 pixels up (just as an example). So

Code: Select all

deltaX = 20
deltaY = -30
Now if you rotate the player around the origin with a certain angle, then the relative coordinates of the joint are

Code: Select all

deltaXrotated = deltaX * cos(angle) - deltaY * sin(angle)
deltaYrotated = deltaX * sin(angle) + deltaY * cos(angle)
Which leads to the absolute position of the joint:

Code: Select all

jointX = playerX + deltaXrotated
jointY = playerY + deltaYrotated
And the modified angle of the stick is

Code: Select all

angleModified = angle + angleStick
The simple solution wouldn't work, because I want the stick to actually physically interact with the puck, rather than the traditional 2d hockey game approach of having the puck object disappear when the player touches it, and the player sprite switched to a player-with-puck sprite. The more complex solution seems like the right way to accomplish what I was trying to do. I'll see how it works.