Jump to content
xisto Community
sonoftheclayr

How Do I Resize An Image On The Fly?

Recommended Posts

I was wondering how I would go about resizing an image from a databse without saving it to a file.

<?include("settings.inc.php");$get_a=$_GET['a'];$get_b=$_GET['b'];$get_width=$_GET['width'];$get_height=$_GET['height'];$query="SELECT * FROM $get_a WHERE id='$get_b'";$result=mysql_query($query);$image=mysql_result($result,0,"coverimg");$size=mysql_result($result,0,"imagesize");$type=mysql_result($result,0,"imagetype");header("Content-length: $size");header("Content-type: $type");echo $image;?>

Obviously the image I want to resize is $image.
The page name would go something like this: ?a=books&c=1&width=200&height=300.

I would like to resize the image without saving it to file using the variables $get_width and $get_height as the width and height of the resized image.

Does anybody have any ideas that might help?

Share this post


Link to post
Share on other sites

I was wondering how I would go about resizing an image from a databse without saving it to a file.

<?include("settings.inc.php");$get_a=$_GET['a'];$get_b=$_GET['b'];$get_width=$_GET['width'];$get_height=$_GET['height'];$query="SELECT * FROM $get_a WHERE id='$get_b'";$result=mysql_query($query);$image=mysql_result($result,0,"coverimg");$size=mysql_result($result,0,"imagesize");$type=mysql_result($result,0,"imagetype");header("Content-length: $size");header("(anti-spam-content-type:) $type");echo $image;?>

Obviously the image I want to resize is $image.
The page name would go something like this: ?a=books&c=1&width=200&height=300.

I would like to resize the image without saving it to file using the variables $get_width and $get_height as the width and height of the resized image.

Does anybody have any ideas that might help?

Well, the example from PHP.net is as good as I can explain so here it is:

Example 1. Resizing an image
This example will display the image at half size.

<?php// File and new size$filename = 'test.jpg';$percent = 0.5;// Content typeheader('(anti-spam-content-type:) image/jpeg');// Get new sizeslist($width, $height) = getimagesize($filename);$newwidth = $width * $percent;$newheight = $height * $percent;// Load$thumb = imagecreatetruecolor($newwidth, $newheight);$source = imagecreatefromjpeg($filename);// Resizeimagecopyresized($thumb, $source, 0, 0, 0, 0, $newwidth, $newheight, $width, $height);// Outputimagejpeg($thumb);?>
The image will be output at half size, though better quality could be obtained using imagecopyresampled().

You'll need to be sure to use the right image create function for the image type being used.
Change imagecreatefromjpeg to the correct image format. This will probably require some kind of conditional statement or switch.

This process simply makes the image 1/4 the size it was originally. The example says that the image is half size but it is half as tall AND half as wide. So half of half is a quarter.

You probably want to have your thumbnails all the same size so a percentage calculation won't really work. You also won't want you images to lose their ratios where they may get squished or stretched. You'll need to base the image size on the original dimensions of the image.
First you'll need to get the height and width of the original image.
imagesx() to get the width.
imagesy() to get the height.

$orig_width = imagesx($source);$orig_height = imagesy($source);

Then you need to do some calculations. Let's say that you want your thumbnails to be 100px tall.

$orig_width = imagesx($source);$orig_height = imagesy($source);First we figure out the reduction percentage.$reduction_percentage = $get_width / $orig_width;$newwidth = $orig_width * $reduction_percentage;$newheight =  = $orig_height * $reduction_percentage;

Now if your original image was 600W X 800H and you asked for 100px wide then the thumbnail would be:
100W X 133H.
1200W X 1600H = 100W X 133H
500W X 600H = 100W X 120H
300W X 350H = 100W X 116H
700W X 800H = 100W X 114H

But what if you has a photo in the landscape orientation?
1600W X 1200H = 100W X 75H
500W X 400H = 100W X 80H
700W X 300H = 100W X 43H
900W X 600H = 100W X 67H

This may leave you with images that are too short and as a result too small overall!

You may want to add an option to check to see which dimension is larger, the height or width. Then base the thumbnail on on the larger measurement. Maybe use a minimum height calculation. This way your thumbnails will be more uniform and easier to view by the user.

