使用圖像二維設置畫布

Question

我正在嘗試設置一個具有圖片背景的畫布。我想讓圖像變量，但這是一個不同的討論。

這是我的代碼。

var canvas = document.getElementsByTagName('canvas')[0]; 

var img = document.createElement('img'); 

img.onload = function() { alert(img.width + ' x ' + img.height); }; 

img.src='images/maps/de_dust2.jpg'; 

canvas.width = img.width; 
canvas.height = img.height; 

當頁面加載時，我得到正確的像素高度和寬度的警報，但畫布不顯示。

任何幫助表示讚賞。

Answer 1

var canvas = document.getElementsByTagName('canvas')[0]; 

var img = document.createElement('img'); 

img.onload = function() { 
    // you need to have thes in the onload, to have img width, height > 0 
    canvas.width = img.width; 
    canvas.height = img.height; 
    alert(img.width + ' x ' + img.height); 
}; 

img.src='images/maps/de_dust2.jpg';