Take the 2-minute tour ×
Mathematics Stack Exchange is a question and answer site for people studying math at any level and professionals in related fields. It's 100% free, no registration required.

I am developing a HTML5 Canvas Web App & I am having difficulty finding a formula/algorithm that will allow me to find the mid-point of a shape when it is rotated around a certain point.

I am given information about an arrow & I need to draw that arrow on the canvas - it gets tricky when the shape is rotated.

Can you suggest an algorithm I can use to calculate the mid-point of a shape.

The information I am know:
- x,y pos(which is the red dot) - width, height
- Arrow width, Arrow height
- Rotation in degrees

enter image description here

http://i.stack.imgur.com/Pv4iF.png

share|improve this question

1 Answer 1

up vote 1 down vote accepted

Let's assume you know or can find the coordinates of the midpoint when there is no rotation, let's call those coordinates $(m_x,m_y)$, and let's assume that the position point you said you know, which I'll call $(p_x,p_y)$, is fixed and is the center of the rotation. If the rotation has magnitude $\theta$ (positive being counterclockwise), then the new position of the midpoint is given by $$(p_x+(m_x-p_x)\cos\theta+(p_y-m_y)\sin\theta,\;\;p_y+(m_y-p_y)\cos\theta+(m_x-p_x)\sin\theta).$$

(I computed this using Mathematica, applying a rotational transformation of magnitude $\theta$ centered at $(p_x,p_y)$ to $(m_x,m_y)$.)

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.