Calculate nearest possible dimension value PHP (keeping ratio) - php

I am trying to implement API for image resizing. It is created not exactly for image processing, this is only one part/feature of API.
What I want to implement.
I have url for retrieving image from server it looks like
mywebpage.com/api/product/42/image
This url will return URL to full image of product with id 42.
Everything is ok.
We can specify desired size with GET parameters like this
mywebpage.com/api/product/42/image?width=200&height=300
It also looks fine
But my question if following.
As we can have different images on server with different dimension and aspect ratio, I need to keep this ratio while resizing.
For example I need image to fit 200x300 container but I have 1024x576 (16:9) image on the server. I need to resize this image but keep initial aspect ratio(16:9) but to fit desired container.
How can I efficiently calculate new image size to return depending on incoming desired dimension and current image aspect ratio.
I want to thank everyone in advance for any help or advises.

Here is a script I used to make similar thing. Quite old , so may be not up to date.
<?php
if( isset($_GET["width"]) && is_numeric($_GET["width"]))
$target_width = intval($_GET["width"]);
else
$target_width= 200;//default value
if( isset($_GET["height"]) && is_numeric($_GET["height"]))
$target_height = intval($_GET["width"]);
else
$target_height= 300;//default value
if( isset($_GET["id"]) && is_numeric($_GET["id"]))//prevent any unwanted filesystem access
$original_image_path = "img/products/$id.jpg";
else
$original_image_path = "placeholder.png"
//http://php.net/manual/fr/function.getimagesize.php
$image_size = getimagesize($original_image_path);
//get the ratio of the original image
$image_ratio= $image_size[1]/ $image_size[0];
$original_image = imagecreatefromjpeg($original_image_path);
$new_image = imagecreatetruecolor($target_width, $image_ratio * $target_width);
//paints the image in white
//http://php.net/manual/en/function.imagefill.php
//http://php.net/manual/en/function.imagecolorallocatealpha.php
imagefill( $new_image, 0, 0, imagecolorallocatealpha($new_image, 255,255,255,127) );
imagesavealpha($new_image, TRUE);
/*
Copies the original to the new, preserving the ratio.
The original image fills all the width of the new,
and is placed on the top of the new.
http://php.net/manual/en/function.imagecopyresized.php
*/
imagecopyresized(
$new_image,$original_image,
0,0,
0,0,
$target_width,$image_ratio * $target_width,
$image_size[0],$image_size[1]
);
//image is returned in response to the request
header ("Content-type: image/png");
imagepng( $new_image );
?>

Well if you need to always fit a container of 200x300 (or what ever is passed through the URL), you may not because able to simply resize it because as you are aware it will affect the images aspect ratio.
If this is the case what you can do is resize the image to the closest size then crop the remainder of the image.
I assume you will be using imagemagick for this. Have you checked out the documentation? The cropThumbnailImage method does what I just explained.
Example usage:
/* Read the image */
$im = new imagick( "test.png" );
/* create the thumbnail */
$im->cropThumbnailImage( 80, 80 );
/* Write to a file */
$im->writeImage( "th_80x80_test.png" );
http://php.net/manual/en/imagick.cropthumbnailimage.php

Related

How to crop image with dimensions (without quality loss) in PHP?

