Bluring images in C# just as google plus does

Question

I'm trying to add a blur filter to my images using this snippet:

    public static Bitmap DoBlur(this Bitmap image, Int32 blurSize) {
        var rectangle = new Rectangle(0, 0, image.Width, image.Height);
        Bitmap blurred = new Bitmap(image.Width, image.Height);

        // make an exact copy of the bitmap provided
        using (Graphics graphics = Graphics.FromImage(blurred))
            graphics.DrawImage(image, new Rectangle(0, 0, image.Width, image.Height),
                new Rectangle(0, 0, image.Width, image.Height), GraphicsUnit.Pixel);

        // look at every pixel in the blur rectangle
        for (Int32 xx = rectangle.X; xx < rectangle.X + rectangle.Width; xx++) {
            for (Int32 yy = rectangle.Y; yy < rectangle.Y + rectangle.Height; yy++) {
                Int32 avgR = 0, avgG = 0, avgB = 0;
                Int32 blurPixelCount = 0;

                // average the color of the red, green and blue for each pixel in the
                // blur size while making sure you don't go outside the image bounds
                for (Int32 x = xx; (x < xx + blurSize && x < image.Width); x++) {
                    for (Int32 y = yy; (y < yy + blurSize && y < image.Height); y++) {
                        Color pixel = blurred.GetPixel(x, y);

                        avgR += pixel.R;
                        avgG += pixel.G;
                        avgB += pixel.B;

                        blurPixelCount++;
                    }
                }

                avgR = avgR / blurPixelCount;
                avgG = avgG / blurPixelCount;
                avgB = avgB / blurPixelCount;

                // now that we know the average for the blur size, set each pixel to that color
                for (Int32 x = xx; x < xx + blurSize && x < image.Width && x < rectangle.Width; x++)
                    for (Int32 y = yy; y < yy + blurSize && y < image.Height && y < rectangle.Height; y++)
                        blurred.SetPixel(x, y, Color.FromArgb(avgR, avgG, avgB));
            }
        }
        return blurred;
    }

which I found in the Internet of-course. I'm trying to blur an image to be like this:

which is blured by google plus as a page cover. But the best result I can get it something like this:

As you can see I'm not even closed! Do you have any idea what filter google is using? Or how can I achieve that?

This is the original which I'm testing on it:

Answer 1

The main problem is you're blurring the pixel with pixels to the left and below the source, but not to the right and top.

Try changing your inner loop to:

for (Int32 x = Math.Max(0, xx - blurSize); x <= Math.Min(xx + blurSize, image.Width-1); x++) 
{
    for (Int32 y = Math.Max(0, yy - blurSize); y <= Math.Min(yy + blurSize, image.Height-1); y++) 
    {