我正在制作一个HTML5画布游戏,我希望旋转其中一个图像。
var link = new Image();
link.src='img/link.png';
link.onload=function(){
ctx.drawImage(link,x,y,20,20); // draws a chain link or dagger
}
我希望旋转这张图像。旋转图像的标准方法是在画布上下文对象上设置旋转。然而,这会轮换整个游戏!我不想这样做,只希望旋转这一个精灵。我该怎么做?
我正在开发一个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º
开始的时候一切看起来都很好,但是当我旋转90度,在水平翻转之后,它就像垂直翻转一样。
你知道怎么修复它吗?