Need Help w/ imagecreate() and imagecopy()

[andz]

Hello Guys,

 

I stumbled on a problem with the implementation of imagecreate() and imagecopy().

Basically, what I'm trying to achieve is to merge 2 image... pretty straight forward, huh.

 

image 1 = image generated using imagecreate()

image 2 = pre-made image that's on our webserver - transparent / .png format

 

The problem is this... the image I created using imagecreate() and save it as imagepng() -- works fine until to the point of the implementation of imagecopy()... the overlap / pre-made image does have a background color instead of a transparent results.

 

But using the image created using photoshop as base image / image 1 and save it as .png format or transparent works great and produce the results that I wanted.

 

Here's the actual codes that I have.

 

<?php
// create image 
$image = imagecreate(336, 280);
$backgroundImage = imagecolorallocate($image, 0xff, 0x00, 0x00); // put background red
imagecolortransparent($image);

$filename = md5(strftime('%Y-%m-%d %T'));

imagepng($image, 'downloads/'. $filename .'.png');
imagedestroy($image);



// use the created image
$background = imagecreatefrompng('downloads/'. $filename .'.png'); // background image... get the saved image
$overlap = imagecreatefrompng('tmpl/images/eco_car.png'); // overlap - 296x133


//imagealphablending($overlap, true);
//imagesavealpha($overlap, true);

imagealphablending($background, false);
imagesavealpha($background, true);

imagecopy($background, $overlap, 0, 10, 0, 0, 296, 133);

header('Content-Type: image/png');
imagepng($background);

imagedestroy($background);
imagedestroy($overlap);
?>

 

I'm already out of ideas in this problem.

 

thanks in advance and more power to this forum site.

[Psycho]

I'm not following. Perhaps you need to provide copies of two sample images and update your code to include more comments as to what you expect to happen at each step.

Edited March 4, 2013 by Psycho

[andz]

psycho...

 

my apology for my cheap code writing... you can download it here - https://www.dropbox.com/s/b8c5ep2k5zbxe1x/Archive.zip?m

 

if you have problems generating image, just chmod the downloads folder to 777

[Psycho]

OK, so please explain what - exactly - you are trying to achieve. Because some of your code isn't making sense, so I don't know what you are trying to achieve. For example:

// create image
$image = imagecreate(336, 280);
// add background #590808
$backgroundImage = imagecolorallocate($image, 0x59, 0x08, 0x08);
imagecolortransparent($image); // add transparent

 

You create the image, then you defined a color, then you call imagecolortransparent, but don't pass the color to make transparent. So, it doesn't do anything. When you leave the second parameter empty, then that function only returns the current transparent color. Since you aren't saving the return from that function you must be wanting to set the transparent color (which isn't happening).

 

EDIT: Also, why are you always creating a new background image on the filesystem? Why not just create the image object and use that instead of saving a file and then reading that file back into memory?

Edited March 4, 2013 by Psycho

[andz]

OK, so please explain what - exactly - you are trying to achieve. Because some of your code isn't making sense, so I don't know what you are trying to achieve. For example:

// create image
$image = imagecreate(336, 280);
// add background #590808
$backgroundImage = imagecolorallocate($image, 0x59, 0x08, 0x08);
imagecolortransparent($image); // add transparent

 

You create the image, then you defined a color, then you call imagecolortransparent, but don't pass the color to make transparent. So, it doesn't do anything. When you leave the second parameter empty, then that function only returns the current transparent color. Since you aren't saving the return from that function you must be wanting to set the transparent color (which isn't happening).

 

what i'm trying to achieve is to combine the php-generated image (png format) and the pre-made image eco_car.png that's inside of the downlaods folder.

 

the problem is that the eco_car.png ha a background instead of transparent when i used copyimage() or copyimagemerge() to it.

 

even without that imagecolortransparent(), still not working.

i hope i make things clear.

[Psycho]

