javascript - Canvas Rotation+Scaling -


i need rotate image in canvas , simultaneously resize make sure corners of canvas not remain empty. solution should similar aviary in "crop, resize & rotate" example.

i think solution combine functions of rotation , resize of canvas, can not find concrete solution problem , didn't find exaustive example on web.

any advice helpful

thanks

i have not had @ example have given gave detailed answer on problem of fitting rotated image onto canvas there no blank spaces.

there math involved (go figure) basic trigonometry , provided explanation of how done. there 2 solutions, 1 finds min scale fit canvas rotation , other find min scale fit canvas particular rotation.

it assumed image centered, if not there easy way adapt code provided supplying abstract canvas size rotated image centered on abstract canvas.

so if center of image @ x = 100, y = 100 , canvas canvaswidth = 300, canvasheight = 300 use abstract size of abscanvaswidth = (canvaswidth - x) * 2; , image @ x = abscanvaswidth/2 same height. fit rotated, translated image fill canvas.

the answer code can found question after rotate, draw image @ correct position


Comments

Popular posts from this blog

javascript - jQuery: Add class depending on URL in the best way -

caching - How to check if a url path exists in the service worker cache -

Redirect to a HTTPS version using .htaccess -