Поворот точки в прямоугольнике
-
19-09-2019 - |
Вопрос
У меня есть точка в прямоугольнике, которую мне нужно повернуть на произвольный градус и найти координату xy этой точки.Как я могу сделать это с помощью javascript.
Ниже x,y будет что-то вроде 1,3, и после того, как я передам 90 в метод, он вернет 3,1.
|-------------|
| * |
| |
| |
|-------------|
_____
| *|
| |
| |
| |
| |
_____
|-------------|
| |
| |
| *|
|-------------|
_____
| |
| |
| |
| |
|* |
_____
В основном я ищу смелость для этого метода
function Rotate(pointX,pointY,rectWidth,rectHeight,angle){
/*magic*/
return {newX:x,newY:y};
}
Решение
Это должно сделать это:
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 };
}
Другие советы
newX = Math.cos(angle) * pointX - Math.sin(angle) * pointY;
newY = Math.sin(angle) * pointX + Math.cos(angle) * pointY;
Обязательно указывайте координаты относительно начала вращения!
(Синтаксис точно не проверял, но математика основана на матрице вращения)
Не связан с StackOverflow