HTML5画布地形设置绘图

Question

喜欢的东西我有地形设置 - http://flashpunk.net/img/tut/swordguy.png

我的绘制代码 - http://jsfiddle.net/WnjB6/

但如何做这样的事情 - drawTile（X，Y，瓷砖，宽，高）;

现在需要在tile上设置tileX和tileY，但是如何仅设置一个tile需要设置和绘制所有tileset中的tile？

像现在一样需要tileX = 3，tileY = 1，但我需要 - 瓷砖= 8，并绘制相同的瓷砖。 'http://flashpunk.net/img/tut/swordguyframes.png

如何做类似的事情？

感谢您的帮助和抱歉，我的英语语言不好。

Answer 1

你知道有6个块一排，这样你就可以做这样的：

var drawTile = function(x, y, tile, width, height) { 
    context.drawImage(image, (tile % 6) * width, Math.floor(tile/6) * height, width, height, x, y, width, height); 
}; 

所以传递6必去的第一块在第二排，等

这是一个例子，它循环所有的瓷砖：

http://jsfiddle.net/Jrjyq/