爲什麼我的Canvas不會顯示？

Question

<canvas id="canvas" width="150" height="150"> 
    <p>Désolé, votre navigateur ne supporte pas Canvas mettez le donc à jour</p> 
</canvas> 
<script> 
    var canvas = document.querySelector('#canvas'); 
    var context = canvas.getContext('2d'); 
    var test = new Image(); 
    test.src = 'test.jpg'; // I'm sure that test.jpg is in the folder 
    context.drawImage(test, 35, 35); 
</script> 

你能幫我嗎？我的畫布確實存在，但我無法在其中插入圖像。爲什麼？有人能解釋我嗎？

Answer 1

您需要等到圖像下載完畢後，使用其load事件。

var test = new Image(); 

test.onload = function() { context.drawImage(test, 35, 35); }; 

test.src = 'test.jpg';