Drawing On Our Image: Lines - Page 4
December 15, 2000
Now that we've seen how the coordinate system works and have two
colors to draw with, we can start making pictures. But what about
allocating a background color for our image?
ImageCreate() didn't have an argument that allowed
us to specify the background color of the image.
As it happens, we don't need to tell the image what its
background color is explicitly; the first color we allocate to
the image automatically becomes the background color. Looking
back at the code that we've covered so far:
$image = ImageCreate(200,150);
$gray = ImageColorAllocate($image,204,204,204);
$blue = ImageColorAllocate($image,0,0,255);
we see that the first color allocated was $gray. Our
background color for $image will therefore
automatically be gray. We will use our pure blue
$blue to draw the shapes on our image.
Lines
To draw a line, we use the ImageLine() function,
using the following format:
ImageLine($image, 10,10, 150,30, $blue);
As usual, the first thing we have to tell the function is the
identifier of the image canvas we're working on. The next two
arguments are the x and y coordinates of the start of the line,
while the two after that are coordinates for the end of the line.
The final argument is the identifier for the color in which we'll
be drawing the line.
| The example above draws a line that starts 10 pixels from the
left and 10 pixels from the top of the image, and ends at x =
150, y = 30. The layout of the resulting image is shown in the
diagram: |
|
Once the line has been drawn onto the image canvas, we need to
either save the canvas to disk or send it to the browser. We're
going to do the latter, using a function. This only requires one
piece of information: the identifier of the image canvas that we
want to output:
ImageJPEG($image);
If we want to save the image to disk, we can specify a second
argument, containing the filename we want to use:
ImageJPEG($image, "image.jpg");
If we're saving the image as a disk file, we can also specify a
third argument. This must be an integer value between 1 and
100, which specifies the quality of the resulting JPEG image.
A value of 0 will generate a small file but consequently a very
low quality image. On the other hand, a value of 100 will give
you high quality but a larger file. The images below should gives
you some idea of the trade-offs you'll be looking at:
| Line quality = -1 |
|
Line quality = 20 |
|
|
|
| Line quality = 100 |
|
A value of 1 tells the ImageJPEG() function
that it should use default quality, which should be very close to
optimal in practice this is equivalent to a setting of
around 70.
Something else that we need to bear in mind at this point is the
Header() function. Whenever we send non-HTML data to
the browser, we should let it know what it is, so that it can be
properly processed. We use this function at the top of our
example to produce a page header, and let the browser know what
sort of file to expect:
Header("Content-type: image/jpeg");
Finally, we need to call the ImageDestroy() function
with the image identifier. It will be no surprise to you that
this function destroys the image canvas, freeing up the server
memory it occupied.
Let's take a look at our complete code at this point:
<?php
//draw1.php
Header("Content-type: image/jpeg");
$image = ImageCreate(200,150);
$gray = ImageColorAllocate($image,204,204,204);
$blue = ImageColorAllocate($image,0,0,255);
ImageLine($image,10,10,150,30,$blue);
ImageJPEG($image);
ImageDestroy($image);
?>
| Which gives us: |
|
Creating an Image - Page 3
Beginning PHP4
Drawing On Our Image: Circles - Page 5
|