Resizing a .png image when drawing it to the HTML5 canvas using JavaScript

Hi,

I am trying to draw a few .png images to the HTML5 canvas using JavaScript. I currently have a function that will draw an image to the canvas, but the image is too large for the canvas, so only part of it displays.

The function I currently have is:

[CODE]function drawImage(x, y){
var numberImage = new Image();
numberImage.src = imageSource;
context.drawImage(numberImage, x, y);

}[/CODE]

and I call the function by using:

[CODE]var image1 = new Image();

image1.onLoad = function(){
context.drawImage(image1, 50, 50);
};
image1.src=”1.png”;[/CODE]

I was just wondering if anyone knows of a way of resizing an image when it’s drawn to the canvas, so that I could just a thumbnail sized image?

Thanks in advance!

Also in #JavaScript _↴