如何使用HTML5画布让精灵旋转以面向鼠标位置？

Question

我试图跟随this tutorial在Flash中创建一个导航导弹，除了我想让它适应使用HTML5画布。我正在努力让精灵面向鼠标的方向;它旋转但并不总是面向鼠标！我已经摆弄了一个小提琴，所以你可以看到发生了什么。

http://jsfiddle.net/Mr4Tz/

非常感谢任何帮助。

Answer 1

传递给HTML5 rotate方法的角度值应该是弧度，但是你要传递度数。

根据您的示例，这应该有效：

var targetX  = mouse.x - missile.x
,   targetY  = mouse.y - missile.y
,   rotation = Math.atan2(targetY, targetX);

context.rotate(rotation);