javascript旋转翻译函数答案

【问题标题】：javascript rotation translation functionjavascript旋转翻译函数
【发布时间】：2012-07-04 15:46:00
【问题描述】：

有没有人在javascript中旋转后x/y位置的翻译功能？

例如：

this.mousex = event.clientX - this.el.offsetLeft;
this.mousey = event.clientY - this.el.offsetTop;

给我鼠标位置，但是我的父 div 旋转了 x 度，这当然意味着 mousex/mousey 不正确。 javascript 是否有内置的功能（不是我见过的，但是..）？

非常感谢

【问题讨论】：

嗯，它有 Math.sin()、Math.cos() 和 Math.tan() 来帮助你，但数学必须由你来完成。
该死的，我得去复习我的学校课了。希望js现在可能已经添加了一个简单的点翻译

标签： javascript math trigonometry

【解决方案1】：

我刚刚为你写了以下内容，我已经用(1,0,Math.PI/2) 和(0,1,Math.PI/2) 进行了检查，它有效。

function rotatePoints(x,y,angle){
   var point={};
   point.x = x*Math.cos(angle)- y*Math.sin(angle);
   point.y = x*Math.sin(angle) + y*Math.cos(angle);
   return point;
}

应该可以，见Rotation Matrix in Wikipedia

当然，角度应该是弧度。您可以通过乘以 Math.PI 并除以 180 将度数转换为弧度。角度是逆时针方向，如果您想顺时针旋转通过 -angle 或将 sin 更改为 -sin 应该可以。

【讨论】：

【解决方案2】：

假设您的 div 顺时针旋转了t 弧度。那么变换后的坐标为：

x' = cos(t)*x - sin(t)*y

y' = sin(t)*x + cos(t)*y

【讨论】：