Menu
Hello:
I am working with JQuery, and drawing images using Canvas (drawImage, translate, rotate) I am trying to draw an image and maintain its scale or aspect ratio so the image does not become distorted.
I have been working on a problem for many days now, I am writing a smartphone app and am having a problem displaying an image to scale, but also using the most area of the screen as possible.
For example:
-If the image is taller than it is wide and the phone is in portrait “tall” mode, then the image only has to be scaled, not rotated.
-If the image is taller than it is wide and the phone is in landscape “wide” mode, the image must be rotated and then scaled in order to maximize the displayed size
-If the image is wider than it is tall and the phone is in portrait mode, then the image has to be rotated and scaled.
-If the image is wider than it is tall and the phone is in landscape mode, then the image has to be only scaled, not rotated.
Seems simple enough, but I can’t get it to work out at all. Does anyone have an example code which would do this?
Thank you.