Merge multiple pictures into one - php

Let's suppose I want to create a face generator, where I would design several pictures for face form, ears, noses, mouth, hair. Given a combination of those pictures how can I create a new picture in PHP? For instance, a simplified version:
There is face1.png, face2.png, nose1.png and nose2.png. How could I programmatically merge face1.png with nose2.png, so the result picture would hold content from both picture?

You've basically got three options: GD, Cairo or ImageMagic. I'd recommend using the Imagick class if it's available. If not, ImageMagick through PHP system calls. If that's not available, GD will probably suffice.
It depends on your server configuration, which of these are available and which would require additional packages to be installed.
There's a very simple example in the Imagick documentation of combining images: https://secure.php.net/manual/en/imagick.compositeimage.php
I also found this example for GD:
Merge two PNG images with PHP GD library

There is a function named imagecopy. This function overrides a part of the destination image using a source image. The given part is specified as parameters. Before you tell me that this does not solve your problem, I have to add that the pixels in the destination picture will not be overriden by the pixels of the source picture if the pixels are transparent. You need to use imagealphablending and imagesavealpha on the source picture, like this:
public static function experimental($images, $width, $height, $dest = null) {
$index = 0;
if ($dest === null) {
$dest = $images[$index++];
}
while ($index < count($images)) {
imagealphablending($images[$index], true);
imagesavealpha($images[$index], true );
imagecopy($dest, $images[$index++], 0, 0, 0, 0, $width, $height);
}
return $dest;
}
If we have these two pictures:
The result will be this:

You really want make it with PHP?
Ok.
1) You can use GD library for image processing.
2) You can use imagemagic PHP wrapper -- imagic.
But I think you should use canvas on client side. And for saving result you can send base64 png image representation of canvas (or separated layers/pictures) to backend.

Related

Is there a way to retrieve or derive raw SoundCloud API waveform data?

