22

Is there an existing PHP, Javascript, or even command line tool that can build a family tree in HTML (preferably) or at the very least create an image for it? Multiple parents are a requirement. I have been googling this for hours, but to no avail.

For instance, the Google Organizational Chart would be ideal, but it only allows each node to have at most one parent. I need two parents to be possible.

Whatever this website does would also be perfect: http://www.familyecho.com/, but it seems to not be done with javascript and they don't publish the code that actually creates the visualization.

Even connecting to an external website to use their API to generate a visualization would be perfect.

Explosion Pills
  • 188,624
  • 52
  • 326
  • 405
  • Family Echo does indeed use JavaScript - what makes you think it doesn't? – Matt Ball Apr 12 '11 at 17:31
  • I tried copying over their javascript files and running them just to see if I could use it externally, but it didn't work. Seems like it's trying to make an ajax request to /ap on their site, which I don't have access to. Were you able to get it to work? – Explosion Pills Apr 12 '11 at 17:40
  • What exactly do you mean by multiple parents? Are you simply talking about an ascendents graph rather than descendents? Like a standard family tree? phpGedView does indeed have that. – defines Apr 30 '11 at 13:12
  • Can you show me an example of an ascendents graph like a standard family tree? – Explosion Pills Apr 30 '11 at 13:15
  • if you are interested in genealogy, help the genealogy stackexchange reach beta: http://area51.stackexchange.com/proposals/43502/genealogy-family-history?referrer=DIRpC-2QEpSJcDcQkP0RAg2 – Duncan Sep 23 '12 at 12:40
  • 1
    I'm voting to close this question as off-topic because despite its great age, and overwhelming level of endorsement, it is not, and was never, really an appropriate question for SO. – Strawberry Mar 27 '16 at 23:13
  • Note for readers, phpgedview is being replaced by webtrees. – Peter Flynn Dec 16 '18 at 22:46

5 Answers5

7

You might be interested in Raphaël, especially this demo.


Edit: I just came across a couple other promising-looking options from this question.

  • Protovis - I knew about this one when I first answered, but didn't think of it at the time. It's really flexible. Check out the examples.
  • Dracula Graph - haven't tried it. It might be too simple for your uses.
Community
  • 1
  • 1
Matt Ball
  • 354,903
  • 100
  • 647
  • 710
  • I don't need to be able to drag the shapes around, but does Raphael allow for multiple parent nodes? – Explosion Pills Apr 12 '11 at 17:40
  • Checked out both of these before too. Still not really what I need. Protovis looks like it has potential, but I still see no examples of a tree where nodes can have multiple parents! – Explosion Pills Apr 28 '11 at 16:22
5

As it's just the JavaScript you're after (I assume, since you're designing your own schema...) the InfoVis framework provides all sorts of complicated relationships - http://thejit.org/static/v20/Jit/Examples/ForceDirected/example1.html.

Dan Blows
  • 20,846
  • 10
  • 65
  • 96
  • This one does look promising; the only thing that concerns me is that it seems to place the nodes randomly and connections don't form a T, but beggars can't be choosy. This also seems very complicated to learn and use, but I imagine anything to build a tree like this would be. – Explosion Pills Apr 30 '11 at 15:46
  • @tandu I think the randomness is that particular implementation. There are other visualisation types that are much tidier. Some playing around will give you the combination of multiple parents, tidily displayed that you want. It is more complicated than just 'plug-and-play' but the documentation is great. – Dan Blows Apr 30 '11 at 15:52
  • Do you recommend a specific visualization? One that will look similar to the two examples I provided in the question? – Explosion Pills Apr 30 '11 at 16:01
  • @tandu Maybe http://thejit.org/static/v20/Jit/Examples/Hypertree/example1.html - you can customise the exact layout and appearance with JavaScript and CSS. It works essentially by AJAX - you pass a JSON string to JIT, and if you allow updates, you can send the JSON back to your server. http://thejit.org/static/v20/Docs/files/Visualizations/Hypertree-js.html#Hypertree.Op is the relevant documentation. – Dan Blows Apr 30 '11 at 18:29
  • @tandu Any joy getting it working? – Dan Blows May 01 '11 at 16:53
  • Haven't gotten to that point yet; I will let you know. – Explosion Pills May 01 '11 at 17:01
3

This is possible with Graphviz. It's an (easy to learn) language, and a command-line executable (for Linux, Solaris, Windows and Mac) which can export at least to PNG and SVG. It is extremely flexible and can do family trees. I suppose multiple parents is not a problem at all. Check http://www.graphviz.org/content/kennedyanc for an example. See all the other examples at: http://www.graphviz.org/Gallery.php

You will probably discover several other uses for Graphviz yourself.

Symen Timmermans
  • 877
  • 1
  • 8
  • 18
  • Graphviz is cool and I might end up using it, but the problem is that I really need this to be done with javascript because people need to be able to do things like click the nodes to view profiles, add a new node, by clicking, etc. I think this would be very difficult to do with an image. – Explosion Pills Apr 29 '11 at 11:52
1

Family Echo now has an API, allowing you to submit a family tree in GEDCOM or FamilyScript format, and view in online via the Family Echo site.

  • This seems to be the ONLY site on the web that implements a real family tree from a GEDCOM file — multiple parents, multiple ascendants and descendants, and formatting that pushes tree fragments aside to make way for other ascendants, as it would be done by a manual family-tree artist. – Peter Flynn Dec 16 '18 at 22:51
0

At last if found very useful script for making professional family tree diagram in php. It helped me alot. Just want to share with others, may be helpful to others.

jTree Family Tree Maker Script

irfanmcsd
  • 6,533
  • 7
  • 38
  • 53