如何知道TOP和LEFT根据旋转度使用？

Question

Mates，我对数学非常不满意如何做到以下几点：

我正在旋转div：

document.getElementById('pig').style.webkitTransform = 'rotate('180 + 'deg' + ')';

用按键移动它，但我需要根据我的角度对角移动它。

• 考虑0度我应该将我的div移到右边
• 考虑到180度我应该将我的div移到左边
• 考虑到90度我应该将我的div移到顶部
• 考虑到270度我应该将我的div移到底部

我需要用什么魔法知道我应该放多少

document.getElementById('pig').style.top

以及我应该放多少

document.getElementById('pig').style.left

如果不清楚，请问我！

Answer 1

将度数转换为radians：

var deg = /* whatever */;
var rad = deg * (Math.PI/180);

然后分别使用Math.sin()和Math.cos()获取垂直和水平组件：

 var yComponent = Math.sin(rad);
 var xComponent = Math.cos(rad);