# Help with visualizing a chain of relationships

**URL:** <https://talk.observablehq.com/t/help-with-visualizing-a-chain-of-relationships/3182>\
**Category:** Help\
**Created:** [April 28, 2020, 8:26pm UTC](https://talk.observablehq.com/t/help-with-visualizing-a-chain-of-relationships/3182 "2020-04-28T20:26:33Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![liuyao12](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.observablehq.com/liuyao12/32/250_2.png) [@liuyao12](https://talk.observablehq.com/u/liuyao12)\
**Post date:** [April 28, 2020, 8:26pm UTC](https://talk.observablehq.com/t/help-with-visualizing-a-chain-of-relationships/3182/1 "2020-04-28T20:26:34Z")

</div>

I wonder if I can interest anyone skilled in d3 into making visualization of relationship paths. Basically it’s a chain of connections that can go up one step, go to the right one step, or go down one step. As long as we stick with a single path between two individuals, it should be well-defined.

Here’s an example (not a terribly good one, I apologize)

> **[Geni path](https://observablehq.com/@liuyao12/geni-path)**
>
> An Observable notebook by Yao Liu.

Thanks in advance!

---

<div class="post-metadata">

**Author:** ![mootari](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.observablehq.com/mootari/32/581_2.png) [@mootari](https://talk.observablehq.com/u/mootari)\
**Post date:** [April 29, 2020, 11:30am UTC](https://talk.observablehq.com/t/help-with-visualizing-a-chain-of-relationships/3182/2 "2020-04-29T11:30:08Z")

</div>

You can already find several examples of genealogy/family trees built with d3 on the web (and even libraries), e.g.:

- [bl.ocks.org | d3.tree - A Family Tree](https://bl.ocks.org/mell0kat/5cb91a2048384560dfa8f041fd9a0295)
- [github.com | Trans Family Tree](https://github.com/trongthanh/family-tree)
- [reddit.com | I used d3.js to draw fancy descendant charts](https://www.reddit.com/r/Genealogy/comments/3ky3su/i_used_d3js_to_draw_fancy_descendant_charts/)

Is there anything in particular that you have trouble implementing?

---

<div class="post-metadata">

**Author:** ![liuyao12](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.observablehq.com/liuyao12/32/250_2.png) [@liuyao12](https://talk.observablehq.com/u/liuyao12)\
**Post date:** [April 29, 2020, 4:55pm UTC](https://talk.observablehq.com/t/help-with-visualizing-a-chain-of-relationships/3182/3 "2020-04-29T16:55:14Z")

</div>

I’ve done a family tree, built on the collapsible tree in d3 (not that I understood the code). I thought maybe someone would have other ideas how to present the path (not really a tree) on the screen.

> **[Wang clan of Langye 琅邪王氏](https://observablehq.com/@liuyao12/wang-clan-of-langye)**
>
> An Observable notebook by Yao Liu.