I am concerned about one thing though. You said that you don't want to save the image. If you will be generating many resized images, then your server performance will be impacted. Consider how long it takes you computer to resize an image in PhotoShop or any other graphics editor. Imagine if you did the possibly a thousand times a minute. You computer would be unbelievable slow. The same with the server and if you are sharing a server with other accounts as you probably are, then you may get booted off by your service provider because you keep tying up or crashing the server. Your site may not work at all if you get too many visitors trying to view resized images all at once.
The better method is to save the thumbnail on the server. They don't take much storage space because they are so small. That's the whole point. You will use more storage over all but it will give you much better performance in the end. Bandwidth usage will be the same with either method!

You don't have to go to the trouble of thumbnailing everything manually.
Just have your script check to see if that image has a thumbnail. If it does, then load that image otherwise, create a new thumbnail, save it and then load it.

I use this method to save server resources myself but with a delay system. I'm working on a dynamic signature image generator that is near real-time. It has a buffer added to it so that the image is only refreshed every 20 minutes and then only if it is requested. The signature displays game statistics which don't need to be updated in real-time.

Just remember, servers are very good at serving files like image files. They can do other processes but they can server faster than create.

Hope This Helps. :(

vujsa

Share this post


Link to post
Share on other sites

I was wondering how I would go about resizing an image from a databse without saving it to a file.

<?include("settings.inc.php");$get_a=$_GET['a'];$get_b=$_GET['b'];$get_width=$_GET['width'];$get_height=$_GET['height'];$query="SELECT * FROM $get_a WHERE id='$get_b'";$result=mysql_query($query);$image=mysql_result($result,0,"coverimg");$size=mysql_result($result,0,"imagesize");$type=mysql_result($result,0,"imagetype");header("Content-length: $size");header("Content-type: $type");echo $image;?>

Obviously the image I want to resize is $image.
The page name would go something like this: ?a=books&c=1&width=200&height=300.

I would like to resize the image without saving it to file using the variables $get_width and $get_height as the width and height of the resized image.

Does anybody have any ideas that might help?
Hi I use the following code to resize images of any size to the size that i need.
<?php//$width: image width//$height: image height//$target: target image width or heightfunction imageResize($width, $height, $target) {if ($width > $height) {	$percentage = ($target / $width);} else {	$percentage = ($target / $height);}$width = round($width * $percentage);$height = round($height * $percentage);return " width=\"$width\" height=\"$height\"";}// source image$photo="images/anyphoto.jpg";// populate attributes obtained from the image  $PropImg = array(0,0,0,"");$PropImg = GetImageSize($photo);if (isset($PropImg[0])) $nW = $PropImg[0];else $nW = 100;if (isset($PropImg[1])) $nH = $PropImg[1];else $nH = 100;// generate html img tag$Img="<img border='0' hspace='3' align='left'";$Img.=" src=\"" . $photo . "\""  . imageResize($nW,$nH, 220) . ">";// show the imgecho $Img;?>

Very simple but function very well :(

Best regards,

Share this post


Link to post
Share on other sites

I was wondering how I would go about resizing an image from a databse without saving it to a file.

<?include("settings.inc.php");$get_a=$_GET['a'];$get_b=$_GET['b'];$get_width=$_GET['width'];$get_height=$_GET['height'];$query="SELECT * FROM $get_a WHERE id='$get_b'";$result=mysql_query($query);$image=mysql_result($result,0,"coverimg");$size=mysql_result($result,0,"imagesize");$type=mysql_result($result,0,"imagetype");header("Content-length: $size");header("Content-type: $type");echo $image;?>

Obviously the image I want to resize is $image.
The page name would go something like this: ?a=books&c=1&width=200&height=300.

I would like to resize the image without saving it to file using the variables $get_width and $get_height as the width and height of the resized image.

Does anybody have any ideas that might help?

Another way to do this is by setting the image width and height as 100 percent inside the <img> tag. The browser then resizes the image according to the window's size, and with Javascript by using document.body.clientWidth and document.body.clientHeight that returns the width and height of the active window, and one function for the On_Load event which sets the image width and height and other to the onresize event which refresh the page.

BTW, i dont test this with Firefox but i guess it will work.

Best regards,

Share this post


Link to post
Share on other sites

I would like to resize the image without saving it to file using the variables $get_width and $get_height as the width and height of the resized image.

 


this is the script that I use to resize image..

 

<?php$a = "images/".$_GET['src'];$b = $_GET['w'];$ext = explode(".",$_GET['src']);$ext = end($ext);$ext = strtolower($ext);if ($ext == "jpg") { header ("Content-type: image/jpeg"); }else if ($ext == "gif") { header ("Content-type: image/gif"); }else if ($ext == "png") { header ("Content-type: image/png"); }if ($ext == "jpg") { $img_src=imagecreatefromjpeg($a); }else if ($ext == "gif") { $img_src=imagecreatefromgif($a); }else if ($ext == "png") { $img_src=imagecreatefrompng($a); }$size = getimagesize($a);if ($b >= $size[0]) $b = $size[0];$c = round($b * $size[1] / $size[0]);$img_dst=imagecreatetruecolor($b,$c);imagecopyresampled($img_dst, $img_src, 0, 0, 0, 0, $b, $c, $size[0], $size[1]);if ($ext == "jpg") { imagejpeg($img_dst, "", 100); }else if ($ext == "gif") { imagegif($img_dst); }else if ($ext == "png") { imagepng($img_dst); }imagedestroy($img_dst);?>

using my script, the image will show with ?src=image_name&w=image_width

the images are store in /images directory..

 

this is the example:

real image

resized image

Share this post


Link to post
Share on other sites

this is the script that I use to resize image..

 

<?php$a = "images/".$_GET['src'];$b = $_GET['w'];$ext = explode(".",$_GET['src']);$ext = end($ext);$ext = strtolower($ext);if ($ext == "jpg") { header ("Content-type: image/jpeg"); }else if ($ext == "gif") { header ("Content-type: image/gif"); }else if ($ext == "png") { header ("Content-type: image/png"); }if ($ext == "jpg") { $img_src=imagecreatefromjpeg($a); }else if ($ext == "gif") { $img_src=imagecreatefromgif($a); }else if ($ext == "png") { $img_src=imagecreatefrompng($a); }$size = getimagesize($a);if ($b >= $size[0]) $b = $size[0];$c = round($b * $size[1] / $size[0]);$img_dst=imagecreatetruecolor($b,$c);imagecopyresampled($img_dst, $img_src, 0, 0, 0, 0, $b, $c, $size[0], $size[1]);if ($ext == "jpg") { imagejpeg($img_dst, "", 100); }else if ($ext == "gif") { imagegif($img_dst); }else if ($ext == "png") { imagepng($img_dst); }imagedestroy($img_dst);?>

using my script, the image will show with ?src=image_name&w=image_width

the images are store in /images directory..

 

this is the example:

real image

resized image

 

Well done, but, i take the liberty to optimize your code :) here is my version:
<?php$a = "images/".$_GET['src'];$b = $_GET['w'];$ext = explode(".",$_GET['src']);$ext = end($ext);$ext = strtolower($ext);$size = getimagesize($a);if ($b >= $size[0]) $b = $size[0];$c = round($b * $size[1] / $size[0]);$img_dst=imagecreatetruecolor($b,$c);if ($ext == "jpg") { header ("Content-type: image/jpeg"); $img_src=imagecreatefromjpeg($a);imagecopyresampled($img_dst, $img_src, 0, 0, 0, 0, $b, $c, $size[0], $size[1]);imagejpeg($img_dst, "", 100); }else if ($ext == "gif") { header ("Content-type: image/gif"); $img_src=imagecreatefromgif($a);imagecopyresampled($img_dst, $img_src, 0, 0, 0, 0, $b, $c, $size[0], $size[1]);imagegif($img_dst);}else if ($ext == "png") { header ("Content-type: image/png"); $img_src=imagecreatefrompng($a);imagecopyresampled($img_dst, $img_src, 0, 0, 0, 0, $b, $c, $size[0], $size[1]);imagepng($img_dst); }imagedestroy($img_dst);?>
Best regards,

Share this post


Link to post
Share on other sites

I know the article I am going to link here is a little out of context, but I wanted to show this to the community we have here. I am a usual haunt at the 'A List Apart' website, and I found this article.

http://alistapart.com/article/magazinelayout

It deals with automatic resizing functions when there are a set of images. All the images would be auto resized and it would be presented in a nifty magazine like layout. I have not used the scripts, but I found it quite intriguing.

Share this post


Link to post
Share on other sites

If you want to do things quickly, just use the phpThumb library. Get it from http://phpthumb.sourceforge.net/

Yeah, excellent share, never know about this resource, almost because i'm a big fan of sourceforge and always research in it.

best regards,

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

×
×
  • Create New...

Important Information

Terms of Use | Privacy Policy | Guidelines | We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.