The art of thumbnails

August 10, 2009 by nuno costa 16 comments

Thumbnails

Resizing images is probably the most common image manipulation action on the web, and phMagick has great support for it, including run time or on the fly thumbnail generation

The first example is for offline thumbnailing

1
2
3
    include "phMagick.php";
    $p = new phMagick('source.png','destination.png');
    $p->resize(200,150);

resize_200_150

In this example source.png will be resized to 200px wide by 150px tall and saved as destination.png.
If only one measure is specified the image will be resized proportionally to that measure

As the aspect ratio of the image is maintained the new image might not be the exact size specified, for those occasions when the exact size is needed a handy function is provided

1
2
    $p = new phMagick('source.png', 'destination.png');
    $p->resizeExactly(133,100);
 
resize_133_100
 
phMagick will try to create an image exactly 133px wide by 100px tall. Internally phMagick resizes the image to the smallest dimension (100px tall) and then crops the image from the center in a 133×100 square

On the fly or run time thumbnails

If you are a web developer I’m certain you are familiar with the DIS (Designers Indecision Syndrome), where designers in the strive for the perfect design change specs a lot, a image that now is 250px by 150px tomorrow will be 130px 100px.

If your site has 500 or more images, creating thumbnails for all of them is quite a time consuming task. phMagick has the ability to generate thumbnails at run time and is smart enough to only generate the thumbnail if it doesn’t exist

1
2
3
    $p = new phMagick();
    $imageUrl = $p->onTheFly('images/source.jpg', 150,100);
    echo '< img alt="" src="' . $imageUrl . '" />';

This example creates a thumbnail of source.jpg and returns the url in a format that can be used directly in html. The url will be “images/150_100_source.jpg” this way phMagic knows if the thumbnail already exists and won’t create a new one, it will simply return the url of the existing one.

This can be a very powerful technique as it frees you from manually or programmatically create each thumbnail that will be needed, it’s also very fast as it only creates the thumbnail once, and gives you the liberty experiment with the layout and thumbnail sizes without having any hassle

 

16 comments so far Add Your Comment

  1. by Kathy Monnot on September 30 2009 at 02:12

    I need to query mysql database to pull out pdf’s and convert them to jpeg for a link thumbnail rollover.. Can you do this???
    thanks

  2. by nuno costa on October 3 2009 at 13:47

    Hi Kathy

    Sorry for the late response, but I’ve just arrived from my holidays.

    Yes, I can do what you asked for, but it will be a paid task.

    If you are still interested please let me know

    King Regards

  3. by Barat on October 5 2009 at 09:43

    Hi Nuno, Nice job !

    I’m interrested by resizing pictures without ratio like “Cut the Image to Fit” visible here http://www.imagemagick.org/Usage/thumbnails/#cut .
    If I understand we can make it with resizeExactly() method, isn’t it ?
    I hink it’s good to put this in this page !

    Thanks !

  4. by nuno costa on October 9 2009 at 09:56

    Thanks for making that clear barat

  5. by Sreedhar on October 12 2009 at 16:04

    Hi Nuno,

    Great job!

    I am getting errors executing the onTheFly function for generating thumbnails. I have downloaded the latest version of phmagick from the site (http://www.francodacosta.com/blog/phmagick/download).

    Here is the code for generating a thumbnail image for an image.

    debug=true;

    $imageUrl = $p->onTheFly(“zebra_001.jpg”, 150,100);
    echo ”;

    echo ‘

    ', print_r($p->getLog()) , '

    ‘;
    ?>

    And this the error I am getting while executing the script.

    Fatal error: Uncaught exception ‘Exception’ with message ‘Call to undefined method : onTheFly’ in /var/www/phmagick/phmagick.php:202 Stack trace: #0 [internal function]: phmagick->__call(‘onTheFly’, Array) #1 /var/www/phmagick/test.php(11): phmagick->onTheFly(‘zebra_001.jpg’, 150, 100) #2 {main} thrown in /var/www/phmagick/phmagick.php on line 202.

    Can you please help me out.

    Regards,
    Sreedhar

  6. by nuno costa on October 12 2009 at 16:12

    Sreedhar,

    Do you have the plugins folder? Sometimes when extracting the zip file this folder is no created

  7. by Karl on October 13 2009 at 01:09

    I ran into the same Bug as Sreedhar. It worked after I changed

    $this->setSource($sourceFile);
    $this->setDestination($thumbnailFile);

    to

    $p->setSource($sourceFile);
    $p->setDestination($thumbnailFile);

    and the call to resize from

    $this->resize($width, $height, $exactDimentions);

    to

    $this->resize($p, $width, $height, $exactDimentions);

    Hope that helps.

  8. by Karl on October 13 2009 at 01:11

    Ooops, forgot to mention file and function: This can be found in resize.php in the plugin-Folder and the function is onTheFly.

  9. by nuno costa on October 13 2009 at 14:08

    Thanks Karl

    I will correct it.

    I’m just wondering why the hell didn’t I put the onTheFly() function in my test script?

    shame on me!

  10. by nuno costa on October 14 2009 at 13:14

    There is a new phMagick version, let me know if it solves your problems

  11. by Karl on October 16 2009 at 22:44

    Hi Nuno,

    The new version works for me.

    Cheers.

  12. by Neeraj on November 19 2009 at 10:44

    Hi Guys,

    Facing a strange issue. previously i was using convert function to convert tiff images to jpg so that the GD functions can apply on it.

    But now when i m trying create thumbnail: nothing happens, i mean no error nothing but thumbnail is not generated, tried png, jpg as both source and destination but nothing works.

    Please suggest something here is my code.

    convert();
    $p->resize(250,200);

    ?>

  13. by Neeraj on November 19 2009 at 10:48

    not able to post the code correctly:
    include “phmagick.php”;
    $p = new phMagick(“napster.png”,”dapster.png”);
    $p->resize(250,200);

  14. by nuno costa on November 19 2009 at 19:12

    @Neeraj,

    Please see this article, it will show you how to debug phMagick and see error messages

    http://www.francodacosta.com/blog/phmagick/examples/debugging-phmagick

    If you need help, just mail me or ask here

  15. by enrico on April 23 2010 at 17:42

    Hello Nuno,
    good job with phmagick!

    I’m writing you because i’ve run into a weird problem and i can’t find my way out (didn’t spend lot of time on it cause i’ve thought asking you could have been faster…)

    i’m running this code:

    echo "-- on the fly:";
    $p = new phmagick();
    $imageUrl = $p->onTheFly('source.jpg', 150,10);
    echo '';
    

    and getting this as result:

    -- on the fly:DB Error: connect failed
    

    any idea why?
    DB Error? Am i missing something here?

    thank you for your help (or from any help from readers)!

  16. by nuno costa on May 22 2010 at 17:18

    @enrico,

    It’s quite weird, phmagick doesn’t do any database operations

    have you try to run it in debug mode ?

More from francodacosta.com

© francodacosta.com - All rights reserved