在我的代码中，我将图像加载到canvas元素。然后我需要拖动，调整大小，旋转并倾斜它。我设法实现了拖动和调整大小。如何在此代码上使用鼠标实现偏斜？我读了一篇关于这个主题的有用文章（http://www.subshell.com/en/subshell/blog/image-manipulation-html5-canvas102.html）。我发现了fabricjs插件，但它只能处理一个图像而且没有拖动。例如：http://fabricjs.com/matrix-transformation/。 如果您将使用转换函数：
ctx.transform(1, 0.5, -0.5, 1.2, 30, 60);
这将转换分配给canvas元素的所有图像对象。我想只选择图像。
我的代码：
答案 0 :(得分：2)
这是一个更新的fiddle，允许您在单击其中一个角手柄时按Shift键单独倾斜任何图像。您可能需要稍微调整一下以使运动看起来更直观。
诀窍确实在ctx.save()调用周围使用ctx.restore()和ctx.transform()，这可确保转换（以及任何其他属性更改）仅适用于{{1} }和save。
以下是主要变化：
restore：
Shape.prototype.draw