Are you getting bored with standard PHP functions?  Do you want to venture into additional libraries of PHP code? If so, GD is an additional module that allows the programmer to develop graphics using PHP. Cool huh? You can do things from drawing lines, to adjusting contrast, to anti-aliasing.

Before we start we need to make sure that your web server has GD enabled. To do this, make a new file called phpinfo.php with the following string as its only content:

<? phpinfo() ?>

This will output a big list of PHP settings, which is probably not very user friendly. You are looking for a specific section - it will look something like the following if GD is enabled on your server:

This is an example of the output of phpinfo() for a bundled GD distribution, which is the common one, as it comes with newer versions of PHP. If you don’t find this part in your phpinfo() output then you will need to find a server that does support the libraries.

So, what are we going to learn in this tutorial? Let’s have a look:

· Basic concepts
· Drawing lines
· Drawing polygons
· Drawing rectangles
· Drawing circles and ellipses
· Filling shapes
· Writing text on an image
· Outputting the image

That said, let’s get going! First of all, some basic concepts:

Basic Concepts
The first thing you should learn about GDlib is its capabilities. GD is a library of PHP functions that allows you to alter or create images online. You can adjust the output quality, load files and alter them, or create new images from scratch. PHP images can be used just like any other image, i.e. you could use the following HTML to display a dynamic PHP image on a webpage:

<img src=”myscript.php” style=”width: 400px; height: 200px” alt=”My dynamic PHP image” />

This is an example of valid XHTML syntax to display a dynamic image on a webpage. Note that a lot of things are depreciated in XHTML, so you can’t use attributes like height or width anymore, which is why I used a CSS-style definition instead. You can apply id’s or classes if that is your fancy.

So, let’s start with some basic concepts. When you create an image from scratch, you use the imagecreate() function to create a canvas. Its attributes are the x width and the y width. Here’s an example of the code for a 800x400px canvas:
 

You really need to get used to using image identifiers in GD, $im is the default variable and is used a lot, although you don’t have to use if you don't like it for some reason.

Next up, let’s learn how to allocate some colours, using imagecolorallocate(). With this, you can define colours for anything, and it is essential if you want colours in your image. This function accepts arguments 4 arguments: [image identifier], [R], [G], [B]. You put your image identifier variable in place, and numbers between 1 and 255 for each colour (red, green and blue). You can define as many different variables as you like in different variables. Let’s have a look at an example I prepared earlier:

Coordinates are pretty easy to understand, using the concept: x, y, the top left corner is 0, 0. So if we have a 150px square image, the top right corner will be 150, 0, the bottom left will be 0, 150, and the bottom right will be 150, 150.

Outline functions (non fill functions) will by default draw a 1px outline, and you can figure out for yourself how to make thicker lines... ;)

Finally, let’s find out how to load an image as opposed to creating a canvas. There are special PHP functions to load images, and you can load an image in the following main formats: .jpeg, .gif, .wbmp, and .png. Instead of defining the image identifier with imagecreate() we simply define it using one of the following functions:

· JPG/JPEG: imagecreatefromjpeg([filename])
· GIF: imagecreatefromgif([filename])
· BMP: imagecreatefromwbmp([filename])
· PNG: imagecreatefrompng([filename])

And that’s it! You can run a few protection procedures if you like, to check whether the image was opened or not - all of these functions return false if there was an error.

Right. That’s the basic principles of GD out of the way.  You will need to know how to output the image once you’re finished, but that topic will be covered last.

- Tutorial written by Scrowler

Pages (4): [1] 2 3 4 Next>

Automatic Translations: