我如何为同一图像创建不同的图案<canvas>

Question

我有一个图像，我想多次在画布上以不同的旋转显示相同的图像。为此，我使用context.rotate()来旋转图像并使用context.fill()来绘制它。为了能够证明使用fill()形象，我首先需要在使用createPattern()方法，如：

context.save(); 
var altPattern = context.createPattern(image, "repeat"); 
context.fillStyle = altPattern; 
context.restore(); 

我的问题是，虽然我用save()和restore()，最后createPattern()我使用影响第一fillStyles以及，并在一次旋转中绘制所有图像。如何使用context.rotate()来旋转它，如何为同一图像创建不同的图案？

再次调用createPattern()并将其分配给不同的变量不起作用。

Answer 1

好吧，我明白了。开始在画布中填充或描边新零件时，应该使用context.beginPath()。我一开始并没有使用它，我只是使用了moveTo()，并且移动了上下文，随处调用fill()s。它看起来像是在工作，但与createPattern()这个问题出来了。因此，为了您的安全，对于您决定填充或描边的每个复杂形状，始终始于context.beginPath()。