|
|
Creating Graphics in PHP
Posted On May 14, 2007 by Ramdas S filed under
We use PHP for creating web pages. We use the server side scripting features of this nifty language, and use it for purposes such as reading and manipulating database information or managing mails. But there is something more, which we usually do not try such as adding graphics to your web pages. Using PHP you can generate graphics, and you can write scripts that will do some creative work for you. On a web page, a graphic can be any image file seen on the page. However it is not just limited to just pictures. You can also create drawings and complicated graphics using PHP. PHP contain a range of functions that enable you to open, manipulate, and output graphics to the web browser.
PHP has the amazing ability to create dynamic images on the fly using server-side scripts. The graphic functions that used in PHP are based on the GD Library. This is developed by Boutell.com (www.boutell.com). GD Library is commonly used to generate charts, graphics, thumbnails.
Kinds of computer graphics
Before generating images in PHP you need to follow these steps. · Create a blank image canvas for PHP to work with. This is basically an area of memory that is set aside, within which the PHP image functions will draw image data.· Include the code to setup the colors and drawing the shapes and the text that you want with in the Images.· Send your finished image to the Web browser· Finally remove your image from the server memory Creating a New Image
Create a new blank image canvas for PHP to work in. For that you can use either the imagecreatetruecolour () function, which creates a true color image capable of including 16 million colors or use the imagecreate () function, which create a palette-based image with a maximum of 256 colors. Both these functions take two parameters. That is height and width of the blank image that you want to create.
Existing Images Opening
Now we have learned how to create and build images using the drawing functions of the GD image library.
But how to work with existing images which have resolution running in millions of colors. Well, it is possible you to create new images that is based on an existing JPEG, GIF or PNG images using GD image library.
To create a new image based on the existing image, use the imagecreatefrom series of functions. The most common functions are imagecreatefromjpeg(), imagecreatefromgif(), and imagecreatefrompng().There are other functions that they aren’t commonly used as these.
The imagecreatefromjpeg() function works in the same way as the imagecreate() function works. The only difference is instead of passing the width and height of the new image as parameters, you only pass the filename of the existing image as a string. Following syntax creates the image from the existing image.
$image = imagecreatefromjpeg(‘DIQ.gif’)
Make sure that image is store in the same directory where the .php file is stores. Now we will write a small script to display the image on the browser. Open the editor and add the following code. (code2)
code2
<?php Header("Content-type: image/jpeg");$image = imagecreatefromjpeg('myimage.jpg');imagejpeg($image);imagedestroy($image);?>
Save the file as second_graphic.php. Make sure that the image is also saved in the same folder. Browse the second_graphic.php file in the web browser. You will see the picture as shown in the image. (Image2)
php_image2.tif
Using GD image function you can also resize the image dimensions to create a thumbnail for display, or drop image quality for faster load. You can also copy a portion of another image into it to use a watermark for copyright purpose. Now we will see how to create a watermark for an image.
Applying Watermark on Image
Most of the Websites will have the original Photographs or artwork images. If you want to protect your intellectual property from being stolen, the best way to do is to apply the watermark to the image so that it is still recognizable, but it stops someone else from using as his own. Watermarking is a technique that provides a solution to the longstanding problems faced with copyrighting digital data.
Using the imagecopy() function you can watermark an image. The imagecopy () function takes eight parameters that tells what to copy from the source image and where to place it in the destination image. Modify the second_graphic.php file and code should look like as shown below. (code3)
(code3)
<?php Header("Content-type: image/jpeg");$image = imagecreatefromjpeg('myimage.jpg');$copyright = imagecreatefromjpeg('copy.jpg'); $iwidth = imagesx($image);$iheight = imagesy($image); $cwidth = imagesx($copyright);$cheight = imagesy($copyright); $dx = ($iwidth - $cwidth) / 2;$dy = (iheight - $cheight) / 2; imagecopy ($image, $copyright, $dx, $dy, 0, 0, $cwidth, $cheight);imagejpeg($image);imagedestroy($image);imagedestroy($copyright);?>
In the above code imagesx() function returns the width of the an image and the imagesy() returns the height of the image. Both the functions take the single parameter of the image resource identifier of the image. If you want to position the copyright in the center of the image you have to get the width and the height of the both images and then dividing the difference by two. (Image3)
php_image3.tif
Displaying Transparent Images
You must have noticed that we have displayed the copyright image on the top of other image. Instead of displaying the entire image, as it is you can delete the white space and display only text. To do that you have to use the imagecolorexact() function. This function returns the index of the specified color in the palette of the image. Using the imagecolortransparent() function, which will sets the transparent color in the image image to color.
$white = imagecolorexact ($copyright, 255, 255, 255);imagecolortransparent ($copyright, $white);
Add these two lines in the above code and save the script. View the result in the browser.
Conclusion
In this article we have seen how to create and output images with PHP and also we learned how to apply watermark on images.
PHP has the amazing ability to create dynamic images on the fly using server-side scripts. The graphic functions that used in PHP are based on the GD Library. This is developed by Boutell.com (www.boutell.com). GD Library is commonly used to generate charts, graphics, thumbnails.
Kinds of computer graphics
Basically there are two kinds of computer graphics - raster (composed of pixels) and vector (composed of paths). Raster images are more commonly called bitmap images.
Before generating images in PHP you need to follow these steps. · Create a blank image canvas for PHP to work with. This is basically an area of memory that is set aside, within which the PHP image functions will draw image data.· Include the code to setup the colors and drawing the shapes and the text that you want with in the Images.· Send your finished image to the Web browser· Finally remove your image from the server memory Creating a New Image
Create a new blank image canvas for PHP to work in. For that you can use either the imagecreatetruecolour () function, which creates a true color image capable of including 16 million colors or use the imagecreate () function, which create a palette-based image with a maximum of 256 colors. Both these functions take two parameters. That is height and width of the blank image that you want to create.
$image = ImageCreate(100,150); The above line will create 100 pixels wide and 150 pixels of high. To add a color to the blank image you have to use the imagecolorallocate() function. This function takes four parameters.
$yellow = ImageColorAllocate($image, 39, 221, 240);
The first parameter is the image identifier of the image that you want to allocate this color. The next three parameters are the read, green and blue values for the color that you want to display the blank image.
The PHP image library provides functions for drawing lines, rectangles, points, ellipses etc. In PHP all the drawing functions have a similar pattern in the parameters that you need to pass.
To do a single pixel on your canvas, use the imagesetpixel() function.
imagesetpixel($image, 80,90, $yellow)
The above function sets a single pixel s on the graphic $image at 80 pixels in across and 90 pixels down, and the color of the pixel will be yellow.
Drawing Line
Using imageline() function you can draw a line in an image. This function needs to have start and end points. imageLine ($image, 10, 9, 50, 100, $yellow);
In the imageline() function, the first parameter is always the image identifier of the image. The next two parameters tells where the line starts. That is 11 pixel across and 10 pixels down. The next two parameters tell the function, where the line should end. That is 51 pixels across and 101 pixels down.
Now we will see a quick example how to draw a line on the web browser. Open a text editor or the PHP compactable editor and add the following code. (code1) code1
<?php header("Content-type: image/jpeg"); $image = imagecreate(100,150); $blue = imagecolorallocate($image, 39, 221, 240); $red = imagecolorallocate($image,255,0,0); imageline ($image, 10, 9, 50, 100, $red); imageJPEG($image); imagedestroy($image);?>
save the file as first_graphic.php and view the results in the browser. You can see the result as shown in the picture below. (image1)
php_image1.tif
In the above code header() function is used to send a header to the browser telling it the type of data that it is about to retrieve. This ensures that the browser displays the information correctly. The imagecreate() function returns an image identifier that you store in the $image variable. The blue color is allocated as the background color of the image. Using imageline () function we are drawing the line on blue background. The imagejpeg() function, passes it the image identifier as parameter. This sends the image data stored in $image as a JPEG image to the browser. Finally you will release the image from memory using the imagedestory() function. Similarly you can try drawing circles and rectangles in the browser. Existing Images Opening
Now we have learned how to create and build images using the drawing functions of the GD image library.
But how to work with existing images which have resolution running in millions of colors. Well, it is possible you to create new images that is based on an existing JPEG, GIF or PNG images using GD image library.
To create a new image based on the existing image, use the imagecreatefrom series of functions. The most common functions are imagecreatefromjpeg(), imagecreatefromgif(), and imagecreatefrompng().There are other functions that they aren’t commonly used as these.
The imagecreatefromjpeg() function works in the same way as the imagecreate() function works. The only difference is instead of passing the width and height of the new image as parameters, you only pass the filename of the existing image as a string. Following syntax creates the image from the existing image.
$image = imagecreatefromjpeg(‘DIQ.gif’)
Make sure that image is store in the same directory where the .php file is stores. Now we will write a small script to display the image on the browser. Open the editor and add the following code. (code2)
code2
<?php Header("Content-type: image/jpeg");$image = imagecreatefromjpeg('myimage.jpg');imagejpeg($image);imagedestroy($image);?>
Save the file as second_graphic.php. Make sure that the image is also saved in the same folder. Browse the second_graphic.php file in the web browser. You will see the picture as shown in the image. (Image2)
php_image2.tif
Using GD image function you can also resize the image dimensions to create a thumbnail for display, or drop image quality for faster load. You can also copy a portion of another image into it to use a watermark for copyright purpose. Now we will see how to create a watermark for an image.
Applying Watermark on Image
Most of the Websites will have the original Photographs or artwork images. If you want to protect your intellectual property from being stolen, the best way to do is to apply the watermark to the image so that it is still recognizable, but it stops someone else from using as his own. Watermarking is a technique that provides a solution to the longstanding problems faced with copyrighting digital data.
Using the imagecopy() function you can watermark an image. The imagecopy () function takes eight parameters that tells what to copy from the source image and where to place it in the destination image. Modify the second_graphic.php file and code should look like as shown below. (code3)
(code3)
<?php Header("Content-type: image/jpeg");$image = imagecreatefromjpeg('myimage.jpg');$copyright = imagecreatefromjpeg('copy.jpg'); $iwidth = imagesx($image);$iheight = imagesy($image); $cwidth = imagesx($copyright);$cheight = imagesy($copyright); $dx = ($iwidth - $cwidth) / 2;$dy = (iheight - $cheight) / 2; imagecopy ($image, $copyright, $dx, $dy, 0, 0, $cwidth, $cheight);imagejpeg($image);imagedestroy($image);imagedestroy($copyright);?>
In the above code imagesx() function returns the width of the an image and the imagesy() returns the height of the image. Both the functions take the single parameter of the image resource identifier of the image. If you want to position the copyright in the center of the image you have to get the width and the height of the both images and then dividing the difference by two. (Image3)
php_image3.tif
Displaying Transparent Images
You must have noticed that we have displayed the copyright image on the top of other image. Instead of displaying the entire image, as it is you can delete the white space and display only text. To do that you have to use the imagecolorexact() function. This function returns the index of the specified color in the palette of the image. Using the imagecolortransparent() function, which will sets the transparent color in the image image to color.
$white = imagecolorexact ($copyright, 255, 255, 255);imagecolortransparent ($copyright, $white);
Add these two lines in the above code and save the script. View the result in the browser.
Conclusion
In this article we have seen how to create and output images with PHP and also we learned how to apply watermark on images.