왜 이미지를 생성하지 않는가?

나는이 배열이 배열의 일부인 외계인을 표시하도록 노력하고있다.하지만 내 게임 루프의 일부로 함수를 호출 할 때 아무 것도 나타나지 않는다./왜 이미지를 생성하지 않는가?

// 외계 그림에 대한 배열을 설정합니다. var AliArray = new Array();

var Init = function(){ 

    var totalRows = 12; //How many rows of aliens to spawn 
    var totalCols = 12; //How many cols of aliens to spawn 
    // For loops that creates the multidemensional array [col][row] 
    for (q = 0; q < 12; q++) { 
     AliArray[q] = new Array(); 
    } 
    var imgWidth = 50; // Defines image's width 
    var imgHeight = 18; // defines image's height 
    var rng = Math.floor((Math.random() * 10) + 1); // Gives a random number so that it spawns different aliens once level is complete. 
    for (var row = 0; row < totalRows; row++) { 
     for (var col = 0; col < totalCols; col++) { 
      AliArray[row][col] = new Image(); 
      var x = col * imgWidth; 
      var y = row * imgHeight; 
      AliArray[row][col].onload = drawAliens(AliArray, row, col, x, y); 
      if (rng < 5) { 
       AliArray[row][col].src = "images/alien1.png"; 
      } 
      else if (rng > 5) { 
       AliArray[row][col].src = "images/alien2x.png"; 
      } 
      else { 
       AliArray[row][col].src = "images/alien3.png"; 
      } 
     } 
    } 
}; 

var drawAliens = function (AliArray, row, col, x, y) { 
    return function() { 
     ctx.drawImage(AliArray[row][col], x, y); 
    } 
};

의견은 내가 한 이미지를로드하지 왜에 관해서는 확실히 운동은 할 수 없습니다, 화려한 것입니다. 내가 처리 할 수있는 가장 큰 부분은 이미지를로드하는 것이지만, 올바른 순서로 캔버스가 사라지거나 사라지는 순간에 즉시 사라집니다. 새로운 HTML 페이지에이 코드는 다음 이미지의 경로 참조를 변경 과거에

이

출처

2014-04-09 li x

당신이 기능을 입력 확신 일 것 같다? console.log ("디버깅 중")를 추가하십시오. 또는 경고(); 함수가 실제로 호출되는지 여부를 확인하는 함수 내부. 다음으로 추측 할 것이 없을지도 모르는 경우를 가장 잘 추측 할 수 있습니까? 알리아스가 포함 된 배열이 비어 있는지 확인하십시오. – Sebastien

아, 배열이 실제로 아무 것도 안 고있는 것처럼 보이는 이유가 맞습니다! –

시도는

<!DOCTYPE html> 

<html lang="en" xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <meta charset="utf-8" /> 
    <title></title> 
</head> 
<body> 
    <canvas id="c" width="300" height="300"></canvas> 
    <script> 

    var c = document.getElementById('c'); 
    var ctx = c.getContext('2d'); 
    var AliArray = []; 
    var Init = function() { 

    var totalRows = 12; //How many rows of aliens to spawn 
    var totalCols = 12; //How many cols of aliens to spawn 
    // For loops that creates the multidemensional array [col][row] 
    for (q = 0; q < 12; q++) { 
    AliArray[q] = new Array(); 
    } 
    var imgWidth = 50; // Defines image's width 
    var imgHeight = 18; // defines image's height 
    var rng = Math.floor((Math.random() * 10) + 1); // Gives a random number so that it spawns different aliens once level is complete. 
    for (var row = 0; row < totalRows; row++) { 
    for (var col = 0; col < totalCols; col++) { 
    AliArray[row][col] = new Image(); 
    var x = col * imgWidth; 
    var y = row * imgHeight; 
     AliArray[row][col].onload = drawAliens(AliArray, row, col, x, y); 
     AliArray[row][col].src = "baby gator logo.jpg"; 
    } 
    } 
}; 

var drawAliens = function (AliArray, row, col, x, y) { 
return function() { 
    ctx.drawImage(AliArray[row][col], x, y); 
} 
}; 

Init(); 
</script> 
</body> 
</html>

출처

2014-04-09 16:26:29 InferOn

나는이 코드가 문맥에 넣을 때 갑자기 의도가 더 이상 나타나지 않는 이유가 확실하지 않다는 것을 이해한다 :/ –

모든 코드 :) – InferOn

왜 이미지를 생성하지 않는가?

답변

관련 문제