图像旋转+水平或垂直翻转

Question

我正在开发一个HTML5画布图像应用程序，您可以在其中进行90º旋转，水平和垂直翻转等基本转换。

我用下面的矩阵来绘制图像：

matrix.scale(flipHorizontal, flipVertical); // Where each flip could be 1 or -1 
matrix.rotateZ(angle); // Angle could be 0,90,180 or 270º 

一切看起来都在一开始很好，但是当我做一个rotate90º和水平翻转后，只是相当于一个垂直翻转。

任何想法如何解决它？

example http://img688.imageshack.us/img688/1570/73811955.jpg

Answer 1

试试这个插件

演示：http://dmadan.in/imageflip.html

来源：https://github.com/dmadan86/imageflip

它工作在两个CSS3和帆布。

Answer 2

无法从代码片断告诉你给。可能是函数内部或调用函数时出错。可能与轴的处理方式有关。 水平翻转是y（垂直轴）中的反射。旋转之后，图像的y轴现在是水平的，所以除非您正确处理轴，否则“水平翻转”将反映在现在水平的y轴上，从而产生图像。