I need to crop the image with PHP by using the dimensions.
And save it into the local with JPEG format.
Dimensions that i receive is,
{"left":82.5,"top":48.875,"width":660,"height":371.25}
I need to crop from Original size of the image.
Ex. image is 1200x800, then the result image dimension from the actual size, not resizing or any. Because the quality should be same.
How could i use these params to crop the image ?
Is it possible ?
Use the built-in imagick class:
$image = realpath("/path/to/your/image.extension");
$cropped = realpath("/path/to/your/output/image.png");
$imObj = new Imagick();
$imObj->cropImage($width, $height, $offset_x, $offset_y);
$imObj->setImageFormat("png"); // this is unnesesary, you can force an image format with the extension of the output filename.
$imObj->writeImage($cropped);
As for lossless output, use an image format with lossless encoding. PNG is perfect for the job, since it was designed for network transfer (hence the "Adam-7" interlacing).
Check this related question about lossless image formats on graphic design stack:
What are lossless image formats?
You can use imageCopyResampled function which was designed pretty much exactly for this.
$image = imagecreatefromjpeg($imageFileURL);
/***
* resize values (imported)
***/
$left = 82;
$top = 49;
$width = 660;
$height = 371;
/***
* Create destination image
***/
$newImage = imagecreatetruecolor($width,$height);
$saveToFile = "destintion filespace of image file.jpg"
if(imagecopyresampled($newImage, $image, //dest/source images
0, 0, // dest coordinates
$left, $top, // source coordinates
$width, $height, // size of area to paste to
$width, $height // size of area to copy from
)){
imagejpeg($newImage,$saveToFile,100); //zero compression saved to file
print "image resized ok!!";
}
The new fileimage will be the size specified with $width,$height and will be offset from the original image by the values given in $left and $top. From your question this looks like what you want. This will not resize or change the compression of the image (until you save the file and then possibly set these details yourself).

Out of Memory issue when multiple visitors view product catalog

First question, so sorry if I do something wrong!
My issue is, I have a product catalog, which displays up to 18 thumbnails, each approx 6kb, in a product catalog. Each of the thumbnails calls a script get_db_image which searches for and returns the image relating to the product. Simple, so far. The issue only arises when approx 3 or 4 requests are made at the same time for a product catalog page, each user is expecting 18 thumbnails and details to be returned, but when they all do it at the same time I get out of memory errors and sometimes the server crashes. I've stripped down the code that retrieves and displays the image, and the hosting people have raised the memory limit to 256M, but it's all to no avail. As far as I can tell I'm destroying the images I've created and the virtual memory goes back to zero split seconds after the requests are made, but at the peak all the memory is being utilised, hence the crashes, so the only thing I can think off doing is getting, displaying and destroying each image before I start the next one, but I don't know how to go about that, but maybe there is a better solution? Please help, pulling my hair out and I don't have a lot to waste!
// executes the query searching for the image
$res = execPDORetRes($query, $vars);
// if there is no image, load a default
if(sizeof($res) == 0)
{
$query_parts = explode(" ", $query);
$query = "select * from ".$query_parts[3]." where id = :id";
$vars = array(':id-int' => 1);
$res = execPDORetRes($query, $vars);
}
$data = $res[0];
// create the image from the DB
$img = imagecreatefromstring($data[$name]);
$type = "image/pjpeg";
Header( "Content-type: image/pjpeg");
$width = imagesx($img);
$height = imagesy($img);
// if the image is too big
if($size_w != $width || $size_h != $height)
{
// set widths and heights
if ($width <= $size_w)
{
$new_w = $width;
$new_h = $height;
}
else
{
$new_w = $size_w;
$new_h = $size_h;
}
// create a new image of the specified width and height
$new_img = imagecreatetruecolor($new_w,$new_h);
// resize the original
imagecopyresized($new_img,$img,0,0,0,0,$new_w,$new_h,$width,$height);
// determine image type and send it to the client
imagejpeg($new_img,"","80");
// clear the image from memory
imagedestroy($new_img);
imagedestroy($img);
unset($width, $height, $new_h, $new_w, $new_img, $img);
}
else
{
// if the image is smaller than or the right size
// determine image type and send it to the client
imagejpeg($img,"","80");
// clear the image from memory
imagedestroy($img);
unset($width, $height, $img);
}
ob_flush();
Thanks for the help.
I think you should generate your thumbnails in advance if you want to this it this way.
This means you should have your normal product images under e.g. "public/images/products/main" and then your thumbs under "public/images/products/thumbs" and then store in the database your paths to the product images and your thumbs.
This approach is better then creating them on the fly.
Otherwise you could just scale them down with css, if bandwidth is not a problem, but I guess it is.
You can even keep your thumbs script and check in the db if a thumbnail exists, if it does not, call your script: generate thumb, save thumb, update db. The next time a user comes and you need to display this thumbnail, it will already be there.
256 megabytes should be plenty. Nothing in your code looks bad and you're even using unset. I recommend debugging with Xdebug and WinCacheGrind, they can produce in-depth logs...

