如何在html画布上独立旋转2个图像

Question

我想用HTML画布显示一组齿轮。我有以下http://jsfiddle.net/jeepstone/RpmuE/但是小齿轮绕着大齿轮转动而不是保持固定而只是旋转。一旦我修好了，我就可以计算出齿轮的相对速度，但我无法理解为什么它会在主齿轮周围移动。

有什么想法吗？

Answer 1

<强> Demo

好吧，我认为导致这个问题的主要原因是缺少restore。要记住的一件事是你想在旋转之前进行翻译。否则，您将翻译canvas，然后旋转整个canvas，从而在上下文中旋转所有内容。

Answer 2

好的，好的。那讲得通。带上变速箱！