javascript - Drawing an image from right to left in html5 canvas context -
i need context.drawimage(...) begins drawing right left. possible this? lets have player1 , player2 in pictures
the thing both of them same sprite, , each frame of sprite has different width , height, not problem when draw player1(left align) because variation of width can affect rightmost part of arm, not movement of character. now, when draw player1 fliped(player2), painting begins punching hand , messes character movement animation. so, want drawing player2 beginning right side of image instead default method, or viable solution. sprite painter this
that.paint=function(frameoriginx,frameoriginy,xposition,yposition,framewidth,frameheight,previouswidth,previousheight,fliped){ if(fliped==true){ that.context.imagesmoothingenabled = false; that.context.save(); that.context.translate(xposition, yposition + frameheight); that.context.rotate(180*math.pi/180); that.context.scale(1, -1); that.context.translate(-(xposition + framewidth), -(yposition + frameheight)); } //floor var global , equal 300 var oldycoord=floor-previousheight; that.context.clearrect(xposition,oldycoord, previouswidth, previousheight); that.context.drawimage( that.image, frameoriginx, frameoriginy, framewidth, frameheight, xposition, yposition, framewidth, frameheight); if(fliped==true) that.context.restore(); }
for learning reasons using plain javascript job, no engines no librarys. here game demo
Comments
Post a Comment