Imagick Resize, Center, and Sparse Fill problems

My end goal here is to resize the input image to 100px width, 125px height. Some of the input images are a different Aspect Ratio, so I wish for them to be in a 100x125 container with the background sparse filled from their edge color.
Ok, so this works for the basic resize:
$image = new Imagick($imgFile);
$image->resizeImage(100,0, Imagick::FILTER_LANCZOS, 1, false);
$image->writeImage("$Dir/$game.png");
header("Content-type: ".$image->getImageFormat());
echo $image;
$image->clear();
$image->destroy();
However I've been searching for hours, and I cannot find a simple "This is how you center an image in a canvas" bit for PHP's Imagick library. Everything is for the actual ImageMagick convert application, which is not really what I'm after. I've tried compositing the resized image into an empty newImage with the set width and height, but it just seems to overwrite the dimensions regardless of the composite type, setting the Gravity to center and then the extent to 100x125 has no effect ( It always sits at 0,0, and trying to set the y offset to ((125-imageheight)/2) resulted in an offset that was way more than it should have been )
Edit:
$imageOutput = new Imagick();
$image = new Imagick($imgFile);
$image->resizeImage(100,0, Imagick::FILTER_LANCZOS, 1, false);
$imageOutput->newImage(100, 125, new ImagickPixel('black'));
$imageOutput->compositeImage($image, Imagick::COMPOSITE_ADD, 0, ((125 - $image->getImageHeight()))/2 );
$imageOutput->setImageFormat('png');
$imageOutput->writeImage("$Dir/$game.png");
header("Content-type: ".$imageOutput->getImageFormat());
echo $imageOutput;
$image->clear();
$image->destroy();
So I got my centering working, gravity apparently has no effect on actual images.
I have absolutely no idea where I would even begin to try and recreate a command line edge-in sparse fill in PHP with the library.
I ended up using a combination of Imagick and shell calls to convert itself, I'll eventually rewrite it to use entirely shell calls. I also changed my dimensions, here's the code:
$imageOutput = new Imagick(); // This will hold the resized image
$image = new Imagick($imgFile); // Open image file
$image->resizeImage(120,0, Imagick::FILTER_LANCZOS, 1, false); // Resize it width-wise
$imageOutput->newImage(120, 150, "none"); // Make the container with transparency
$imageOutput->compositeImage($image, Imagick::COMPOSITE_ADD, 0, ((150 - $image->getImageHeight())/2) ); // Center the resized image inside of the container
$imageOutput->setImageFormat('png'); // Set the format to maintain transparency
$imageOutput->writeImage("$Dir/$game.temp.png"); // Write it to disk
$image->clear(); //cleanup -v
$image->destroy();
$imageOutput->clear();
$imageOutput->destroy();
//Now the real fun
$edge = shell_exec("convert $Dir/$game.temp.png -channel A -morphology EdgeIn Diamond $Dir/$game.temp.edge.png"); // Get the edges of the box, create an image from just that
$shepards = shell_exec("convert $Dir/$game.temp.edge.png txt:- | sed '1d; / 0) /d; s/:.* /,/;'"); // get the pixel coordinates
$final = shell_exec("convert $Dir/$game.temp.edge.png -alpha off -sparse-color shepards '$shepards' png:- | convert png:- $Dir/$game.temp.png -quality 90 -composite $Dir/$game.jpg"); // Sparse fill the entire container using the edge of the other image as shepards , then composite that on top of this new image
unlink("$Dir/$game.temp.png"); // cleanup temp files
unlink("$Dir/$game.temp.edge.png");
set_header_and_serve("$Dir/$game.jpg"); // serve the newly created file

