Html5 Canvas resize

Question

Am using canvas to resize image at the client side and then upload that image to the server. My intention was to resize the image to half of its original dimensions and want

Answer 1

If you are using toDataURL, you can set the second argument to a number between 0.0 and 1.0. This is the JPEG quality level, with 1.0 meaning very high quality and a very large image and nearer to 0.0 meaning lower quality smaller image.

So, for example, you could try:

 data = downsizedCanvas.toDataURL("image/jpeg", 0.2);

Here's a description in the w3c reference: www.w3.org: toDataURL

It looks like there has been a bug in Firefox to do with ignoring the quality, so you might need to test in some modern browsers.