Excerpts from the glyph code for http://she-works.tumblr.js

app-tumblr.js

function render_glyphs(glyph_set) {
    /*
     * Render the SVG ornament glyphs.
     */
    for (var i = 0; i < glyph_rects.length; i++) {
        glyph_rects[i].remove();
    }

    glyph_rects = [];

    var glyphs = GLYPH_SETS[glyph_set];

    for (var i = 0; i < glyphs.length; i++) {
        var glyph = glyphs[i];
        var bitmap = glyph.bitmap;
        var w = bitmap[0].length;
        var h = bitmap.length;

        if (glyph.align == 'left') {
            var x_base = glyph.grid_offset_x;
        } else if (glyph.align == 'right') {
            var x_base = (GRID_X_TICKS - glyph.grid_offset_x) - w;
        } else if (glyph.align == 'center') {
            var x_base = ((GRID_X_TICKS / 2) + glyph.grid_offset_x) - (w / 2);
        }

        if (glyph.valign == 'top') {
            var y_base = glyph.grid_offset_y;
        } else if (glyph.valign == 'bottom') {
            var y_base = (GRID_Y_TICKS - glyph.grid_offset_y) - h;
        } else if (glyph.valign == 'middle') {
            var y_base = ((GRID_Y_TICKS / 2) + glyph.grid_offset_y) - (h / 2);
        }

        for (var y = 0; y < h; y++) {
            for (var x = 0; x < w; x++) {
                if (glyph.invert) {
                    var x2 = w - (x + 1);
                } else {
                    var x2 = x;
                }

                if (glyph.vinvert) {
                    var y2 = h - (y + 1);
                } else {
                    var y2 = y;
                }

                if (bitmap[y2][x2]) {
                    var lx = ((x + x_base) * GRID_X_PITCH) + GLYPH_X_MARGIN;
                    var ly = ((y + y_base) * GRID_Y_PITCH) + GLYPH_Y_MARGIN;
                    var lw = GRID_X_PITCH - (GLYPH_X_MARGIN * 2);
                    var lh = GRID_Y_PITCH - (GLYPH_Y_MARGIN * 2);

                    glyph_rects.push(preview.rect(lx, ly, lw, lh).attr({ fill: GLYPH_COLOR, 'stroke-width': 0 }));
                }
            }
        }
    }
}