Проблемы с Canvas

Question

Я делаю некоторые тесты с HTML5 Canvas. Я пытаюсь нарисовать массив изображений на холсте, используя цикл for:

var blocks=["dirt","cactus","carvedSandstone","crackedStoneBrick","diamondOre","furnace","goldOre","grass","lapisOre","leaves","log1","sand","stone","stoneBrick","stoneMoss","woodOak"];
 for(var i;i<=blocks.length;i++){
  var id=document.getElementById(blocks[i]);
  var x=i*32;
  var y=0;
    if(x>=1000){
      y+=32;
   }
   ctx.drawImage(block,x,y);

Приведенный выше код представляет собой массив различных изображений, которые я хочу нарисовать, после чего следует цикл for, который (теоретически) должен рисовать каждый элемент в массиве со значением X = к числу раз, которое прошел for *32, Инструкция if только для того, чтобы создать новую строку после превышения ширины. Для всех намерений и целей, холст настроен правильно. Если приведенный выше код удален и заменен следующим кодом, предназначенное изображение рисуется правильно.

dirt=document.getElementById("dirt");
ctx.drawImage(dirt,0,0);

Если у меня есть неопределенность, если у вас есть вопросы, пожалуйста, дайте мне знать.

Полный код

Answer 1

var id=document.getElementById(blocks[i]); должно быть var block=document.getElementById(blocks[i]);нет?