Question

I have been looking around and would like to know what everyone uses to resize images in case I am missing out.

I am using php imageGD library imagejpeg() ect.

I have continually updated my class to try and “Solve” this one situation:

If an image a user uploads is say 469×358 and the display end picture needs to be or is designed to fit within a 120×80 box for instance. If i resize based upon width the resulting resized image will be 120×92, i could just then fix the height but that will pixelate or squash the image, i could also crop the end off with either imageGD or css overflow hidden.

I have had a quick look and seen that there are algorithms(bicubic ect) that you can use to shrink an image which sharpens it so it doesnt look squashed, which is the continual effect i seem to get with imageGD. Has anyone used this algorithm?

I have also seen ImageMagick has anyone used this software? Does it shrink an image better?

I am currently cropping the end off with overflow hidden, but is there a better way?

Answer 1

If an image a user uploads is say
469×358 and the display end picture
needs to be or is designed to fit
within a 120×80 box for instance. If i
resize based upon width the resulting
resized image will be 120×92, i could
just then fix the height but that will
pixelate or squash the image, i could
also crop the end off with either
imageGD or css overflow hidden.

If your image was 358×469 (portrait) and you want to resize it to 120×80 so that the image does not look distorted, here is the math:

358/469 = width/80 => width = 358*80/469 = 61px (approx)

We had a taller image we’ll use maximum height and constrained width. A desired width of 120px means the image is stretched horizontally; with a better algorithm you can only achieve smoothness but you cannot make a squashed/stretched image look normal with a better algorithm.

If fitting is required, I suggest that you crop-to-fit of resize-to-fit. You can do this on the server side via GD library/ImageMagick or on the client side using CSS background positioning. If you’re using GD, cropping is as simple as resizing the image with negative offsets (somewhat similar to CSS background positioning with negative background-position).

Edit 1

If it is a question of whether to use GD or IM, I’d suggest IM. I am not sure about the quality of output but as far as performance is concerned, IM will outperform GD, specially when you are dealing with high resolution images. In case you prefer GD, the GD library function imagecopyresampled will give you better results compared to imagecopyresized but higher CPU and/or memory usage.

Edit 2

I forgot to mention, I stopped using GD long time ago and switched to phpThumb. Takes care of most of the chores. Internally it uses GD and/or IM — built-in intelligence lets it select the best available method for a given operation.