Resize image before submitting the form HTML5

To resize the image before submitting the form, you need to use the drawImage() method.

Scale the original image and draws the scaled version on the canvas at [0,0]

context.drawImage( img, 0,0,img.width,img.height, 0,0,myWidth,UseHeight );

Above, we saw the following:

Here,

var myWidth = Math.floor( img.width * Scale );
var myHeight = Math.floor( img.height * Scale );

And,

var x = Math.floor( ( world.width - myWidth) / 2 );
var y = Math.floor( ( world.height - myHeight) / 2 );

karthikeya Boyini

Updated on: 29-Jan-2020

225 Views

Kickstart Your Career

Get certified by completing the course

Get Started