Hola, alguien me pude echar una mano? No consigo con este código que siempre salga el fondo primero y cuando es true, que lance la vaca y...

Hola, alguien me pude echar una mano? No consigo con este código que siempre salga el fondo primero y cuando es true, que lance la vaca y el cerdo: a veces esas funciones no se ejecutan y no sé por qué? Muchas gracias!

var cnv=document.getElementById(“canvas”);

var papel=cnv.getContext(“2d”);

var fondo=new Image();

fondo.src=“tile.png”;

var cargafondo=false;

fondo.addEventListener(“load”,cargarFondo);

var vaca=new Image();

vaca.src=“vaca.png”;

var cargavaca=false;

var cerdo=new Image();

cerdo.src=“cerdo.png”;

var cargacerdo=false;

//PROCESO DE CARGA DE IMAGENES

function cargarFondo()

{

papel.drawImage(fondo,0,0);

cargafondo=true;

console.log("Fondo= "+cargafondo);

if (cargafondo==true)

{

cerdo.addEventListener(“load”,cargarCerdo);

vaca.addEventListener(“load”,cargarVaca);

}

}

function cargarVaca()

{

papel.drawImage(vaca,100,100);

cargavaca=true;

console.log("Vaca= "+cargavaca);

}

function cargarCerdo()

{

papel.drawImage(cerdo,300,300);

cargacerdo=true;

console.log("Cerdo= "+cargacerdo);

}