CODEWITHSUNDEEP
javascriptcanvasdrawimage
Bryce
Bryce

Reputation: 309

drawImage() isn't working

I am making an app for iPhone and Android using HTML, CSS, and JavaScript with PhoneGap. I'm using HTML5 canvas. My ctx.drawImage(); function isn't working, and I cannot figure out why. Here is my code. 

var imageReady = false;
var image = new Image();
image.onload = function () {
    imageReady = true;
};
image.src = "http://urlToImage.com";
ctx.drawImage(image, 0, 0, 300, 180);

I verified the src link and it worked. Any thoughts? Thanks.

Upvotes: 0

Views: 1234

Answers (1)

user1726343
user1726343

Reputation:

Your drawImage call should be inside the asynchronous callback (which is executed when the image has loaded). Currently it is being invoked before the image is loaded.

var imageReady = false;
var image = new Image();
image.onload = function () {
    imageReady = true;
    ctx.drawImage(image, 0, 0, 300, 180);
};
image.src = "http://urlToImage.com";

Upvotes: 6

Related Questions