How to get the aspect ratio of an image?
I have an image that is:
320 original width
407 original height
I want to let users resize the image via a form I am building on a webpage. They can adjust either the width or height. When they do the other dimension should auto adjust to maintain the aspect ratio.
When a user updates the width field I get the adjusted height like so:
aspect ratio = original width ÷ original height
adjusted height = <user chosen width> ÷ aspect ratio
Is this correct?
Also how to get the adjusted width when the user changes the height field? I know it should be simple enough but I just can't figure it out.
Yes, this is correct – though it unnecessarily uses two divisions instead of one division and a multiplication, adjusted height = <user-chosen width> * original height / original width
.
The corresponding formula for the adjusted width is adjusted width = <user-chosen height> * original width / original height
, or if you want to do it your way, adjusted width = <user-chosen height> * aspect ratio
, with aspect ratio
calculated as before.
Yes. You said you want the aspect ratio of the adjusted image to be the same as the aspect ratio of the original equation, so you want
$\frac{\text{adjusted width}}{\text{adjusted height}} = \frac{\text{original width}}{\text{original height}}$
Multiplying both sides of the equation by the adjusted height, you get
$\text{adjusted width} = \frac{\text{original width}}{\text{original height}} \cdot \text{adjusted height}$
Then, dividing both sides of the equation by $\frac{\text{original width}}{\text{original height}}$, you get
$\text{adjusted width } / \frac{\text{original width}}{\text{original height}} = \text{adjusted height},$
which is the formula you suggested!
So, how do you get the adjusted width when the user adjusts the height field? The answer is hidden in the reasoning above! Can you find it?
Yes, this is the formula: Aspect Ratio = Width / Height for example:
-
Width = 300
- Height = 150
Aspect Ratio = 2/1 (or 2:1)
if we want to calculate new object size, you need to have a new object dimension like height, or width to calculate remaining one preserving aspect ratio. let's say we have:
-
New Height = 300
- Aspect Ratio = 2/1
New Width = ? Knowing that, or fractions should look like that: 300 / New Width = 2 / 1 => New Width = 150 Or you can calculate your new measurements using this online aspect ratio calculator that do the job for you and can calculate: aspect ratio, number of pixels (if is image) and new dimensions for objects or images keeping its aspect ratio.