javascript - Superimpose Images with PHP

Question

I am searching for a way to overlay an image on an existing image.

e.g:

+

I have found a great example over here: PNG overlay using one single Image element. but I have two problems with these.

First of all, I don't want the dimensions to be equal to each other. e.g (215*215 on 215*215). This is because my users would have the ability to choose where they want to put their image. (Top, left, bottom, top-right) so 8 directions.

The second problem is that in that example, only 2 images are allowed to overlay. My users (again) will have the ability to put multiple images on top of it.

I have a little knowledge of Javascript and PHP, so it would be great if you guys (and girls) could help me out.

Sincerely,

Answer 1

You can do this using GD library. There is function to "merge" images called imagecopymerge.

Here is a very simple example how to merge images:

<?php
header('Content-Type: image/jpeg');

$bg = imagecreatefromjpeg('background.jpg');
$img = imagecreatefromjpeg('image.jpg');

imagecopymerge($bg, $img, 0, 0, 0, 0, imagesx($bg), imagesy($bg), 75);

imagejpeg($bg, null, 100);
?>