Go Back   CodingForums.com > :: Server side development > PHP

Before you post, read our: Rules & Posting Guidelines

Reply
 
Thread Tools Rate Thread
Enjoy an ad free experience by logging in. Not a member yet? Register.
Old 10-10-2012, 09:30 PM   PM User | #1
LJackson
Senior Coder

 
Join Date: Jun 2008
Location: Cornwall
Posts: 1,973
Thanks: 289
Thanked 12 Times in 12 Posts
LJackson is on a distinguished road
Exclamation thumbnail script is producing poor quality thumbs please help

Hi All,
i have a thumbnail generator function

PHP Code:
function createThumbs$pathToImages$pathToThumbs$thumbWidth )
{
  
// open the directory
  
$dir opendir$pathToImages );

  
// loop through it, looking for any/all JPG files:
  
while (false !== ($fname readdir$dir ))) {
    
// parse path for the extension
    
$info pathinfo($pathToImages $fname);
    
// continue only if this is a JPEG image
    
if ( strtolower($info['extension']) == 'jpg' )
    {
      
#echo "Creating thumbnail for {$fname} <br />";

      // load image and get image size
      
$img imagecreatefromjpeg"{$pathToImages}{$fname}" );
      
$width imagesx$img );
      
$height imagesy$img );

      
// calculate thumbnail size
      
$new_width $thumbWidth;
      
$new_height $thumbWidth;#floor( $height * ( $thumbWidth / $width ) );

      // create a new temporary image
      
$tmp_img imagecreatetruecolor$new_width$new_height );

      
// copy and resize old image into new image
      
imagecopyresized$tmp_img$img0000$new_width$new_height$width$height );

      
// save thumbnail into a file
      
imagejpeg$tmp_img"{$pathToThumbs}{$fname}" );
    }
  }
  
// close the directory
  
closedir$dir );
}
?> 
the thumbnails that are created are created by resizing the width and height to a set size 148px in my case. so it creates a square.

now because its just resizing the images they are distorted and dont look as good as they could/should. i looked on facebooks gallery and they have a square thumbnail image similar to mine but it is perfect no stretched images and the main part of the image is always in shot and quite close up.

so my question is how do i modify the above function to produce better quality thumbnails?

many thanks
Luke
__________________
Kernow Connect: Online Shopping, Price Comparison, Maximum Savings On Top UK Stores
Follow Us On: Twitter | Facebook

Last edited by LJackson; 10-11-2012 at 11:58 AM..
LJackson is offline   Reply With Quote
Old 10-11-2012, 04:29 PM   PM User | #2
sunfighter
Senior Coder

 
Join Date: Jan 2011
Location: Missouri
Posts: 2,387
Thanks: 18
Thanked 350 Times in 349 Posts
sunfighter is on a distinguished road
This line
Code:
$new_height = $thumbWidth;#floor( $height * ( $thumbWidth / $width ) );
sets your height to equal your width, but if you remove $thumbWidth; of $new_height = $thumbWidth; and replace it with the section that's commented out
Code:
floor( $height * ( $thumbWidth / $width ) );
You should get what you want.

You might have to change the dimensions of the displayed thumb nail to make it square and uniform again.
sunfighter is offline   Reply With Quote
Old 10-11-2012, 07:02 PM   PM User | #3
LJackson
Senior Coder

 
Join Date: Jun 2008
Location: Cornwall
Posts: 1,973
Thanks: 289
Thanked 12 Times in 12 Posts
LJackson is on a distinguished road
hi mate thanks for your reply,

i did what you suggested and it does improve the quality but the image heights are all different some are less than the required 148px.

should i find out whether the image is portrait or landscape and then perform the above suggestion on either the height or width depending on which is longer?

then i would need to crop them so that they are square again? is this correct
thanks

Luke
__________________
Kernow Connect: Online Shopping, Price Comparison, Maximum Savings On Top UK Stores
Follow Us On: Twitter | Facebook
LJackson is offline   Reply With Quote
Old 10-12-2012, 05:31 PM   PM User | #4
sunfighter
Senior Coder

 
Join Date: Jan 2011
Location: Missouri
Posts: 2,387
Thanks: 18
Thanked 350 Times in 349 Posts
sunfighter is on a distinguished road
Yes you need to crop the larger than 148px. Easy way is to put image into a div with these dimensions. If you have to move the image around in the div use relative posioning on the image.
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>None</title>
<style type="text/css">
#thumb
{
	width: 148px;
	height: 148px;
	overflow: hidden;
}
img{
position:relative;
	top: -7px;
	left: -4px;
}
</style>
</head>
<body>
<div id="thumb">
	<img src="images/BamburghInNorthumbria.JPG" height="" width="" alt="">
</div>
</body>
</html>
As for the smaller than 148 height try subbing this for the calculate thumbnail size
Code:
      // calculate thumbnail size
	  if($height/$width >= 1){
	      $new_width = $thumbWidth;
	      $new_height = floor($height * ($thumbWidth /$width ));	  	
	  }else{
	  	$new_height = $thumbWidth;
		$new_width = floor($width * ($thumbWidth /$height));
	  }
sunfighter is offline   Reply With Quote
Old 10-14-2012, 05:29 AM   PM User | #5
Len Whistler
Senior Coder

 
Len Whistler's Avatar
 
Join Date: Jul 2002
Location: Vancouver, BC Canada
Posts: 1,323
Thanks: 26
Thanked 100 Times in 100 Posts
Len Whistler is on a distinguished road
I'm not sure of the exact syntax but I would also consider setting the jpg quality settings - maybe try a 90. The quality would be the last change made to an image, just before saving it.

Quick example - will need research for correct syntax.
PHP Code:
// save thumbnail into a file
imagejpeg($tmp_img,NULL,90); // image quality 0-100
imagejpeg$tmp_img"{$pathToThumbs}{$fname}" ); 


-------
__________________
Leonard Whistler
Len Whistler is offline   Reply With Quote
Reply

Bookmarks

Jump To Top of Thread


Thread Tools
Rate This Thread
Rate This Thread:

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT +1. The time now is 12:04 AM.


Advertisement
Log in to turn off these ads.