OK hello! I'm not the best at math I have a table here. Th
0 0|50 0|100 0|150 0
0 85|50 85|100 85|150 85
0 170|50 170|100 170|150 170
0 255|50 255|100 255|150 255
Left is x and right is y, sx and sy for drawImage (Thats the layout for my sprites) IS there anyway around the giant amount of if statements to control this?
If I am not explain this well enough, the argument sprite is a int 1 to 16 for the amount of animations the sprite has (Its a walking person) so 1 would be idle looking down and 2 would be a walk/step animation and so on each row down is changed in direction
function sprite(canvas, sprite, frame, x, y){
var sx, sy = 0, 0
(insert googleplex of 'if' statments)
canvas.drawImage(sprite,sx,sy,50,85,x,y,50,85);
}
Assuming your sprites are arranged in your image like this:
0 1 2 3
4 5 6 7
8 9 10 11
12 13 14 15
You can index them like this:
var xpixels = (spriteId%4)*50;
var ypixels = Math.floor(spriteId/4)*85;
x
and y
offsets are from the top left, so spriteId = 5
is at xpixels=50, ypixels=85
.
Collected from the Internet
Please contact [email protected] to delete if infringement.
Comments