Canvas 관련 문제

Question

HTML5 Canvas로 테스트하고 있습니다.

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 루프 다음에 그리는하려는 다른 이미지의 배열입니다 : 내가 for 루프를 사용하여 캔버스에 이미지의 배열을 그리려고 해요 배열에서 각 항목을 X 값 = for가 * 32를 거친 횟수로 그려야합니다. if 문은 너비가 초과되면 새 행을 만들 수 있습니다. 모든 의도와 목적을 위해 캔버스가 올바르게 설정되었습니다. 위 코드를 제거하고 다음 코드로 바꾸면 의도 한 이미지가 올바르게 그려집니다.

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

질문이있는 경우 막연한 질문이 있으면 알려 주시기 바랍니다.

Full Code

Answer 1

var id=document.getElementById(blocks[i]); 아니, var block=document.getElementById(blocks[i]);해야 하는가?