PHp makes it very easy for you to draw an image for you on the fly in a website.This can be used to draw captcha images(image verifications to prevent spam).You can draw images and write text inside the image.

In this tutorial,I will explain how you can draw an image set the colours of its background, the text and the lines you draw, write text to that image, draw a line and set its thickness.The image that you draw on a php page can be set as the image source of an image which is placed on another page

For ex <img src=”img.php>

Note: img.php is the php page on which you have put the code to draw the image

Prerequisites

 

1.     Basic PHP Knowledge

I will assume that you already have some basic knowledge about php programming and you are not a newbie. If not, you may wish to check out my basic PHP tutorial

 

2.GD Library.  

  For any of the functions that are used here, your PHP interpreter must have been compiled with the GD library. If you are using the PHP provided by a  commercial webhost, GD library will be available as a feature

Here is the code

 myimg.php

<?php

$my_img = imagecreate( 200, 80 );

$background = imagecolorallocate( $my_img, 0, 0, 255 );

$text_colour = imagecolorallocate( $my_img, 255, 255, 0 );

$line_colour = imagecolorallocate( $my_img, 128, 255, 0 );

imagestring( $my_img, 4, 30, 25, "www.shefeekj.com",

  $text_colour );

imagesetthickness ( $my_img, 5 );

imageline( $my_img, 30, 45, 165, 45, $line_colour );

 

header( "Content-type: image/png" );

imagepng( $my_img );

imagecolordeallocate( $line_color );

imagecolordeallocate( $text_color );

imagecolordeallocate( $background );

imagedestroy( $my_img );

?>

</quickcode>

The above code creates a 200×80 PNG image with a blue background and yellow text. It can be called from any webpage simply giving the name of the php file as the src of the image. For example, if the PHP file that contains the above code is called myimage.php, then the HTML code to invoke it can simply be:

<img src=”myimpage.php” alt=”Image created by shefeekj.com” width=”200″ height=”80″>

 

Code Explained

·         Creating the Image

        The image is created using imagecreate() function with parameter as its width and height

 

imagecreate(width,height) 

 

·         Using Colours in PHP

Before you can use any sort of colours in your image at all, you will need to allocate the colour. Colours are represented by three digits, known as the RGB value. The first digit denotes the red component, the second the green and the third blue, hence RGB, for Red-Green-Blue. These are the same colour values that you use for your web page as well as numerous other computer applications.

Colours are allocated using the imagecolorallocate() function. This function will automatically fill the background of the image with the colour the first time you call it, as well as return an identifier for that particular colour. Subsequent calls toimagecolorallocate() will simply create a colour identifier for your colour, without affecting your image background.

As you can see from the above code, my script allocates a blue identifier for the image, and in so doing, causesimagecolorallocate() to set the background to blue automatically. It also allocates a colour identifier for yellow and one for a shade of green. The latter two identifiers will be used later to write text and draw a line.

imagecolorallocate() returns FALSE if the function fails for any reason.

·         Writing Text to the Image

To write text to your image, you will need to use the imagestring() function. This function uses a set of built-in fonts to do the writing. The fonts have various sizes, ranging from 1 to 5, where 1 is the smallest font size and 5 the largest. The size of the font is specified in the second parameter to the function. In my example, I used font size 4.

The third and fourth parameters to imagestring() specify the x,y coordinate for the top left hand corner of the text. In the case of the example above, my text will begin 25 pixels from the top edge of the image, and 30 pixels from the left.

The fifth parameter is for the text to print, and the final parameter the colour of the text. This is the same colour that was allocated earlier using imagecolorallocate().

·         Drawing a Line and Setting the Thickness of the Brush

The imageline() function can be used to draw a line to the image. To set the thickness of the brush used to draw the line, you may want to call the imagesetthickness() function as I did in my example. The numeric parameter to imagesetthickness() is the thickness of the brush in pixels. In my code, I set it to 5 pixels. If you don’t call imagesetthickness(), the line will be 1 pixel thick.

The imageline() function is called with the start and end coordinates of the line, in x,y format. In my code, the line starts from 30,45 and ends on 165,45. That is, it will be a horizontal line 45 pixels from the top, starting 30 pixels from the left edge and ending 165 pixels from that same edge. Since $line_colour was set to a shade of green earlier, the line will be green.

·         How to Output the Image

Since the output of my example script is the image itself, I send an “image/png” content type header to the browser telling it that what follows are the bytes of a PNG image. The function imagepng() is then called to generate the necessary image from my $my_img image identifer. Since I called imagepng() without a second parameter, the function automatically sends its output to the browser. If you prefer to save your image, don’t call the header() function to output the header, and call imagepng() with the filename of the image for its second parameter, like the following:

imagepng( $my_img, “my_new_image.png” );

Your image does not have to be a PNG image. You can use imagegif() or imagejpeg() to create GIF and JPG images respectively. You should of course send the correct content type header for the type of image you are creating. For example, a jpeg image should have a content type of “image/jpeg” while a gif image “image/gif”. Note though that GIF support may or may not necessarily be compiled into the version of the GD library your web host is using, so if you’re not sure, use one of the other file formats.

·         Freeing Resources

On completion, the program releases the resources associated with the image by calling imagecolordeallocate() andimagedestroy(). I’m not sure if any of these calls are really necessary if your script is going to terminate immediately, since I don’t know if PHP automatically cleans up all these resources on the termination of the script. I like to put those calls there for completeness.