Bueno creo que estas creando muchas funciones innecesarias para crear una imagen en un canvas por ejemplo yo si quisiera agregar una imagen hiciera lo siguiente:
una funcion la cual selecciona el div por ejemplo de esta manera: document.getElementById despues creo un objecto el cual te ayudaria a traerlo de una manera facil en muchas funciones en vez de crearlo varias veces, despues uso la funcion onloand que como sabes su funcion principal es en si traer elementos como por ejemplo imagenes,frame al dom.
mas informaciion de la funcion onloand aqui
y despues sencillamente dibujo el canva con la imagen con una sola linea y no creando otra funcion para eso(tu lo estas haciendo)
mas informacion de como crear un elemento en canvas
y por lo ultimo traigo la imagen del origen (yo la saque de google)
function draw() {
var ctx = document.getElementById('canvas').getContext('2d');
var img = new Image();
img.onload = function() {
ctx.drawImage(img, 0, 0);
};
img.src = 'data:image/jpeg;base64,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';
}
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>ejemplo</title>
</head>
<body>
<html>
<body onload="draw();">
<canvas id="canvas" width="150" height="150"></canvas>
</body>
</html>
</body>
</html>
en mi punto personal esta parte del codigo es innecesario:
bannerHeader.imagen=new Image();
bannerHeader.imagen.src=bannerHeader.url;
bannerHeader.imagen.addEventListener("load", cargarBanner());
function cargarBanner()
{
bannerHeader.cargaOK=true;
dibujar()
}
function dibujar()
{
if(bannerHeader.cargaOK=true)
{ctx.drawImage(bannerHeader.imagen,0,0)}
}
si la puedes hacer como yo lo hize