Rotate point in rectangle

Question

I have a point in a rectangle that I need to rotate an arbitrary degree and find the x y of the point. How can I do this using javascript.

Below the x,y would be som

Answer 1

newX = Math.cos(angle) * pointX - Math.sin(angle) * pointY;
newY = Math.sin(angle) * pointX + Math.cos(angle) * pointY;

Make sure to specify the coordinates relative to the rotation origin!

(Haven't checked the syntax exactly, but the math is based on a rotation matrix)

Answer 2

This should do it:

function Rotate(pointX, pointY, rectWidth, rectHeight, angle) {
  // convert angle to radians
  angle = angle * Math.PI / 180.0
  // calculate center of rectangle
  var centerX = rectWidth / 2.0;
  var centerY = rectHeight / 2.0;
  // get coordinates relative to center
  var dx = pointX - centerX;
  var dy = pointY - centerY;
  // calculate angle and distance
  var a = Math.atan2(dy, dx);
  var dist = Math.sqrt(dx * dx + dy * dy);
  // calculate new angle
  var a2 = a + angle;
  // calculate new coordinates
  var dx2 = Math.cos(a2) * dist;
  var dy2 = Math.sin(a2) * dist;
  // return coordinates relative to top left corner
  return { newX: dx2 + centerX, newY: dy2 + centerY };
}