what is the right way to scale down an image in php - php

why is scaling image in php so complicated ? A lot of confusin about
imagecreatetruecolor
imagecreatefromjpeg
imagecopyresampled
imagejpeg - and so on
I simply want to scale down an image - if it's width is over 960px
something like this:
$path = "sbar/01.jpg";
$w = getimagesize($path)[0];
if($w > 960){scale($path, 960, auto);}
what is the simplest way to do this ? Here is my try:
$max = 960;
$h = getimagesize($path)[1];
$ratio = $w/$h;
$new_height = $w/$ratio;
$img = imagecreatetruecolor($max, $new_height);
$image = imagecreatefromjpeg($path);
And what now? There is still no desired image (960 x auto) in $path

There is no "best" way to do it. There are just different ways to do it. If you have an image that is already stored and you want to scale it and then save the scaled version you can simply do this:
$image = imagecreatefromjpeg('test.jpg');
$newImage = imagescale($image, 960, -1);
imagejpeg($newImage, 'scaled_image.jpg');
You first load the image from a given path. Then you scale it (while the image stays in memory). At the end, you save it under the provided path. Done.
The -1 (or if you omit the value altogether) means to only scale the other dimension and keep the aspect ratio.

Related

PHP image cropping: blurry result

I'm using imagecopyresampled to resize (shrink) an image, which happens to be a gif. The image contains text which, when resized, is quite blurry. I wouldn't necessarily mind that, but when displaying the original image on a web page, at the reduced size, my browser scales it down with much nicer results. Any idea what I can do to improve what PHP produces?
UPDATE: Here's an example of the code I'm running:
$x1 = 0;
$y1 = 0;
$w1 = 196;
$h1 = 260;
$x2 = 0;
$y2 = 0;
$w2 = 140;
$h2 = 186;
$r1 = imagecreatefromgif($source);
$r2 = imagecreatetruecolor($w2, $h2);
imagealphablending($r2, false);
imagesavealpha($r2, true);
$res = imagecopyresampled($r2, $r1, $x2, $y2, $x1, $y1, $w2, $h2, $w1, $h1);
imagegif($r2, $dest);
Here's an example of the image scaled by the browser:
Here's an example of the image scaled with the above code:
Try to use imagepng instead of imagegif. imagepng third parameter is quality. Check specs: http://php.net/manual/en/function.imagepng.php
The PHP libraries aren't going to produce the best quality resize operation however you may find you have better results if you stick to a ratio based on the original file such that resizing a 200x200 to 100x100 or 50x50 would be find as its easy maths for the process to handle (i.e. merge 2/4 pixels into one). Your current operation is producing blurry results as it'll be a random value such as scaling to 0.63% of the original size.

How to restrict image width or height on upload

I would like manipulate/resize images in a similar way to Pinterest but I am not sure what is the best way to approach it. The goal is to allow a mix of both portrait and landscape images but put some restrictions on the maximum height and width.
The problem i can see is that if I resize to a width, a portrait image may become too thin, and the opposite it true for a landscape image.
Any ideas on how to achieve those sort of results with PHP?
You just need to understand which of the two edges of the image is longer, and compute the other dimension proportionally. If the maximum long-egde is 1024, then if one of the two edges is larger you will set that to 1024, and compute the other to fit the proportions. Then you will pass those two values to your image management functions.
Like here:
http://www.white-hat-web-design.co.uk/blog/resizing-images-with-php/
Or here:
http://www.9lessons.info/2009/03/upload-and-resize-image-with-php.html
try with this
$needheight = 1000;
$needwidth = 1000;
$arrtest = getimagesize($upload_image_physical_path);
$actualwidth = $arrtest[0];
$actualheight = $arrtest[1];
if($needwidth > $actualwidth || $needheight > $actualheight){
//uplaod code
}
cheers
Check for a max size and then resize based on a ratio. Here's a pseudo code example:
if($imageHeight > $maxHeight) {
$newHeight = $maxHeight;
$newWidth = $imageWidth * ($maxHeight / $imageHeight);
}
if($imageWidth > $maxWidth) {
$newWidth = $maxWidth;
$newHeight = $imageHeight * ($maxWidth / $imageWidth);
}
resize($image, $newWidth, $newHeight);
It first checks the height and if the height is greater, it scales it down. Then it checks the width. If the width is too big, it scales it down again. The end result, both height and width will be with in your bounds. It uses the ratio to do the scaling.
Note, this is pseudocodish. The actual resize function call will depend on your image manipulation library -- same goes for calls to obtain image size.

