Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    Senior Coder
    Join Date
    Jun 2008
    Location
    Cornwall
    Posts
    2,099
    Thanks
    297
    Thanked 12 Times in 12 Posts

    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
    Last edited by LJackson; 10-11-2012 at 12:58 PM.

  • #2
    Senior Coder
    Join Date
    Jan 2011
    Location
    Missouri
    Posts
    4,598
    Thanks
    24
    Thanked 646 Times in 645 Posts
    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.

  • #3
    Senior Coder
    Join Date
    Jun 2008
    Location
    Cornwall
    Posts
    2,099
    Thanks
    297
    Thanked 12 Times in 12 Posts
    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

  • #4
    Senior Coder
    Join Date
    Jan 2011
    Location
    Missouri
    Posts
    4,598
    Thanks
    24
    Thanked 646 Times in 645 Posts
    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));
    	  }

  • #5
    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
    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


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •