Menu
I am trying to preload a list of images (actually only 2 so far) but am getting the following error:
[COLOR=”#FF0000″][B][I]Uncaught TypeError: Failed to execute ‘drawImage’ on ‘CanvasRenderingContext2D’: No function was found that matched the signature provided.
Here it is my HTML code:
[code=php]<!DOCTYPE HTML>
<html>
<head>
<META NAME=”ROBOTS” CONTENT=”NOINDEX, NOFOLLOW”>
</head>
<!– body onLoad=”initLobby()” style=”margin:0px;border:0px;padding:0px;width:320px;height:340px;” –>
<body onLoad=”PreloadImages();” style=”margin:0px;border:0px;padding:0px;width:320px;height:340px;”>
<canvas id=”the-multiplication-game” width=”320″ height=”340″>
</canvas>
<script type=’text/javascript’ src=’https://cdn.firebase.com/v0/firebase.js’></script>
<script src=”js/util.js”></script>
<script src=”js/lobby.js”></script>
<script src=”js/begin.js”></script>
<script src=”js/userclicked.js”></script>
<!– <script src=”create-rooms.js”></script>
<script src=”themultiplicationgame.js”></script> –>
</body>
</html>
And here it is my JS code:
[code=php]var canvas = document.getElementById(‘the-multiplication-game’);
var context = canvas.getContext(‘2d’);
var myimages = new Array();
var LoadedImages = 0;
var image_list = new Array();
image_list[0] = ‘bg.jpg’;
image_list[1] = ‘game_name.png’;
function PreloadImages()
{
if (document.images)
{
for (var i=0;i<=image_list.length-1;i++)
{
myimages[i] = new Image;
myimages[i].src = “images/”+image_list[i];
myimages[i].onload = function()
{
LoadedImages++;
if (LoadedImages == image_list.length)
for (var j=0;j<=myimages.length-1;j++)
context.drawImage(myimages[j].src,0,0);
}
}
}
}
Any idea about what I am doing wrong?
PS: The error is happening on line [I]context.drawImage(myimages[j].src,0,0);
Thanks!