the problem is that the eco_car.png ha a background instead of transparent when i used copyimage() or copyimagemerge() to it.

 

So, why are you trying to apply a transparency to the background image and not to the overlapping image? Could you please provide an example of what you want the resulting image to look like?

Edited March 4, 2013 by Psycho

[andz]

So, why are you trying to apply a transparency to the background image and not to the overlapping image? Could you please provide an example of what you want the resulting image to look like?

i tried applying it to overlapping image but still the same. i'm not sure though if creating image using php and save it as png preserves the transparency of the image but works fine with the background image that is generated using photoshop and saved as png.

[Psycho]

Your explanations in this post are not providing me with an understanding of what you are trying to achieve. I tried with using the photoshop image, using the php image and with using the dynamically created image in the code. I see no difference in the output created. So, I'm at a loss as to what you are trying to achieve. The best I can tell from your description is that you want to put the car image onto the larger background image and make the background part transparent. This would result in an image of the car with an extended border that is transparent. And, that makes no sense since you could achieve the same effect much simpler by applying some styles to the image.

 

 

You also didn't answer this question:

 

Why are you dynamically creating the background image on each load of the page. You can either use a static file or you can create the image only in memory instead of saving it.

[Psycho]

Is this close to what you are trying to achieve?

 

<?php
 
//Set source image name
$sourceImage = "downloads/eco_car.png";

//Get size of source image
list($width, $height) = getimagesize ($sourceImage);

// Create background image same size as source
$backgroundImg = imagecreate($width, $height);
// add background #590808
$transparentColor = imagecolorallocate($backgroundImg, 0x59, 0x08, 0x08);
// makebackground #590808 transparent
imagecolortransparent($backgroundImg, $transparentColor); // add transparent

//Create source image object
$foregroundImg = imagecreatefrompng('downloads/eco_car.png');

// merge 2 image
imagecopy($backgroundImg, $foregroundImg, 0, 0, 0, 0, $width, $height);

// display on browser
header('Content-Type: image/png');
imagepng($backgroundImg);

// destroy
imagedestroy($backgroundImg);
imagedestroy($foregroundImg);
 
?>

[andz]

Your explanations in this post are not providing me with an understanding of what you are trying to achieve. I tried with using the photoshop image, using the php image and with using the dynamically created image in the code. I see no difference in the output created. So, I'm at a loss as to what you are trying to achieve. The best I can tell from your description is that you want to put the car image onto the larger background image and make the background part transparent. This would result in an image of the car with an extended border that is transparent. And, that makes no sense since you could achieve the same effect much simpler by applying some styles to the image.

 

 

You also didn't answer this question:

 

Why are you dynamically creating the background image on each load of the page. You can either use a static file or you can create the image only in memory instead of saving it.

 

here's the breakdown of the work i'm working on...

 

1. gets to choose the banner size they want. (e.g. 336x280 , 250x250) and create it using php - imagecreate()

2. user gets to choose what background color they want.

3. user gets to add image (transparent image) from our gallery collection (transparent images) to the banner.

4. generate the image with the overlapping image on top of the background image and still the overlapping image preserves the transparency.

4. save / downlaod the image to their computer.

 

the sample code is just a miniature version of what i'm working on. yes, i can create the image on memory.

 

i attached here the actual result that i have

 

i need the car  to be transparent, as you can see it has a white background - https://www.dropbox.com/s/7snhq1aozomm614/image.png?m

please ignore the black background as it's only a screenshot from my browser using command + shift + 4 in my mac.

[Psycho]

OK, I'm having no luck either. Even after finding multiple posts elsewhere on the subject. Anyway, here is the code written in a more logical format that may assist as you proceed.

 

 

 
<?php

//Define variables as set by user
$bannerWidth  = 336;
$bannerHeight = 280;
$bannerColorR = 0x59;
$bannerColorG = 0x08;
$bannerColorB = 0x08;

$overlayImageSrc = 'downloads/eco_car.png';


// Create background image of selected size
$bannerImg = imagecreatetruecolor($bannerWidth, $bannerHeight);
// Set background color of banner
$backgroundColor = imagecolorallocate($bannerImg, $bannerColorR, $bannerColorG, $bannerColorB);
//Fill banner image with background color
imagefill($bannerImg, 0, 0, $backgroundColor);

//Create source image to add
$overlayImg = imagecreatefrompng($overlayImageSrc);
//Get size of image to add
list($width, $height) = getimagesize($overlayImageSrc);

//Set alpha blending
imagealphablending($bannerImg, false);
imagesavealpha($bannerImg, true);

//Merge banner and overlay images
imagecopy($bannerImg, $overlayImg, 0, 10, 0, 0, $width, $height);

//Display in browser
header('Content-Type: image/png');
imagepng($bannerImg);

//Destroy
imagedestroy($bannerImg);
imagedestroy($foregroundImg);

exit();

?>
 

[andz]

 

OK, I'm having no luck either. Even after finding multiple posts elsewhere on the subject. Anyway, here is the code written in a more logical format that may assist as you proceed.

 

 

 
<?php

//Define variables as set by user
$bannerWidth  = 336;
$bannerHeight = 280;
$bannerColorR = 0x59;
$bannerColorG = 0x08;
$bannerColorB = 0x08;

$overlayImageSrc = 'downloads/eco_car.png';


// Create background image of selected size
$bannerImg = imagecreatetruecolor($bannerWidth, $bannerHeight);
// Set background color of banner
$backgroundColor = imagecolorallocate($bannerImg, $bannerColorR, $bannerColorG, $bannerColorB);
//Fill banner image with background color
imagefill($bannerImg, 0, 0, $backgroundColor);

//Create source image to add
$overlayImg = imagecreatefrompng($overlayImageSrc);
//Get size of image to add
list($width, $height) = getimagesize($overlayImageSrc);

//Set alpha blending
imagealphablending($bannerImg, false);
imagesavealpha($bannerImg, true);

//Merge banner and overlay images
imagecopy($bannerImg, $overlayImg, 0, 10, 0, 0, $width, $height);

//Display in browser
header('Content-Type: image/png');
imagepng($bannerImg);

//Destroy
imagedestroy($bannerImg);
imagedestroy($foregroundImg);

exit();

?>
 

 

thanks for your help mate. still finding a solution here... i'm already out of ideas on how to deal with it.

[andz]

 

OK, I'm having no luck either. Even after finding multiple posts elsewhere on the subject. Anyway, here is the code written in a more logical format that may assist as you proceed.

 

 

 
<?php

//Define variables as set by user
$bannerWidth  = 336;
$bannerHeight = 280;
$bannerColorR = 0x59;
$bannerColorG = 0x08;
$bannerColorB = 0x08;

$overlayImageSrc = 'downloads/eco_car.png';


// Create background image of selected size
$bannerImg = imagecreatetruecolor($bannerWidth, $bannerHeight);
// Set background color of banner
$backgroundColor = imagecolorallocate($bannerImg, $bannerColorR, $bannerColorG, $bannerColorB);
//Fill banner image with background color
imagefill($bannerImg, 0, 0, $backgroundColor);

//Create source image to add
$overlayImg = imagecreatefrompng($overlayImageSrc);
//Get size of image to add
list($width, $height) = getimagesize($overlayImageSrc);

//Set alpha blending
imagealphablending($bannerImg, false);
imagesavealpha($bannerImg, true);

//Merge banner and overlay images
imagecopy($bannerImg, $overlayImg, 0, 10, 0, 0, $width, $height);

//Display in browser
header('Content-Type: image/png');
imagepng($bannerImg);

//Destroy
imagedestroy($bannerImg);
imagedestroy($foregroundImg);

exit();

?>
 

 

hi mate.

 

found the solution to my problem.

[Psycho]

Then you should post the solution here in case someone else stumbles upon this post with the same problem.