變化畫布圖像

Question

我想兌換一些畫布圖像（帽子和外套）

這裏是代碼

document.ready = function() { 

canvas = document.getElementById('canvasspace'); 
ctx = canvas.getContext('2d'); 

drawImage(); 

} 

function drawImage(){ 

    var tempimage = new Image(); 
    tempimage.src = jackets_images[jacket_to_draw]; 
    tempimage.onload = function(){ ctx.drawImage(tempimage, 0, 0); }; 

    var tempimage2 = new Image(); 
    tempimage2.src = hats_images[hat_to_draw]; 
    tempimage2.onload = function(){ ctx.drawImage(tempimage2, 0, 0); };  
} 

兩個圖像顯示了一個比其他一個，但使2次代碼與2個新的圖像（）;我的眼睛看起來不太好！但我不知道更好..請給我看光

Answer 1

var imageNames = new Array(); 
imageNames[0] = jackets_images[jacket_to_draw]; 
imageNames[1] = hats_images[hat_to_draw]; 

var drawnImages = new Array(); 

function drawImage(images) { 
    for (var i = 0; i < images.length; i++) { 
     drawnImages[i] = new Image(); 
     drawnImages[i].src = images[i]; 
     drawnImages[i].onload = function(){ 
      var thisImg = drawnImages[i]; 
      ctx.drawImage(thisImg, 0, 0); 
     }; 
    } 
}