Javascript庫 - 家譜樹流程圖

我正在尋找一個簡單的Javascript庫（svg？），它允許我繪製家族樹關係。Javascript庫 - 家譜樹流程圖

我已經在谷歌上搜索了很多有趣的圖書館，例如Raphaël和它的擴展Dracula。 Google也有自己的庫來製作流程圖。

不幸的是，每個圖書館都用一個單線來建立節點之間的關係。如果A和B與C有關係，我將獲得2行：從A到C和從B到C之一。

我需要的是從A到B（我們稱之爲AB）和A線從AB到C表示A的婚姻和B.

example-image

感謝。

來源

2012-05-03 MrMime

你有沒有得到任何庫？我也在尋找相同的：] – sunny

我遇到同樣的問題。這裏是我發現：

你有任何其他的解決辦法？

來源

2012-05-17 23:37:40 daigorocub

也，這是非常酷：http://www.graphviz.org/content/lion_share – daigorocub

我認爲[箭頭和框]（http://www.headjump.de/文章/箭頭和框）是最好的。嘗試模式'（Dennis） - （> [d]） - （Hank）|| （）（d：Susan）' –

箭頭和方框非常好，如果您自己構建樹。我正在嘗試Graphviz和點語言。這是非常強大的。 – daigorocub

我定製了一個Graphviz點文件來產生這樣的輸出。目前我正在編寫一個Ruby腳本以從.gedcom文件生成此腳本。

這裏的.dot內容，帶數字的節點只是點，並以正確的方式流動邊緣。

digraph G { 
    graph [nodesep=0.2,splines=ortho,ranksep=0.05] 
    node [shape=box,fontname=Helvetica,fontsize=8;color="green",fixedsize=true,width=1,height=0.5,style=filled] 
    Grandfather [color="lightblue"] 
    Grandmother [color="pink"] 
    StephGrandmother [color="pink"] 
    Father [color="lightblue"] 
    Mother [color="pink"] 
    Uncle [color="lightblue"] 
    Laurent [color="lightblue"] 
    Child2 [color="lightblue"] 
    Child3, Child4 [color="pink"] 
    node[label="", width=0, height=0]; 
    edge[arrowhead=none, color=blue]; 
    {rank=same;StephGrandmother;Grandfather;Grandmother;Grandfather1} 
    {rank=same;Father;Father1;Mother;Uncle} 
    {rank=same;Laurent;Child2;Child3,Child4} 
    {rank=same;Father2;Father3} 
    StephGrandmother:e -> Grandfather:w 
    Grandfather:e -> Grandfather1 
    Grandfather1 -> Grandmother:w 
    Grandfather1 -> Grandfather2 
    Grandfather2 -> Father:n 
    Grandfather2 -> Uncle:n 
    Father:e -> Father1 
    Father1 -> Mother:w 
    Father1 -> Father2 
    Father2:w -> Laurent:n 
    Father2:w -> Child2:n 
    Father2 -> Father3 
    Father3:e -> Child3:n 
    Father3:e -> Child4:n 
}

來源

2017-01-04 23:24:02 peter

雖然不是「圖書館」，但存在一個實用工具，可以讓您精確繪製您描述的內容。簡單地稱爲「SVG實用程序」，這是一個免費的圖形設計軟件，允許您定義真實的家庭關係（包括多個配偶，暫時的孩子等）。見More on SVG Family Trees。

一旦設計完成，關係和佈局就會以簡單的文本文件格式捕獲，以便它們可以被修改或重新使用。該實用程序生成一個SVG版本用於博客文章或其他網頁。有幾種可能的配置允許在同一頁面上顯示多個SVG圖像，個人框或「家庭」後面的工具提示或彈出信息，單個樹木的縮放圖像，縮略圖圖像以及字幕等。

安裝套件，文檔和示例可在Dropbox文件夾中找到。請聯繫上面提到的博客帖子的作者以獲得訪問權限。

該實用程序設計用於在Windows下運行，但也已在Mac上的WINE兼容層下運行。

來源

2017-10-13 10:28:31 ACProctor

Javascript庫 - 家譜樹流程圖

回答

相關問題