Question

For so many time, I have encountered problems with managing image having abnormally long height or width.

If I fixed their height and widht, they will appear streched?

If I fixed their width, and if the height of the image is very long then also it will mess up the overall website.

If I fixed their height, and if the width of the image is very long then also it will mess up the overall website.

The images I save in the local drive are saved maintaining the ratio?
Let say user decides to upload image 1(height)*32(width).
When he uploads this image, the script is made to resize the user uploaded image to height:1000px(just an example)

So the resulting image in 1000px(height)*32000(widht), you see now the image is abnormally large.

Now while displaying this image in a box of 1000px * 1000px, what is the best way to display this image?

Answer 1

If you’re trying to resize the 32×1 image so it fits within a 1000×1000 box, you shouldn’t be resizing the height to be 1000. Instead, you should resize the width to 1000 and the height to 1000/32.

Some example code could be:

define(MAX_WIDTH, 1000);
define(MAX_HEIGHT, 1000);

if ($cur_width / MAX_WIDTH > $cur_height / MAX_HEIGHT)
{
   $new_width = MAX_WIDTH;
   $new_height = (int) ($cur_height * MAX_WIDTH / $cur_width);
}
else
{
   $new_width = (int) ($cur_width * MAX_HEIGHT / $cur_height);
   $new_height = MAX_HEIGHT;
}

This checks which of the dimensions is “bigger” relative to the dimensions of the box and sets $new_width and $new_height appropriately. Make sure to handle weird cases where one of the dimensions gets rounded down to 0 (ie. a 10000×1 image would probably end up as 1000×0).