• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 291
  • Last Modified:

Using GD Library to create dynamic image AND add it to page content

I have some code below that takes an existing png file, adds some dynamic copy to it and generates a new image with the copy included into the image. Works great, no issues.
Problem I'm finding is I need to include the image along with some typical html content when the page is called. I can't add any html etc. to it because of the header info. Without it, the page just displays as raw gibberish for the image.

How can I get the dynamic image to display along with some html content?

$name = $_REQUEST["name"];

$filename = "certificate.png";  //name of image file
$fontsize = 30;                    //size of font
$fontfile = "Arial";                //name of ttf file, w/o ttf extension (courier in this case)
$text = "Congratulations ".$name."";             //text to write centered
$text2 = "You will receive $1000";             //second line to write centered

$im = imagecreatefrompng ($filename); //create the image resource

list ($im_width, $im_height) = getimagesize($filename);

//calculate the size of the bounding box  
$bbox = imagettfbbox($fontsize, 0, $fontfile, $text);
$bbox2 = imagettfbbox($fontsize, 0, $fontfile, $text2);
$text_width = $bbox[2]-$bbox[0];
$text_height = $bbox[1]-$bbox[7];
$text_width2 = $bbox2[2]-$bbox2[0];
$text_height2 = $bbox2[1]-$bbox2[7];

//write the text to the file, centered as calculated from (W-w)/2
//where W is the image dimension and w is the text dimension
imagettftext($im, 30, 0, ($im_width-$text_width)/2, ($im_height-$text_height)/2, 0, $fontfile, $text);
imagettftext($im, 20, 0, ($im_width-$text_width2)/2, ($im_height-$text_height2)/2 + 40, 0, $fontfile, $text2);

header('Content-type: image/png');
//destroy the image resource

Open in new window

  • 2
1 Solution
Ray PaseurCommented:
You can use an HTML tag like this to create the image:

<img src="path/to/image.php?img=image.png&text=Hello+World" />

The browser will request the file at path/to/image.php and will send the GET request containing img=image.png&text=Hello+World

once you have that working, you can add that tag to the rest of your HTML and you should be good to go!
tjyoungAuthor Commented:
Yep, good to go.
Thanks as always.
Ray PaseurCommented:
You're welcome.  Give it a try and if something goes Charlie Sheen on you, post back and I'll try to help!
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

Free Tool: Subnet Calculator

The subnet calculator helps you design networks by taking an IP address and network mask and returning information such as network, broadcast address, and host range.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now