How to merge two images and save in php at Run Time?

i want to make a picture upload in frame and save both image and frame as a single image ,main thing is whatever the size of image in frame,it should be appear exactly same in a final resulting image after merging.
Here is part of my code:
$imgframe = $_GET['imgframe'];
$imgphoto = $_GET['imgphoto'];
$imgwidth = $_GET['imgwidth'];
$imgheight = $_GET['imgheight'];
$imgleft = substr($_GET['imgleft'],0,-2);
$imgtop = substr($_GET['imgtop'],0, -2);
$src = imagecreatefromjpeg($imgphoto);//'image.jpg'
$dest = imagecreatefrompng($imgframe);//clip_image002.png
imagealphablending($dest, false);
imagesavealpha($dest, true);
imagecopyresampled(
$dest, $src, $imgleft, $imgtop, $imgleft, $imgtop,
$imgwidth, $imgheight, $imgwidth, $imgheight
);
As per your comment below the question, you are using the wrong function.
The PHP manual page for imagecopymerge states that it copies a part of an image onto another. It states that you can specify the origin coordinates, width and height of the region to copy from the source, and the coordinates in the destination in which to place that region.
In other words, it takes a rectangular area of a given size from the source image and puts it on top of the destination, at the given location. It does NOT ask for the size of the region into which you are copying it, only the location. Therefore, it does not resize the copied region, but copies it pixel-for-pixel.
The function you actually need is imagecopyresampled, which allows you to specify the size of the destination region, and will smoothly scale the source region to fit.
EDIT
You are still having a problem because you are using the same coordinates and the same dimensions in the source and the destination parameters. Same dimensions == no resizing.
$imgframe = $_GET['imgframe'];
$imgphoto = $_GET['imgphoto'];
// I am assuming these specify the area of the imgphoto which
// should be placed in the frame?
$imgwidth = $_GET['imgwidth'];
$imgheight = $_GET['imgheight'];
$imgleft = substr($_GET['imgleft'],0,-2);
$imgtop = substr($_GET['imgtop'],0, -2);
// now you also need to get the size of the frame so that
// you can resize the photo correctly:
$frameSize = getimagesize($imgframe);
$src = imagecreatefromjpeg($imgphoto);//'image.jpg'
$dest = imagecreatefrompng($imgframe);//clip_image002.png
imagealphablending($dest, false);
imagesavealpha($dest, true);
imagecopyresampled(
$dest, $src,
0, 0, // these two specify where in the DESTINATION you want to place the source. You might want these to be offset by the width of the frame
$imgleft, $imgtop, // the origin of area of the source you want to copy
$frameSize[0], $frameSize[1], // These specify the size of the area that you want to copy IN TO (i.e., the size in the destination), again you might want to reduce these to take into account the width of the frame
$imgwidth, $imgheight // the size of the area to copy FROM
);

PHP GD Move Picture Up 1 Px

I need to take an image and move it upwards 1 px in certain situations for my code, but with what GD function would I use to do that? I couldn't find another question that asked this, so I asked it. But the middle of the picture is a number and the background is transparent, and the height and width is almost always different
Here's an example. The key part is imagecopymerge() function. play with it's 0,0,1,0 values.
<?php
$src = imagecreatefromgif($img);
list($w,$h) = getimagesize($img);
$sprite = imagecreatetruecolor($w,$h);
$trans = imagecolortransparent($sprite);
imagealphablending($sprite, false);
imagesavealpha($sprite, true);
imagepalettecopy($sprite,$src);
imagefill($sprite,0,0,imagecolortransparent($src));
imagecolortransparent($sprite,imagecolortransparent($src));
imagecopy($sprite,$src,0,0,1,0,$w,$h);
imagegif($sprite,$img);
imagedestroy($sprite);
imagedestroy($src);
?>

Categories