Ben Crowder

Emperor

When blogging about genealogy, it’s nice to be able to easily embed pedigree charts in your posts. I realized yesterday that it would be pretty easy to write a script to do just that. It’s called Emperor. Here’s a live demo:

Two-generation

* John Doe | b. 1850 ** Father: Richard Doe | ** Mother: Maria Taylor | b. 1825

The code

<div class="emperor-pedigree">
    * John Doe | b. 1850  
    ** Father: Richard Doe |
    ** Mother: Maria Taylor | b. 1825  
</div>

Three-generation

* Samuel Smith | 1823–1825 ** Nicholas Smith | 1800–1824 *** Frederick Smith | 1773–1812 *** Annabelle Hansen | b. 1770s? ** Irene Yolen | 1825–? *** Grandmother: Caroline Eastman | 1801–1899

The code

<div class="emperor-pedigree">
    * Samuel Smith | 1823&ndash;1825
    ** Nicholas Smith | 1800&ndash;1824
    *** Frederick Smith | 1773&ndash;1812
    *** Annabelle Hansen | b. 1770s?
    ** Irene Yolen | 1825&ndash;?
    *** Grandmother: Caroline Eastman | 1801&ndash;1899
</div>

Family pedigree

* Mark Goldman &
Evelyn Washburn | Jackie (b. 1935) ** Stephen Goldman &
Anne Rhys | Gary (b. 1899) | Ned (b. 1902) | Maggie (b. 1903) | Tanner (b. 1903) | Richard Goldman (b. 1908) | Mark Goldman (b. 1913) ** Robert Washburn &
Zanny Holdmann | Evelyn (b. 1915) | Lawrence (b. 1917)

The code

<div class="emperor-pedigree">
    * Mark Goldman &<br/> Evelyn Washburn | Jackie (b. 1935)
    ** Stephen Goldman &<br/> Anne Rhys | Gary (b. 1899) |
        Ned (b. 1902) | Maggie (b. 1903) | Tanner (b. 1903) |
        Richard Goldman (b. 1908) | Mark Goldman (b. 1913)
    ** Robert Washburn &<br/> Zanny Holdmann | Evelyn (b. 1915) |
        Lawrence (b. 1917)
</div>

Notes

If you’re reading this in a feed reader, it won’t look all that impressive. (That’s one of the downsides to doing it via Javascript instead of server-side.) Here’s an image showing what it looks like (from the sample page, included with the source):

The code (on Github) comes with instructions on using it. (Just upload the emperor.js file to your server, link to it in your head, and put your pedigree charts in a div with class="emperor-pedigree".) Oh, and you can style the pedigrees with CSS. There are still some issues to be resolved, but it’s fully armed and operational.

Comments

  1. JJT

    Just wanted to say - I'm loving Emperor, thanks!

    The .tail text is a little microscopic on my Wordpress theme so I'll need to do some .css massaging, but nice, easy and elegant.

Leave a comment

Your comment was submitted and will show up as soon as I approve it. Thanks.
Something went wrong with submitting your comment. Try again, and if it still doesn't work, email me (). Sorry!