 # Cairo gaussian blur for shadows

I wanted to create some shadows for my cairo drawings, like in

http://ssalewski.de/PetEd.html.en

One method is gaussian blur – it never made it into cairo, but there is some c example code in

https://www.cairographics.org/cookbook/blur.c/

I tested it with https://www.cairographics.org/FAQ/#minimal_C_program

Here is the code:

``````// https://www.cairographics.org/FAQ/#minimal_C_program
// https://www.cairographics.org/cookbook/blur.c/
// cc -o hello `pkg-config --cflags --libs cairo` -lm hello.c
#include <cairo.h>
#include <math.h>
#include <stdint.h>

#define ARRAY_LENGTH(a) (sizeof (a) / sizeof (a))

/* Performs a simple 2D Gaussian blur of radius @radius on surface @surface. */
void
{
cairo_surface_t *tmp;
int width, height;
int src_stride, dst_stride;
int x, y, z, w;
uint8_t *src, *dst;
uint32_t *s, *d, a, p;
int i, j, k;
uint8_t kernel;
const int size = ARRAY_LENGTH (kernel);
const int half = size / 2;

if (cairo_surface_status (surface))
return;

width = cairo_image_surface_get_width (surface);
height = cairo_image_surface_get_height (surface);

switch (cairo_image_surface_get_format (surface)) {
case CAIRO_FORMAT_A1:
default:
/* Don't even think about it! */
return;

case CAIRO_FORMAT_A8:
/* Handle a8 surfaces by effectively unrolling the loops by a
* factor of 4 - this is safe since we know that stride has to be a
* multiple of uint32_t. */
width /= 4;
break;

case CAIRO_FORMAT_RGB24:
case CAIRO_FORMAT_ARGB32:
break;
}

tmp = cairo_image_surface_create (CAIRO_FORMAT_ARGB32, width, height);
if (cairo_surface_status (tmp))
return;

src = cairo_image_surface_get_data (surface);
src_stride = cairo_image_surface_get_stride (surface);

dst = cairo_image_surface_get_data (tmp);
dst_stride = cairo_image_surface_get_stride (tmp);

a = 0;
for (i = 0; i < size; i++) {
double f = i - half;
a += kernel[i] = exp (- f * f / 30.0) * 80;
}

/* Horizontally blur from surface -> tmp */
for (i = 0; i < height; i++) {
s = (uint32_t *) (src + i * src_stride);
d = (uint32_t *) (dst + i * dst_stride);
for (j = 0; j < width; j++) {
d[j] = s[j];
continue;
}

x = y = z = w = 0;
for (k = 0; k < size; k++) {
if (j - half + k < 0 || j - half + k >= width)
continue;

p = s[j - half + k];

x += ((p >> 24) & 0xff) * kernel[k];
y += ((p >> 16) & 0xff) * kernel[k];
z += ((p >>  8) & 0xff) * kernel[k];
w += ((p >>  0) & 0xff) * kernel[k];
}
d[j] = (x / a << 24) | (y / a << 16) | (z / a << 8) | w / a;
}
}

/* Then vertically blur from tmp -> surface */
for (i = 0; i < height; i++) {
s = (uint32_t *) (dst + i * dst_stride);
d = (uint32_t *) (src + i * src_stride);
for (j = 0; j < width; j++) {
d[j] = s[j];
continue;
}

x = y = z = w = 0;
for (k = 0; k < size; k++) {
if (i - half + k < 0 || i - half + k >= height)
continue;

s = (uint32_t *) (dst + (i - half + k) * dst_stride);
p = s[j];

x += ((p >> 24) & 0xff) * kernel[k];
y += ((p >> 16) & 0xff) * kernel[k];
z += ((p >>  8) & 0xff) * kernel[k];
w += ((p >>  0) & 0xff) * kernel[k];
}
d[j] = (x / a << 24) | (y / a << 16) | (z / a << 8) | w / a;
}
}

cairo_surface_destroy (tmp);
cairo_surface_mark_dirty (surface);
}

int
main (int argc, char *argv[])
{
cairo_surface_t *surface =
cairo_image_surface_create (CAIRO_FORMAT_ARGB32, 240, 80);
cairo_t *cr =
cairo_create (surface);

cairo_set_source_rgb (cr, 1.0, 1.0, 1.0);
cairo_paint(cr);

cairo_select_font_face (cr, "serif", CAIRO_FONT_SLANT_NORMAL, CAIRO_FONT_WEIGHT_BOLD);
cairo_set_font_size (cr, 32.0);
cairo_set_source_rgb (cr, 0.0, 0.0, 1.0);
cairo_move_to (cr, 10.0, 50.0);
cairo_show_text (cr, "Hello, world");

cairo_destroy (cr);

blur_image_surface (surface, 16);

cairo_surface_write_to_png (surface, "hello.png");
cairo_surface_destroy (surface);
return 0;
}
``````

Result is

Can that be the intended result? First and last character is some sort of blurred, but inner not at all. That is not what I have seen from other tools. Well the code is 10 years old, and cairo is very dead now. It is really strange, I was going to port it to Nim, but of course that makes no sense with this result. I have no idea how to debug this, and well I can still create sharp shadows with cairo’ s builtin functions…

Funny fact is, that while the cairo mailing list is nearly dead, there was a post about blur recently:

https://lists.cairographics.org/archives/cairo/2019-October/028924.html

The attached cpp program generates

from

It is some sort of blur, but is it really nice? Well not really important, it was an interesting test, I will use a plain cairo generated shadow for now.

Hi Stefan,

You may want to try the stack blur algorithm developed by Mario Klingemann. A C port of his algorithm, targeting cairo surfaces, is present in lasem sources: https://gitlab.gnome.org/GNOME/lasem/blob/master/src/lsmsvgfiltersurface.c#L150

Thanks for that hint, I will try that one when I have some free time. For now I do my shadows with plain cairo drawing, which looks not bad, and I think that is faster than actual blurring. But I may need blur later and will come back to your suggestion.

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.