Developing Filters with the Convolution Technique
To implement filters such as embossing and blurring you use the "convolution" technique—a mathematical operation that replaces the value of a pixel with the well-balanced sum of the values that surround that pixel. The advantage of understanding how to create these filters is that you can use the knowledge to personalize the filters exactly as you need. Some of the predefined filters don't offer you sufficient control to achieve special effects.
The convolution technique uses a matrix, known as the "mask of convolution" or "kernel." Most kernels have 3x3 elements, but that's not a hard-and-fast rule. Here's the general equation that describes the convolution technique:
The equation contains the following notations:
- Id—Image destination (this image is the result of the filter)
- Is—Image source (this image supports the filter)
- a,b—Represents the coordinates of the central pixel
- K—Represents the kernel
|Figure 20. Applying a 3x3 Matrix Convolution: Matrix convolutions work by averaging pixel colors with those of surrounding pixels using this process.|
The convolution technique takes pixels from left to right and from top to bottom. The convolution will fill the boundary of the image with zero values or it will leave them unchanged. Figure 20
illustrates how the convolution processes image pixels.
You use different kernels for different effects. Here's a list showing the most common 3x3 kernels:
Edge detection kernel
Here are two applications that use the convolution technique. The first application implements an emboss filter (see Listing 3 and Figure 21), and the second, in Listing 4, implements a sharpen filter (see Figure 22). Note how this customized emboss filter differs from the built-in emboss filter shown in Figure 17—and that you can't achieve this precise effects using the built-in filter. The sharpen filter provides a much-needed addition to the built-in filter effects.
|Figure 21. Modified Emboss Filter: Using custom kernels, you can achieve matrix effects that aren't possible with the built-in filters.||
|Figure 22. Sharpen Filter: This custom Sharpen Filter enhances edges.||
Moving Chunks of Pixels
|Figure 23. Puzzle Filter: Using the imagecopy function, you can move chunks of an image from one location to another.|
You've seen examples of creating image filters that work by modifying pixel color, hue, saturation, etc., or by using a matrix to determine a pixel's value based on adjacent pixels. You can also create filters by moving pixels from one place to another without changing their values, which results in some interesting effects. For example, suppose that you want to develop a puzzle game using images provided by players. To do that, you have to implement an image filter that cuts any image into random puzzle pieces. This application shown in Listing 5
does exactly that, using the imagecopy
function described near the beginning of this article:
By this time, you should have a good grasp of the underlying operations that create image filters and how you can develop customized versions in PHP. PHP offers good support for image processing, including several useful built-in filters—and as you have probably noticed—makes it very easy to extend modules by writing new filters from scratch.