canvas size

gistfile1.txt

 Source: http://stackoverflow.com/questions/22387627/how-to-save-an-image-in-its-original-size-in-a-canvas-after-scaled-the-canvas
 
 The size you set with the width and height properties will be the image's final size.

canvas.width = 1920;              // actual size given with integer values
canvas.height = 1080;
If you need to scale down while on screen you need to use CSS (one of those special cases):

canvas.style.width = '960px';     // show at 50% on screen
canvas.style.height = '540px';
Alternatively have your actual image as an off-screen canvas and copy regions from that to the on-screen canvas depending on scale etc.

If you edit your image at a lower than the actual resolution then the point of HD etc. is gone as you need to scale up a lower resolution image to a bigger one which will make it appear more blurry due to the introduced interpolation. Always work at the actual target resolution when working with digital images (or video).

Then use toDataURL() to get the image:

var dataUri = canvas.toDataURL(); // saves a PNG at 1920x1080
for JPEG:

var dataUri = canvas.toDataURL('image/jpeg', 0.8);  // last = quality
Just be aware of that your mouse positions will have to be scaled the opposite way as they are relative to the canvas element and not its bitmap.