I’m creating a web application that uses the SoundCloud API to stream tracks of artists. I know how I can get the waveform PNG image (http://w1.sndcdn.com/fxguEjG4ax6B_m.png for example), but I actually need some sort of wave-data (when in the song is it high and when is it low?).
I don’t have access to an audio library like LAME or something like that, because my web hosting doesn’t allow it. Is it possible to
Get this data directly from the SoundCloud API in some way.
Process the waveform PNG image in PHP or JavaScript to retrieve the needed data? (And is there maybe some sort of library available for this kind of processing?)
Soundcloud starts to provide the floating points but it’s not official yet. Just a little trick, when you have your PNG:
https://w1.sndcdn.com/XwA2iPEIVF8z_m.png
Change "w1" by "wis" and "png" by "json":
https://wis.sndcdn.com/XwA2iPEIVF8z_m.json
And you get it!
It's possible to parse the waveform PNG image to translate it to an array of points. The images are vertically symmetrical and to find the peaks you only need to inspect the alpha values to count how many opaque pixels it is from the top of the image. This is how the waveforms are rendered for the widget and on the Next SoundCloud.
In PHP, you could use ImageMagick or the GD Graphics Library to read these values, and in Javascript, it's possible by putting the image onto a canvas object and then inspecting the image data from there. I won't go too much into the details of these, but you could certainly ask another question if you get stuck.
While there is no official way to get the raw waveform data directly from a SoundCloud API request, there is a way to derive the exact same data SoundCloud reveals in the unofficial endpoint (aka: Something like https://wis.sndcdn.com/XwA2iPEIVF8z_m.json) in PHP using this code like this. Simply change the value of $image_file to match whatever SoundCloud 1800 wide by 280 high PNG image you have and you are good to go:
$source_width = 1800;
$source_height = 140;
$image_file = 'https://w1.sndcdn.com/XwA2iPEIVF8z_m.png';
$image_processed = imagecreatefrompng($image_file);
imagealphablending($image_processed, true);
imagesavealpha($image_processed, true);
$waveform_data = array();
for ($width = 0; $width < $source_width; $width++) {
for ($height = 0; $height < $source_height; $height++) {
$color_index = #imagecolorat($image_processed, $width, $height);
// Determine the colors—and alpha—of the pixels like this.
$rgb_array = imagecolorsforindex($image_processed, $color_index);
// Peak detection is based on matching a transparent PNG value.
$match_color_index = array(0, 0, 0, 127);
$diff_value = array_diff($match_color_index, array_values($rgb_array));
if (empty($diff_value)) {
break;
}
} // $height loop.
// Value is based on the delta between the actual height versus detected height.
$waveform_data[] = $source_height - $height;
} // $width loop.
// Dump the waveform data array to check the values.
echo '<pre>';
print_r($waveform_data);
echo '</pre>';
The benefit of this method is while that https://wis.sndcdn.com/ URL is useful, there is no telling if/when SoundCloud would change the structure of the data coming from it. Deriving the data from the official waveform PNG offers some long term stability since they are not just going to change that PNG image without fair warning to SoundCloud API end users.
Also, note that while the $source_width is 1800 the $source_height is 140 because while the SoundCloud PNG file is 280 pixels high, the bottom half is basically just a flipped/mirrored copy of the top half. So just measuring the values from 0 to 150 will give you the necessary waveform data values.
Sorry to bump an old thread - just in case you are looking for something similar and stumbles across this post: This is now possible as per this link: Waveforms, Let's Talk About Them.
It was published shortly after this thread - so again apologies for bumping an old one.

Image uploading concept in PHP

how to take image from one folder and rename and re-size the images and move to another folder?
I need to get image from one folder and rename and re-size the same image and move into another folder using php
You will most likely be using gd for resizing the images.
Here is a pretty crappy, but hopefully useful code sample. In this case, $originalName is the name given in the $_FILES array's tmp_name position. I am resizing to a width of 1200 in this case, with the height adapting according to such width. You might (and most likely will) not desire this behavior. This is just some ugly code I used in some courses I taught about 3 years ago, I don't have the newer samples in this computer so you will have to get used to the idea :)
$newDir is where the file will be located. by calling imagejpeg or imagepng and passing the filename as second argument, it means to the function that you wish to save the image in that location.
if ($type == 'image/jpeg') {
$original = imagecreatefromjpeg($originalName);
}
else {
$original = imagecreatefrompng($originalName);
}
$width = imagesx($original);
$height = imagesy($original);
//prepare for creation of image with width of 1000
$new_height = floor($height * (1200 / $width));
// create the 1200 width image
$tmp_img = imagecreatetruecolor(1200, $new_height);
// copy and resize old image into new image
imagecopyresized($tmp_img, $original, 0, 0, 0, 0,
1200, $new_height, $width, $height);
//create a random and unique name to identify (here it isn't that random ;)
$newDir = '/this/is/some/directory/and/filename.';
if ($type == 'image/jpeg') {
imagejpeg($tmp_img, $newDir."jpg");
}
else {
imagepng($tmp_img, $newDir."png");
}
Many file system functions are already built-in with PHP (e.g. rename), and you'll find most of what you need to resize images by using the GD library here.
There are libraries available in PHP for image resize.
Here are some useful links you may like.
http://www.fliquidstudios.com/2009/05/07/resizing-images-in-php-with-gd-and-imagick/
http://php.net/manual/en/book.image.php
PHP/GD - Cropping and Resizing Images
http://net.tutsplus.com/tutorials/php/image-resizing-made-easy-with-php/
Use imagick http://php.net/manual/en/imagick.resizeimage.php
If I were you I would write a PE using a diffent language (one that you might be best used to) to adjust anything of the given image then just feel free to phpexec it to do all the steps you mentioned, you can sit relax and wait for the end result. HHAHAHHA :-)
Use imagick library to resize; it's good.

sharpen image quality with PHP gd library

