Overlay image with text and convert to image

Question

I want to add text to a jpg creating a new image.

There will be image_1.jpg already on the server and I want to take the user submitted copy and put it on top of image_1.jpg creating a new image that combines the copy and the original image into a new rasterized jpg

I know you can use GD Libraries in php to rasterize copy but can you layer it? My site is written in PHP but I am open to using 3rd party plug-ins.

ANSWER:(OLD POST) but what I need http://blog.rafaeldohms.com.br/2008/02/12/adding-text-to-images-in-real-time-with-php/

What format are you expecting for output if you layer it? PSP? XCF? MIFF? Pretty sure ImageMagick can handle layers, never done it in PHP before. — davidethell, Sep 27 '11 at 13:27
If possible the end file should be rasterized and saved as any file format that can be emailed. jpg gif png — Denoteone, Sep 27 '11 at 13:33
Layer? Where do you need a layer? Wouldn't just putting text onto the image do it? What's not enough in GD to get this done? What is your actual code so far? It looks to me that there is no issue at all, see http://www.roseindia.net/tutorial/php/phpgd/About-drawtext.html - and yeah: http://stackoverflow.com/search?q=[php]+%2Bimage+%2Btext+gd&submit=search — hakre, Sep 27 '11 at 13:38
No code yet just wanted to make sure it is even possible. There will be image_1.jpg already on the server and I want to take the user submitted copy and put it on top of image_1.jpg creating a new image that combines the copy and the original image into a new rasterized jpg. — Denoteone, Sep 27 '11 at 14:33
Should just be a case of using [`imagecreatefromjpeg()`](http://www.php.net/manual/en/function.imagecreatefromjpeg.php) to read the image in, using [`imagefttext()`](http://www.php.net/manual/en/function.imagefttext.php) to draw the text on to the image and then using [`imagejpeg()`](http://www.php.net/manual/en/function.imagejpeg.php) to write out the new file. — Orbling, Sep 27 '11 at 15:38
@orbling Why didn't you answer the question I would have marked it right. :) +1 — Denoteone, Sep 27 '11 at 18:44
@Denoteone: I did not have enough time to create a decent answer yesterday, and was mainly just putting the salient points across of how to go about it, no doubt you succeeded. As the question has merit and has no answers, I thought I would add something useful for future readers, perhaps. — Orbling, Sep 28 '11 at 14:22

score 7 · Accepted Answer · answered Sep 28 '11 at 14:21

Using GD and Freetype2, if both installed, then you can add text to a JPEG using the following steps.

create an image resource from the file using imagecreatefromjpeg()
add text to that image using the Freetype2 library, via the function imagefttext() (note you can also use the function imagettftext() if you only have Freetype installed and not Freetype2).
save the modified image using imagejpeg()

Example:

[I've literally just typed this in to the browser, never run it - so if it needs amendment, apologies.]

/**
 * Annotate an image with text using the GD2 and Freetype2 libraries
 *
 * @author Orbling@StackOverflow
 *
 * @param string $sourceFileName Source image path
 * @param string $destinationFileName Destination image path
 * @param string $text Text to use for annotation
 * @param string $font Font definition file path
 * @param float $fontSize Point size of text
 * @param array $fontColour Font colour definition, expects
                            array('r' => #, 'g' => #, 'b' => #),
                            defaults to black
 * @param int $x x-coordinate of text annotation
 * @param int $y y-coordinate of text annotation
 * @param float $rotation Angle of rotation for text annotation,
                          in degrees, anticlockwise from left-to-right
 * @param int $outputQuality JPEG quality for output image
 *
 * @return bool Success status 
 */
function imageannotate($sourceFileName, $destinationFileName,
                       $text, $font, $fontSize, array $fontColour = NULL,
                       $x, $y, $rotation = 0, $outputQuality = 90) {
    $image = @imagecreatefromjpeg($sourceFileName);

    if ($image === false) {
        return false;
    }

    if (is_array($fontColour) && array_key_exists('r', $fontColour)
                              && array_key_exists('g', $fontColour)
                              && array_key_exists('b', $fontColour)) {
        $colour = imagecolorallocate($image, $fontColour['r'],
                                             $fontColour['g'],
                                             $fontColour['b']);

        if ($colour === false) {
            return false;
        }
    } else {
        $colour = @imagecolorallocate($image, 0, 0, 0);
    }

    if (@imagefttext($image, $fontSize, $rotation,
                     $x, $y, $colour, $font, $text) === false) {
        return false;
    }

    return @imagejpeg($image, $destinationFileName, $outputQuality);
}

NB. For debugging, I would remove the @ symbols.

I hadn't turned mine into a function. Very helpful answer. thanks +1 — Denoteone, Sep 30 '11 at 01:26
@Denoteone: Quite alright. Note that if you pass `NULL` for `$destinationFileName`, then due to the way `imagejpeg()` works, it will output the image to `stdout`. So if you want to write a script that returns the image, just output the appropriate content type headers for a JPEG and then output the file. — Orbling, Sep 30 '11 at 13:39
Wow, your code here plus this (http://stackoverflow.com/a/1558771/470749) were SUPER helpful to me tonight. Thanks! — Ryan, Jun 28 '16 at 04:57

Overlay image with text and convert to image

1 Answers1

Linked

Related