PHP Thumbnail Image Resizing with proportions

As a brief run down, I am currently making a dating type site. Users can create accounts and upload profile pictures (up to 8). In order to display these in the browse area of the website, I am looking for a way in PHP (with third party processor/scripts) to resize all images uploaded to have thumbnails that adhere to certain dimensions.
As an example, I will want "profile" images (thumbnails) to be NO larger than 120*150px. The scripting needs to resize uploaded images (regardless of whether they are portrait or landscape, and regardless of proportions) to adhere to these dimensions without getting stretched.
The width (eg. 120pixels) should always remain the same, but the height (eg. 150px) can vary in order to keep the image in proportion. If it's a landscape photo, I'm assuming the script would need to take a chunk out of the middle of the image?
The reason that all images to be resized is so that when profiles are display in a grid that all thumbnails are roughly the same size.
Any input would be greatly appreciated.
$maxwidth = 120;
$maxheight = 150;
$img = imagecreatefromjpeg($jpgimage);
//or imagecreatefrompng,imagecreatefromgif,etc. depending on user's uploaded file extension
$width = imagesx($img); //get width and height of original image
$height = imagesy($img);
//determine which side is the longest to use in calculating length of the shorter side, since the longest will be the max size for whichever side is longest.
if ($height > $width)
{
$ratio = $maxheight / $height;
$newheight = $maxheight;
$newwidth = $width * $ratio;
}
else
{
$ratio = $maxwidth / $width;
$newwidth = $maxwidth;
$newheight = $height * $ratio;
}
//create new image resource to hold the resized image
$newimg = imagecreatetruecolor($newwidth,$newheight);
$palsize = ImageColorsTotal($img); //Get palette size for original image
for ($i = 0; $i < $palsize; $i++) //Assign color palette to new image
{
$colors = ImageColorsForIndex($img, $i);
ImageColorAllocate($newimg, $colors['red'], $colors['green'], $colors['blue']);
}
//copy original image into new image at new size.
imagecopyresized($newimg, $img, 0, 0, 0, 0, $newwidth, $newheight, $width, $height);
imagejpeg($newimg,$outputfile); //$output file is the path/filename where you wish to save the file.
//Have to figure that one out yourself using whatever rules you want. Can use imagegif() or imagepng() or whatever.
This will shrink any images down proportionally based on whichever side is longer (width or height), to the maximum size. It will also blow up any images smaller than max, which you can stop with a bit of checking on whether or not both width and height are less than their max. So, a 200x300 image will be shrunk to 100x150, and a 300x200 image will be shrunk to 120x80.
Hmm, you want the width to always be 120, so it would change a bit, and yeah, it would have to cut something out in the case of an image like 200x300, because that would shrink to 120x180 without any distortion, or it would have to shrink it farther and letterbox it, but that should get you started nicely.
Letterboxing this example would just involve figuring out what the proper x and y to start the drawing to the new image would be in the imagecopyresized() function. In the case of something like 100x150, the X would be 10, I think, so there would be 10px of blank space on each side for 120x150 in the end. Letterboxing 120x80 X would be 0 but Y would be 35, so there would be 35px of blank space above and below for 120x150.
You'd also want to make $newimg with $maxwidth,$maxheight rather than $newwidth,$newheight, but the imagecopyresized() would still use both $new values.
Since I'm bored and don't have anything else to do, these changes would do it:
if ($height > $width)
{
$ratio = $maxheight / $height;
$newheight = $maxheight;
$newwidth = $width * $ratio;
$writex = round(($maxwidth - $newwidth) / 2);
$writey = 0;
{
else
{
$ratio = $maxwidth / $width;
$newwidth = $maxwidth;
$newheight = $height * $ratio;
$writex = 0;
$writey = round(($maxheight - $newheight) / 2);
}
$newimg = imagecreatetruecolor($maxwidth,$maxheight);
//Since you probably will want to set a color for the letter box do this
//Assign a color for the letterbox to the new image,
//since this is the first call, for imagecolorallocate, it will set the background color
//in this case, black rgb(0,0,0)
imagecolorallocate($newimg,0,0,0);
//Loop Palette assignment stuff here
imagecopyresized($newimg, $img, $writex, $writey, 0, 0, $newwidth, $newheight, $width, $height);
That should work, haven't tried it yet.
GD or Imagick functions are what you need depending on your PHP configuration.
Sorry I'm a newbie I can't post both links in the same message :(
I have recently needed php resizing (thumbnail) solution and found Zebra_Image library, which is a lightweight image manipulation library written in PHP. The code is really clean and it's also easy to use. I highly recommend using this library. The example code is just enough to get you started.
Be make sure that you have enough memory limit set in php.ini file to manipulate images which have relatively big resolution (e.g 2560x1600). I had an error with big images and there was no error to print. I debugged the problem down to imagecreatefrom{gif,jpeg,png} calls in function _create_from_source in lines 1262, 1279, and 1288. The calls were silented with # so I couldn't have a change to get the error. I removed # lines and saw a PHP error that memory limit has been exceeded. The original memory limit was set to 32MB and I increased it to 64MB. Now I can manipulate 2560x1600 and I refuse to manipulate images which are bigger.
Below is the example code for controlling the image resolution.
$image_properties = getimagesize($UPLOADED_FILE_PATH);
$file_width = $image_properties[0];
$file_height = $image_properties[1];
if ($file_width > 2560 || $file_height > 1600) {
// handle your error whichever you like, I simply 'die' just to show
die('Cannot manipulate image bigger than 2560x1600');
}
(Note: I use Zebra Image version 2.2.2)
You can do this with ImageMagick:
convert susan.jpg -resize x200 susan_thumb.jpg
This runs with a shell command, so in PHP you'd use shell_exec() to run the above command. I don't think you need any PHP extensions.
A few flags can be found in the ImageMagick documentation to control the resizing operation. If I recall correctly, the x200 before the number means "scale with the same aspect ratio to 200px".
I wrote an install guide for ImageMagick (and ghostscript): How to install, test, convert, resize PDF using ImageMagick, Ghostscript, Windows Vista/7 x64 based on my bumbling around, maybe it can help you.
The other option is the GD library (detailed in dqhendricks answer). This is faster and apparently better documented, used for basic operations.
you don't need imagick. here is a link that will take you to a function that will resize any image using PHP GD to any arbitrary size. the function has options to use letterboxing or crop-to-fit methods to resize to the new aspect ratio. the function is also explained thoroughly. check it out.
http://www.spotlesswebdesign.com/blog.php?id=1
if this is what you are looking for, please select the check mark next to this answer. thanks!
Some says imagic faster, i use next
function resizeImageProportional($imagePath, $destinationPath, $width = false, $height = false, $filterType = \Imagick::FILTER_POINT, $blur = 1, $bestFit = false, $cropZoom = false)
{
if (!$width && !$height) {
trigger_error("WTF_IMAGE_RESIZE");
return false;
}
//The blur factor where > 1 is blurry, < 1 is sharp.
$imagick = new \Imagick(realpath($imagePath));
if (!$width || !$height) {
$orig_width = $imagick->getImageWidth();
$orig_height = $imagick->getImageHeight();
$proportion = $orig_height/$orig_width;
if (!$width) {
$width = $height*$proportion;
} elseif (!$height) {
$height = $width*$proportion;
}
}
if ($bestFit) {
$imagick->resizeImage($width, $height, $filterType, $blur, $bestFit);
} else {
$imagick->resizeImage($width, $height, $filterType, $blur);
}
if ($cropZoom) {
$cropWidth = $imagick->getImageWidth();
$cropHeight = $imagick->getImageHeight();
$newWidth = $cropWidth / 2;
$newHeight = $cropHeight / 2;
$imagick->cropimage(
$newWidth,
$newHeight,
($cropWidth - $newWidth) / 2,
($cropHeight - $newHeight) / 2
);
$imagick->scaleimage(
$imagick->getImageWidth() * 4,
$imagick->getImageHeight() * 4
);
}

Creating jpg thumb with php

I am having problems creating a thumbnail from an uploaded image, my problem is
(i) the quality
(ii) the crop
http://welovethedesign.com.cluster.cwcs.co.uk/phpimages/large.jpg
http://welovethedesign.com.cluster.cwcs.co.uk/phpimages/thumb.jpg
If you look the quality is very poor and the crop is taken from the top and is not a resize of the original image although the dimesions mean it is in proportion.
The original is 1600px wide by 1100px high.
Any help would be appreciated.
$thumb =
$targetPath."Thumbs/".$fileName;
$imgsize =
getimagesize($targetFile); $image =
imagecreatefromjpeg($targetFile);
$width = 200; //New width of image
$height = 138; //This maintains
proportions
$src_w = $imgsize[0]; $src_h =
$imgsize[1];
$thumbWidth = 200; $thumbHeight =
138; // Intended dimension of thumb
// Beyond this point is simply code.
$sourceImage =
imagecreatefromjpeg($targetFile);
$sourceWidth = imagesx($sourceImage);
$sourceHeight = imagesy($sourceImage);
$targetImage =
imagecreate($thumbWidth,$thumbHeight);
imagecopyresized($targetImage,$sourceImage,0,0,0,0,$thumbWidth,$thumbWidth,imagesx($sourceImage),imagesy($sourceImage));
//imagejpeg($targetImage,
"$thumbPath/$thumbName");
imagejpeg($targetImage, $thumb);
chmod($thumb, 0755);
Every time u create a thumbnail the DPI of the image has to go low and thus it is not possible to have the same quality, however u can check imagecreatetruecolor (http://in2.php.net/manual/en/function.imagecreatetruecolor.php ) for improvement
You're using the wrong variable for the image height.
imagecopyresized($targetImage,$sourceImage,0,0,0,0,$thumbWidth,$thumbWidth,imagesx($sourceImage),imagesy($sourceImage));
Should be:
imagecopyresized($targetImage,$sourceImage,0,0,0,0,$thumbWidth,$thumbHeight,imagesx($sourceImage),imagesy($sourceImage));
This should improve image quality but you should use imagecopyresampled for resizing and use the quality parameter when using the imagejpeg() function when saving to disk.
You would not worry if you would use the Thumbnailer.
$th=new Thumbnailer("your-photo.jpg");
$th->thumbSymmetricWidth(200)->save("your-thumb.jpg");
The quality is superb. You can also round the corners.

How do i resize image file to optional sizes

I have image upload form, user attaches aimage file, and selects image size to resize the uploaded image file(200kb, 500kb, 1mb, 5mb, Original). Then my script needs to resize image file size based on user's optional size, but im not sure how to implement this feature,
For example, user uploads image with one 1mb size, and if user selects 200KB to resize, then my script should save it with 200kb size.
Does anyone know or have an experience on similar task ?
Thanks for you reply in advance.
With the GD library, use imagecopyresampled().
<?php
// The file
$filename = 'test.jpg';
$percent = 0.5;
// Content type
header('Content-type: image/jpeg');
// Get new dimensions
list($width, $height) = getimagesize($filename);
$new_width = $width * $percent;
$new_height = $height * $percent;
// Resample
$image_p = imagecreatetruecolor($new_width, $new_height);
$image = imagecreatefromjpeg($filename);
imagecopyresampled($image_p, $image, 0, 0, 0, 0, $new_width, $new_height, $width, $height);
// Output
imagejpeg($image_p, null, 100);
?>
Edit: If you want to resize the image file to a specified size, that's a little harder. All the major image formats use compression and compression rates vary by the nature of what's being compressed. Compress clear blue sky and you'll get a better compression ratio than you will sea of people.
The best you can do is try a particular size is try a particular size and see what the file size is, adjusting if necessary.
Resize ratio = desired file size / actual file size
Resize multipler = square root (resize ratio)
New height = resize multiplier * actual height
New width = resize multiplier * actual width
This basically factors in an approximation of the expected compression ratio. I would expect that you would have some tolerance (like +/- 5%) and you can tweak the numbers as necessary.
There is no direct way to resize to a particular file size. Lastly I'll add that resizing to a particular file size is rather unusual. Resizing to a particular height and/or width (maintaining aspect ratio) is far more common and expected (by users).
Update: as correctly pointed out, this gets the file size wrong. The ratio needs to be the square root of the file size ratios as you're applying it twice (once to height, once to width).
Using the GD Library provided in PHP:
// $img is the image resource created by opening the original file
// $w and $h is the final width and height respectively.
$width = imagesx($img);$height = imagesy($img);
$ratio = $width/$height;
if($ratio > 1){
// width is greater than height
$nh = $h;
$nw = floor($width * ($nh/$height));
}else{
$nw = $w;
$nh = floor($height * ($nw/$width));
}
//centralize image
$nx = floor(($nw- $w) / 2.0);
$ny = floor(($nh-$h) / 2.0);
$tmp2 = imagecreatetruecolor($nw,$nh);
imagecopyresized($tmp2, $img,0,0,0,0,$nw,$nh,$width,$height);
$tmp = imagecreatetruecolor($w,$h);
imagecopyresized($tmp, $tmp2,0,0,$nx,$ny,$w,$h,$w,$h);
imagedestroy($tmp2);imagedestroy($img);
imagejpeg($tmp, $final_file);
This piece of code will take the original image, resize to the specified dimensions. It will first try to ratio aspect resize the image, then crop off + centralize the image, making it fall nicely into the dimensions specified.

Categories