vorburger / kingraph

Plots family trees using JavaScript and Graphviz

kingraph

👪 Plots family trees using JavaScript and Graphviz

A family tree plotter with a very simple syntax. It probably doesn't cover everything bigger tools do, but covers 90% of it for the sake of simplicity.

Getting started

A family tree is a YAML file. To get started, store the following text in a file called family.yaml:

families:
  - parents: [Marge, Homer]
    children: [Bart, Lisa, Maggie]
  - parents: [Lisa, Milhouse]
    children: [Zia]

people:
  Marge:
    fullname: Marjorie Bouvier Simpson

Use kingraph via this project's Docker Container image to transform this YAML into a Graphviz DOT file, and then that into a SVG and PDF:

docker run --rm -v $(pwd):/data --pull=always ghcr.io/vorburger/kingraph:latest --format=dot family.yaml >family.dot
dot -Tsvg -o family.svg family.dot
open family.svg
dot -Tpdf -o family.pdf family.dot
open family.pdf

You can also try to generate a SVG with kingraph directly by using --format=svg, but you'll likely run into memory issues.

Further Examples

Spoiler alerts, view at your own risk :)

Simpsons (simple)

Source: simpsons.yaml

Modern Family (simple with houses)

Source: modernfamily.yaml

Harry Potter (larger tree)

Source: potter.yaml

Game of Thrones (overly complicated)

Source: got.yaml

Documentation

For further reading:

• Getting started
• Advanced usage
• Schema

Develop

As per the Dockerfile, you need Node.js, and then in order to locally hack on this code, just do:

npm install
bin/kingraph

To try out the Docker build locally:

docker build -t kingraph .
docker run ... kingraph ... # instead of ghcr.io/vorburger/kingraph:latest

Thanks

Authored and initially maintained by Rico Sta. Cruz with help from contributors (list).

ricostacruz.com  ·  GitHub @rstacruz  ·  Twitter @rstacruz