Short Like A Fox

So you want to break one large image into multiple smaller images? No problem. This may seem like an obscure problem, but there are multiple reasons you’d want to do this. Maybe you want to create a visual sliding puzzle. Or maybe you are running a unique WordPress theme. Or maybe you want to create a collage of some kind. It really doesn’t matter why you want to split an image into smaller image, PHP makes this task easy. The example below only deals with jpegs. Changing the function to deal with other types of images wouldn’t be that hard.

<?php
//This function will split an image into a number of equally sized columns and rows.
function split_image($number_of_rows, $number_of_cols, $path_to_image, $file_name){

//$number_of_rows = # of rows you want;
//$number_of_cols = # of cols you wnat
//$path_to_image = the path to the folder the image is in, something like: /home/content/username/html/list/uploads/
//$file_name = The filename of the image: archery.jpg, etc.

// parse path for the extension
$info = pathinfo($path_to_image . $file_name);

//make sure we are dealing with a jpeg
if ( (strtolower($info['extension']) == ‘jpg’) || (strtolower($info['extension']) == ‘jpeg’) ){

// load image and get image size
$source = imagecreatefromjpeg( "{$path_to_image}{$file_name}" );
$width = imagesx( $source ); //Find the width
$height = imagesy( $source ); //Find the height
$segment_width = $width/$number_of_cols; //Determine the width of the individual segments
$segment_height = $height/$number_of_rows; //Determine the height of the individual segments

for( $col = 0; $col < $number_of_cols; $col++)
{

for( $row = 0; $row < $number_of_rows; $row++)
{

$fn = sprintf( "img%02d_%02d.jpg", $col, $row );
echo( "$fn" ); //I print the image name here, so that the process shows itself as it runs
$im = @imagecreatetruecolor( $segment_width, $segment_height );
imagecopyresized( $im, $source, 0, 0, $col * $segment_width, $row * $segment_height, $segment_width, $segment_height, $segment_width, $segment_height );
$file = "test.jpg";
//Save the images
if(imagejpeg( $im,"INSERT DESTINATION HERE ", 100 )) //The destination will be something like/home/content/c/h/d/images/$fn

echo("Has been made!<br/>");

}

}

}

}

?>

So you want to create a thumbnail from a given image… PHP makes this task easy. I first wrote the function below to deal with images uploaded by users at a site I help administer. Uploaded images to this site can be jpegs, pngs, or gifs, so I had to write a function to deal with all three. This code is originally based off of a function found at webcheatsheet.com

How to Do It:

function createThumbs( $pathToImages, $fname, $pathToThumbs, $thumbWidth )
{

// parse path for the extension

$info = pathinfo($pathToImages . $fname);
// continue only if this is a JPEG image
if ( (strtolower($info['extension']) == ‘jpg’) || (strtolower($info['extension']) == ‘jpeg’) )
{

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

// calculate thumbnail size
$new_width = $thumbWidth;
$new_height = 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, $img, 0, 0, 0, 0, $new_width, $new_height, $width, $height );

// save thumbnail into a file
imagejpeg( $tmp_img, "{$pathToThumbs}{$fname}" );

}

if ( strtolower($info['extension']) == ‘gif’ )
{

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

// calculate thumbnail size
$new_width = $thumbWidth;
$new_height = 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, $img, 0, 0, 0, 0, $new_width, $new_height, $width, $height );

// save thumbnail into a file
imagegif( $tmp_img, "{$pathToThumbs}{$fname}" );

}

if ( strtolower($info['extension']) == ‘png’ )
{

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

// calculate thumbnail size
$new_width = $thumbWidth;
$new_height = 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, $img, 0, 0, 0, 0, $new_width, $new_height, $width, $height );

// save thumbnail into a file
imagepng( $tmp_img, "{$pathToThumbs}{$fname}" );

}

}

How This Works

The function createThumbs takes four arguments.

• $pathToImages -> The path to the folder the image file is in. It might look something like this: /home/content/username/html/list/uploads/
• $fname -> The filename: pic1.gif, johnny.jpg, etc…
• $pathToThumbs -> The path to the folder you want the thumbnail image to be in. You DO NOT want this to be the same path as $pathToImages, because the thumbnail image will have the same name as the original image.
• $thumbWidth -> The width that you want the thumbnail to be in pixels.

An important note that I should make here is that this function has nothing in place, other than the file extension check, to make sure that the image files contain nothing malicious. Since the files createThumbs() works with have already been uploaded it is assumed that the files have been properly scrutinized.

The first thing createThumbs() does is call pathinfo(). pathinfo() breaks the parts of a path into an array. This is useful to us, because we need the file extension to properly create the thumbnail. Next createThumbs() checks to see if we are dealing with a jpeg. If the original file is a jpeg createThumbs creates a new image based on the original image with imagecreatefromjpeg(). The next step is to get the width and height of this image (imagesx(), imagesy()). Using $thumbWidth and the ratio of the original width and height createThumbs() sets the new width and height of the thumbnail. Using these new ratios createThumbs() creates a "blank" image that will be the same width and height of the thumbnail with imagecreatetruecolor(). imagecopyresized() is used to resize the image and save it in the "blank" just created. imagecopyresized() might seem like it takes a lot of parameters, but if you take a look at the documentation it really isn’t that complicated. Now that the thumbnail exists as a true color image all createThumbs needs to do is convert the file into a jpeg. To do this imagejpeg() is called.

That’s how the function works for jpegs. There are minimal differences for .pngs and .gifs.