Image processing 如何在HTML5画布上依次实现旋转和裁剪？

情况是这样的。我正在对画布上的图像应用

crop

，效果很好。现在我想对它应用

rotate

。我尝试使用基于浏览器的css旋转，但当选定的像素以一定的角度位移移开时，它会弄乱裁剪坐标选择。最后，当保存应用旋转的最终图像时，我将不得不放弃这种方法

目前，我正在使用一个堆栈来存储我裁剪的阶段，我使用它作为

undo

功能来恢复到以前的阶段。我只应用序列中的最后一种作物，这会产生与应用所有作物相同的结果

旋转时，序列可能是随机的。我可以做到：

rotate
crop
crop
rotate
rotate
crop

如何应用此序列？按照发生的顺序应用所有这些？这意味着我将不得不应用所有的作物和所有的轮作，这似乎有点低效。旋转是否只是角度的最新值，或者我必须随着裁剪顺序应用增加的角度

我真的需要一个专业的建议

---

注意：很抱歉，我不能粘贴任何代码示例，因为这是一个非常庞大的代码（2000多行）！请不要建议我使用Pixastic或jCrop之类的库，因为将它们与许多自定义功能一起使用是非常危险的！我更喜欢写我自己的代码。

如果你先旋转一个角度

a

，然后再旋转一个角度

b

，你当然不能在初始阶段以角度

b

执行一次旋转，并且希望得到任何等价的东西——它必须是

a+b

。如果有一系列

k

旋转，然后是一次裁剪，则可以对这些

k

旋转中的角度求和，并执行单个操作，然后才进行裁剪。如果你有一个序列“<代码> M <代码>作物，中间没有任何旋转，就不需要在第一个作物之后做其他作物。这就是我能从问题中得到的，你必须更好地描述你想要的。我使用的是一个全局角度变量，因此没有增加/减少角度的问题！我只是想知道我是否必须在原始图像上应用所有的旋转和裁剪，以达到最后阶段！我相信你完全误解了我的评论。在哪些情况下必须应用旋转（以及如何组合多个旋转），以及何时必须进行裁剪（以及何时可以忽略裁剪）。啊，这是真的。但是，由于裁剪和旋转不是我在图像上做的唯一事情，所以我在图像上还做了其他像素级的效果。每个效果都需要重新绘制画布，因此无论画布处于何种状态，都需要重新绘制。因此，你的问题现在没有意义了。