Phone Vision 12–Smoothing Filters |

Phone Vision 12–Smoothing Filters

15 02 2011

What does it mean to smooth an image? When I imagine a smooth surface it doesn’t have a lot of bumps or pits. If we were to try to smooth out a rough piece of wood we would probably sand down the peaks and fill in holes. If you apply that analogy to an image it sounds a lot like averaging a neighborhood.

Average Filter

If you remember from last time we described a neighborhood filter using a number of weights as follows:

A simple average would allow all of the pixels in the neighborhood to contribute equally to the average. In that case would represent the filter as:

Using our code from last time, the filter looks like

int[,] filter = new int[,]

{

{ 1, 1, 1 },

{ 1, 1, 1 }

};

And here are the results when we run it:

The original is on the left and the smoothed version is on the right. Notice how the large objects are relatively unchanged, but the small objects have lost a lot of information. In addition to removing noise, if we are trying to segment large objects, we can use smoothing to blur out the small objects.

Modified Filter Code

If we run this filter enough times we will eventually get every pixel to be some sort of gray. It would be more efficient just to increase the size of the window. Let’s modify the filtering code to accept a square filter of arbitrary size.

private WriteableBitmap Filter(WriteableBitmap grayscale, int[,] filter)

{

// we are still going to create a new image

// because we don’t want to modify the

// old image as we are processing it

WriteableBitmap filtered =

new WriteableBitmap(

grayscale.PixelWidth,

grayscale.PixelHeight);

// boiler plate code for our

// histogram stuff

int[] histogram = new int[256];

int maxIntensity = 0;

//here’s where the magic starts

//assume the filter is square

int length = (int)Math.Sqrt(filter.Length);

int filterMagnitude = 0;

for (int x = 0; x < length; x++)

{

for (int y = 0; y < length; y++)

{

filterMagnitude += filter[x, y];

}

// this will be used for our loops

// it’s important that our size is odd

// so that our current pixel can be the

// center point.

int radius = length / 2;

// the math is still easier if we create two loops

// instead of one

for (int y = 0; y < grayscale.PixelHeight; y++)

{

for (int x = 0; x < grayscale.PixelWidth; x++)

{

//here’s the pixel we’re centered on

int pixel = x + y * grayscale.PixelWidth;

byte intensity = (byte)grayscale.Pixels[pixel];

// if we are on an edge we are going to leave it

// as the original intensity. you will see the

// edges increasingly unsmoothed as the window

// size increases. here we are using the radius

// to determine our bounds

if (y <= radius – 1 ||

x <= radius – 1 ||

y >= grayscale.PixelHeight – radius ||

x >= grayscale.PixelWidth – radius)

{

//maintain the original / non-smoothed

filtered.Pixels[pixel] = (255 << 24)

| (byte)intensity << 16

| (byte)intensity << 8

| (byte)intensity;

histogram[intensity]++;

if (histogram[intensity] > maxIntensity)

{

maxIntensity = histogram[intensity];

}

continue;

}

int newIntensity = 0;

//going from -radius to radius makes the

//math easier here too

for (int yoffset = -radius; yoffset <= radius; yoffset++)

{

for (int xoffset = -radius;

xoffset <= radius;

xoffset++)

{

// we loop through each pixel in the neighborhood

// and apply the filter. by ‘apply the filter’

// I mean multiply it by the appropriate weight

newIntensity +=

((byte)grayscale.Pixels

[(x + xoffset)

+ (y + yoffset) * grayscale.PixelWidth])

* filter[(yoffset + radius),

(xoffset + radius)];

}

// scale the new intensity back

newIntensity /= filterMagnitude;

newIntensity =

Math.Max(Math.Min(newIntensity, 255), 0);

// and now just set the color

filtered.Pixels[pixel] = (255 << 24)

| (byte)newIntensity << 16

| (byte)newIntensity << 8

| (byte)newIntensity;

histogram[(byte)newIntensity]++;

if (histogram[(byte)newIntensity] > maxIntensity)

{

maxIntensity = histogram[(byte)newIntensity];

}

PlotHistogram(histogram, maxIntensity);

return filtered;

}

Now we can really smooth the image.

A Large Filter

A 21×21 filter is about as large as I can do without having the mask wrap to the next line.

int[,] filter = new int[,]

{

{ 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1 },

};

We coded it so that the edges are unfiltered. To work around this issue you can perform your average with the pixels you have available. Notice here that the large objects are still relatively unchanged, while the smaller objects have lost a substantial amount of information.

Summary

This technique is pretty easy. More important however, is that the masks can be changed easily and the effects can be seen instantly. Once again I recommend that you play around with the masks on your own. As we’ll see soon they can be used for things far more powerful than blurring an image.

Download Code

http://cid-88e82fb27d609ced.office.live.com/embedicon.aspx/Blog%20Files/PhoneVision/PhoneVision%2012%20-%20Smoothing%20Filters.zip

Up next: Sharpening Filters

Actions

Information

Date : 02.15.2011
Tags: Azzl Software, Azzlsoft, Blur, Computer Vision, Convolution Mask, Grayscale, Histogram, Phone Vision, RGB, Smooth, Spatial Filters, Windows Phone, WP7, WriteableBitmap
Categories : Phone Vision, Technology

3 responses

15 02 2011: Phone Vision 11–Intro to Spatial Filters « (09:57:32) :

[…] Up next: Smoothing Filters […]

Reply
21 02 2011: Phone Vision – 13 Sharpening Filters « (10:12:06) :

[…] Smoothing an image was pretty intuitive. When we are smoothing an image we are actually trying to suppress details in the image. When we sharpen an image we are trying to do the opposite. So, how do we do that? […]

Reply
1 03 2011: Phone Vision 15 – Median Filters « (14:15:26) :

[…] is a median filter? If you understand the average filter (or mean filter) then the median filter should give you no troubles at all – assuming you know […]

Reply