not sure where but I came across as image hosting site that allows you to upload your image in a large format or to sharpen it.
I personally do not recall or know of any functions of GD library to sharpen image which might just be a different word for quality being up-ed.
If some one knows of a function to sharpen images please tell me since personally I am not aware of such functions neither in Image Magic and/or GD Library.
Thanks in advance
You can use imageconvolution in GD with a sharpen mask. From http://adamhopkinson.co.uk/blog/2010/08/26/sharpen-an-image-using-php-and-gd/:
PHP and GD can sharpen images by providing a matrix to imageconvolution:
// create the image resource from a file
$i = imagecreatefromjpeg('otter.jpg');
// define the sharpen matrix
$sharpen = array(
array(0.0, -1.0, 0.0),
array(-1.0, 5.0, -1.0),
array(0.0, -1.0, 0.0)
);
// calculate the sharpen divisor
$divisor = array_sum(array_map('array_sum', $sharpen));
// apply the matrix
imageconvolution($i, $sharpen, $divisor, 0);
// output the image
header('Content-Type: image/jpeg');
imagejpeg($i);
You'd use imageconvolution() with a matrix that corresponds to a sharpen filter. Details in this comment on the PHP site: http://php.net/manual/en/ref.image.php#56144
I haven't tried it, but this looks like what you're looking for, as far as ImageMagick goes.
In GD library of php having a file with path
lib/PHPImageWorkshop/Core/ImageWorkshopLayer.php
Please go to save public function and you can change the imageQuality upto 100.
make sure which type of image you want to create.
Hope this will help you.

How do I auto resize user's inputted images to a specific dimension in PHP?

When users input their images, their images are any size. I want to be able to resize all the images to a specific dimension. Is there a function that allows me to do that in PHP?
thanks
The function you need is imagecopyresampled, that also interpolate pixels, (imagecopyresized does not);
In my code I use a it in a function like this:
function resizeAndSavePhoto($original, $destination, $dest_width, $dest_height){
$photo = createImage($original);
$size = getimagesize($original);
$final_photo = imagecreatetruecolor($dest_width, $dest_height);
imagecopyresampled($final_photo, $photo,0,0,0,0,$dest_width, $dest_height, $size[0], $size[1]);
imagejpeg($final_photo, $destination, 100);
}
$orignal and $destination are filename paths
http://php.net/gd
Specifically, http://php.net/imagecopyresized
Try ImageMagick, it keeps the EXIF information in an image if it needs it, among other things:
http://php.net/manual/en/book.imagick.php
ok you can make something:
http://net.tutsplus.com/tutorials/php/image-resizing-made-easy-with-php/
or use something already made, i use this one:
http://www.white-hat-web-design.co.uk/articles/php-image-resizing.php
which works a treat
Here's a very good library that you can resize images with. It has ways to resize them so they are still proportionate and it has options to save, or display images as well. Works really slick
http://phpthumb.gxdlabs.com/

Using a transparent PNG as a clip mask

Is it possible to take this image:
And apply this mask:
And turn it into this:
Using either GD or Imagick? I know it's possible to mask an image using shapes but I'm not sure how to go on about doing it with a pre-created alphatransparent image. :s
Using Imagick and ImageMagick version > 6 (I don't know if it will work on older versions):
// Set image path
$path = '/path/to/your/images/';
// Create new objects from png's
$dude = new Imagick($path . 'dude.png');
$mask = new Imagick($path . 'dudemask.png');
// IMPORTANT! Must activate the opacity channel
// See: http://www.php.net/manual/en/function.imagick-setimagematte.php
$dude->setImageMatte(1);
// Create composite of two images using DSTIN
// See: http://www.imagemagick.org/Usage/compose/#dstin
$dude->compositeImage($mask, Imagick::COMPOSITE_DSTIN, 0, 0);
// Write image to a file.
$dude->writeImage($path . 'newimage.png');
// And/or output image directly to browser
header("Content-Type: image/png");
echo $dude;
I think you are looking for imagealphablending. I use it for watermarks, and I believe it will do the effect you are looking for.
Great work with (ImageMagick) NOT GD .. I see the tags of this question is GD!!
Here is a GD version at this link:
PHP GD Use one image to mask another image, including transparency

Categories