I can see this has been asked before in various ways. I am struggling to work it out though hence asking again.
2d sprite that moves and rotates. I'm looking to contain it in a bounding box as it appears that is the most efficient way to do collision detection.
I had no problems getting it to work without rotation but that is simple! Now the sprite rotates I can't seem to find the right way of writing the code.
To create a bounding box for the sprite, my understanding is I need to work out the 4 corners of the sprite after rotation and use these to work out the width + height of the correctly sized bounding box.
I've used the article here - http://msdn.microsoft.com/en-us/library/dd162943(v=vs.85).aspx - specifically the formula:
x' = (x * cos A) - (y * sin A) y' = (x * sin A) + (y * cos A)
The code I'm currently using:
x1 = (positionX * Math.cos(rotation)) - (positionY * Math.sin(rotation)); y1 = (positionX * Math.sin(rotation)) + (positionY * Math.cos(rotation)); x2 = (positionX+width/2 * Math.cos(rotation)) - (positionY+height/2 * Math.sin(rotation)); y2 = (positionX+width/2 * Math.sin(rotation)) + (positionY+height/2 * Math.cos(rotation));
positionX and positionY is the current top left hand corner position of the sprite.
rotation is the radians the sprite has been rotated by (and rotation is from the centre).
width and height are of the sprite.
I thought the code above would give me the co-ordinates of the top left and top right corners of the rectangle, rotated appropriately. However, on my canvas, I'm drawing a line from x1,y1 to x2,y2 and it doesn't follow the sprite at all!
Any suggestions? Sorry for the long post!