First impression on unpacking the Q702 test unit was the solid feel and clean, minimalist styling.
Dynamic image creation using PHP
- — 14 November, 2002 09:27
As well as being great for generating textual content dynamically, PHP is also useful for dynamically creating images. Using a special PHP extension, we'll explore the possibilities of image creation in this column over the next few columns.
To start with, you should recompile PHP with the graphics extensions we will need to use. They are: gd-1.8.4, Thomas Boutell's excellent graphics library; jpeg-6b, a JPEG manipulation library; and t1lib, a PostScript Type1 font library. Unpack each archive, compile and install based on the instructions included with each package.
Once they are installed, you will need to recompile PHP. To do so, change to the directory where the source is installed and run the following command:
./configure --with-gd --with-jpeg-dir=/path/to/libjpeg --with-t1lib --with-zlib-dir=/path/to/libz --with-apxs=/path/to/apache/apxs
You may be wondering how to determine the 'path to' information. Using the UNIX 'locate' utility, you will be able to find the path. For example:
$ locate libjpeg /usr/lib/libjpeg.so
This means that the argument to --with-jpeg-dir will be /usr/lib/. Additional explanation on configuring PHP can be found in the INSTALL file.
Once the new version of PHP is installed, restart your Web server.
Unlike text, images are generally represented in a predefined binary encoding, which maps which colours occur where on a two-dimensional grid. The two dimensions of this grid are marked by 'x' and 'y' axes - where 'x' refers to the horizontal dimension and 'y' refers to the vertical.
A pixel is a single position on this map. Programmers refer to a position in terms of its x/y co-ordinates. We will use the mathematical convention of (x,y) to mean 'the position at x-pixels across and y-pixels down'. The pixel in the top-most left-hand corner is position (0,0).
Pixels are simply points of colour. All colours are made of proportions of the primary colours: red, green and blue. The PHP image functions support 256 shades of each of these colours. As such, the number of combinations of red, green and blue supported are approximately 1.68 million and the image resolution is said to be 24 bit.
Creating a basic image
By default, PHP tells the Web browser to expect HTML. When sending an image, we must override this value using the header() function. The following script outputs a basic JPEG image, and tells the Web browser what to expect.
<? header("Content-type: image/jpeg"); $im = imagecreate(100,100); $bg = imagecolorallocate($im,255,255,255); $fg = imagecolorallocate($im,100,120,130); $borc = imagecolorallocate($im,0,0,0); imagefill($im,0,0,$bg); imagerectangle($im,0,0,99,99,$borc); imagestring($im,1,20,45,"Hello World",$fg); imagejpeg($im); imagedestroy($im); ?>
The script sets the new content type on its second line. This content type is a valid MIME type and tells the browser that the content is an image of type JPEG.
The third line creates the PHP image object or 'palette', $im. Three different colours are created, one for the background ($bg), one for the foreground ($fg), and one for the border ($borc).
The second, third and fourth arguments to imagecolorallocate() represent the proportions of red, green and blue, respectively.
The script then 'fills' the image with the background colour $bg (white), starting at the top left hand side (0,0). We then draw a rectangle on the image, starting at (0,0) and ending at (99,99). Since the palette is 100 pixels wide and 100 pixels high, the border follows each edge of the map.
The next line of the script draws the string 'Hello World' horizontally beginning at the position (20,45). The string is written in the colour $fg, using the built-in font '1'. There are five built-in fonts, enumerated from 1 to 5.
Experiment with these different fonts to see what they look like, but also to familiarise yourself with PHP's image functions (you will need to increase the size of the image to fit some fonts).
Finally, the script outputs the image in JPEG format to the browser, using the function imagejpeg(). We then tidy up by calling imagedestroy(), which de-allocates any memory used by the palette $im.
On the next page we'll look at more of the drawing functions as well as using some of the advanced imaging features PHP provides.