Photo color loss after watermarking

Question

Having a few teething problems watermarking a photo. It all works fine apart from the watermarked photo's colors become duller than they should be - very noticeable in-fact.

I'm using imagecopyresized to do my watermarking, as this specifically allows me to use PNG-24 watermarks, the others do not. I know the colors are usually OK, as I have just used readfile($url) as a test, and the photos are perfect.

Here is my script:

<?php

// get parent and watermark images & sizes
$image = imagecreatefromjpeg($url);
$imageSize = getimagesize($url);
$watermark = imagecreatefrompng('watermark.png');
$watermark_o_width = imagesx($watermark);
$watermark_o_height = imagesy($watermark);

// calculate new watermark width and position
if ($imageSize[0] > $imageSize[1] || $imageSize[0] == $imageSize[1]) {
    $leftPercent = 23;
} else {
    $leftPercent = 7;
}
$leftPixels = ($imageSize[0]/100)*$leftPercent;
$newWatermarkWidth = $imageSize[0]-$leftPixels;
$newWatermarkHeight = $watermark_o_height * ($newWatermarkWidth / $watermark_o_width);

// place watermark on parent image, centered and scaled
imagecopyresized(
    $image,
    $watermark,
    $imageSize[0]/2 - $newWatermarkWidth/2,
    $imageSize[1]/2 - $newWatermarkHeight/2,
    0,
    0,
    $newWatermarkWidth,
    $newWatermarkHeight,
    imagesx($watermark),
    imagesy($watermark)
);

// print
imagejpeg($image);

// destroy
imagedestroy($image);
imagedestroy($watermark);

?>

How can I stop this from happening? I'm reading about imagecreatetruecolor, does that solve the issue? I'm Googling "imagecreatetruecolor color loss photos" and variations but nobody really talks about this issue. If I do need this function, where would I add that to this script?

This has totally thrown a spanner in the works for me and would love for somebody to tell me where to stick it (not literally).

Here is an example of the color loss. The preview image should be exactly the same colors as the thumbnail. The thumbnails are created using readfile() whereas the previews are created using imagecreatefromjpeg and imagecopresized.

Answer 1

This example code works fine, by using the same characteristics as your images:

Original JPG: dark background; beautiful girl; red dress. Watermark PNG: transparent background; text; gray color.

<?php

// Path the the requested file (clean up the value if needed)
$path = $url;

// Load image
$image = imagecreatefromjpeg($path);
$w = imagesx($image);
$h = imagesy($image);

// Load watermark
$watermark = imagecreatefrompng('watermark.png');
$ww = imagesx($watermark);
$wh = imagesy($watermark);

// Merge watermark upon the original image (center center)
imagecopy($image, $watermark, (($w/2)-($ww/2)), (($h/2)-($wh/2)), 0, 0, $ww, $wh);

// Output the image to the browser
header('Content-type: image/jpeg');
imagejpeg($image);

// destroy both images
imagedestroy($image);
imagedestroy($watermark);

// kill script
exit();

?>

---

Left: Output Image | Right: Original Image

Note:

The output image was compressed several times until: Original -> PHP Output -> GIMP -> Here.