html - HTML5 Canvas：混合多种转换

Question

如何缩小图像，然后将其中心旋转 30 度，然后垂直翻转旋转的图像，同时保持旋转？

Answer 1

其实解决方法很简单。这与数学无关——即混合转换矩阵——它与 js 和画布的工作方式有关。我实际上忘记在（所有）转换之前和之后调用 context.save() 和 context.restore() 。所以实际上应用了一半的转换，另一半在下一次迭代中应用。所以现在我只做 context.save ，然后是我所有的转换，最后是 context.restore 。请注意，变换是累积的，即一次旋转 1 度，然后再旋转 1 度，最终会导致 2 度旋转。