javascript does not load image

Question

I’m making a game in Javascript and the images do not load.

When I open the console (F12) no error. This happens in Google Chrome and Firefox. But when I put <img src="imagem.png"> she shows up.

<canvas id="tela" width="600" height="400" style="margin-left:250px;margin-top:100px;border:1px solid #000;"></canvas>

<script type="text/javascript">
var tela = document.getElementById("tela")
var c = tela.getContext("2d");

var img = new Image();
    img.src ='image/grama.jpg';
var img2 = new Image();
    img2.src ="image/folhagens.jpg";

var x = 0;
var x2 = 0;
while(x < 350) {
    c.drawImge(img, x,320, 180, 80);
    c.drawImage(img2, x2,275,120, 70);
    x += 40;
    x2 += 110;
};
var desenha = function(x,y){

    DImagem(img2,x2,0);
    DImagem(img,x,0);   
    x = x + 1;
    x2 = x2 + 1;    
}
</script>

I’ve already searched the net and I haven’t heard back. Thank you in advance.

Answer 1

drawImage is spelled wrong...

c.drawImge(img, x,320, 180, 80);

should be:

c.drawImage(img, x,320, 180, 80);