Your image probably hasn't finished loading at the point you are using drawImage:
HTML
Add onload handler in img tag:
<img id="scream" onload="draw()" src="...
Then the function to handle it:
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
var img=document.getElementById("scream");
function draw() {
ctx.drawImage(img,10,10);
}
Be aware of that where you place the scripts in your document matters as well.
I would recommend you setting the src
attribute in JavaScript as well. That makes it more "safe" to handle the onload
(or subscribed event with img.addEventListener('load', ...
).