Follow me on Twitter Follow me on GitHub
Chandler Prall Thoughts & Experiments for the Web

My Family Tree

If you are looking a Javascript library to generate family trees check out FamilyTreeJS.

My grandparents on my dad’s side have spent a lot of time and effort researching the family history – from our genealogy to the anecdotal stories which make your distant relatives real to you. It hasn’t been just them either. I don’t know how many family-groups share this enthusiasm for genealogy and family trees, but may as well be an Olympic sport to us. For one, there is the Prall Family Association complete with DNA testing. There is a 546-page book on the subject – and yes, I am in it. Anyway, my grandpa keeps a large poster-size chart of the “important people” in our family tree – namely our immediate family and then the European tree (William the Conqueror, Constantine, Alfred the Great, kings, queens, etc). After Moriah and I were married she was added to the poster document and he had a copy printed for us. Ever since then I have wanted to digitize it and put it up online.

It turns out there are no apparent Javascript-based family tree libraries, so I decided to make one. It also turns out that programming such a library which can handle all the European intermarriages can be a frustrating task, but it is done. If anyone is interested in the library itself: FamilyTreeJS via GitHub, I’ll be expanding with a readme & examples at some point soon. For now it’s just a mostly-functional library.

Anyway, click the “Draw Family Tree” button below if you would like to see my family tree. It will take a few seconds to draw everything out and then you can click & drag around. It starts centered on the bottom bit – my immediate family, but go up and you’ll soon hit the giant block of European history. The colors are loosely based on each family’s originating flag or crest. Known/approximate dates are posted below the names along with any titles that person held.

6 Responses to My Family Tree

  1. Mohammad says:

    Thanks man, i just want to ask if we can get clicking events on the boxex?
    if so can you please show me an example ?

  2. Don Prall says:

    I was wondering where my father’s family was from so have been reading diffrent sites.

  3. Tee Joo Tatt says:

    Thank you so much for this wonderful tool. If I want to include a family member who is married but has no children, how can I include the spouse?

  4. Ted Daniels says:

    Mr Prall – I am trying to incorporate a Family Tree into a GIS based map with historical sites in it as part of a County History Project.

    I have got a nice recursive bit of programming going that enables me to display the tree in text form but would like to be able to dynamically build a graphical display such as yours, but don’t understand what you have done so need a bit of help as am an SQL programmer not a Jasvascript aficionado. I can generate a Javascript file like your Pralls.JS on the fly. I put made a web page and put the script source like to link to your code but get continued errors.

    Could you send me the code that would be needed to reproduce your example in a simple web page with just the in it.

    Many thanks

    Ted Daniels

    Could you send me

    • chandler says:

      The basic page to reproduce just the family tree layout follows. There is some additional CSS to include for the #pralltree div which you can find by inspecting the grey box in the above post.

      <!DOCTYPE html>
      <script type=”text/javascript” src=”familytree.js”></script>
      <div id=”pralltree”></div>
      <script type=”text/javascript src=”pralls.js”></script>
      <script type=”text/javascript”>drawPrallTree();</script>

  5. Melissa Jean Gomez says:

    I am looking for a published version of the Prall Book. I know my mother, Shelley Anne Kane had a copy, it was passed to my brother Michael Merchant Gomez who just passed away, but no copy of the book to be found. I being the family history nut is now looking for a copy. My mothers grandfather was Merchant Dagg Prall,

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>