erikgartner/dtree

A library for visualizing data trees with multiple parents, such as family trees. Built on top of D3.

dtree's Issues

Better text alignment

Background color for groups of nodes.

Add angularjs directives

Hi, Do you have any plan to release angularjs directives for this?

dTree doesn't work on Internet Explorer

The demo (https://treehouse.gartner.io/g/58e58be650453b6d49d7) can't be displayed fully in IE11.

Add debug options

Collapsable nodes

The ability to click on a node and collapse its children.

Remove marriage data attribute in favor of marriages

In 2.0 marriage will be deprecated in favor of marriages that takes an array.
Currently marriage supports both an array of marriages or a single marriage.

Limit svg to required height and width

SVG dimensions are provided in pixels, meaning it is only rarely as large as the displayed image.

Is it possible to calculate and adjust the real width and height of the displayed image and limit the SVG dimensions to that?

Examples:

• http://www.kinpedia.net/leaf/q937 ... quite neat, although the height is too large
• http://www.kinpedia.net/leaf/q1339 ... very bad: the width / scale is too small to show the whole image, and the height is also not fitting

Write custom layout engine

The current implemented by D3 is somewhat lacking in terms of customisation.

Requirements:

• Handle variable node size.
• Good placement of married nodes.

"onClick" handler

Supporting either a string or preferably a function.

Useful for popups, callback etc.

Custom HTML elements for nodes.

Multiple marriages

Automatic text resizing

Text size should be able to resize depending on size to fit node.

allow for children without spouses

Hi Erik, cool library!

There is a significant amount of divorce in my family. I'm looking for a way to represent divorce, or ex-spouses, or children with only one parent.

Let me know how we could build this, and I'm happy to help.

Kunal

Allow for complete lineage of spouse in marriage.

As of now the spouse to a node can't have their lineage in the graph.

Weird spacing between nodes

Fix spacing between married couples.

Does dTree support multiple spouses?

Hello,
Please add this feature. Thanks for this great work.

Add resizing svg

Add getting started guide

More documentation!

Incorrect marriage lines for multiple marriages

Hi! First of all, i really like the plugin! Actually it attends me in everything, one thing i've noticed is that when you add 3 spouses to the same person (1 actual spouse and 2 divorced) the middle one kind bug...

Here's the fiddle..
https://jsfiddle.net/tpde0cer/214/

When you add 2 spouses it works really well
https://jsfiddle.net/tpde0cer/215/

Thanks for the attention and sorry about my english hehe!
Cheers!

How do I insert images into the tree?

Would the tree be able to support images? img tag or background image? The one i've tried inserting display image but now in the nodes and it doesnt zoom in and out.

Add version variable

Like

dTree.version

Add automatic releasing to gulp

With a version attribute in the dTree variable.

Add position data to click callback

Add to bower repository

How do I add custom node styles?

I need to know who already passed away. So I add rip: true in node of my JSON format.
Then add a class rip to node via custom _nodeRenderer function.

.rip p{
    color: #757474;
    background: url('../img/rip.svg') no-repeat;
    background-size: 9px;
    padding-left: 9px;
}

Yeah, at least it works for me, but still looks ugly 😆 (my bad in styling)
Is this the right way?
Or could it be the next feature?

Improve spacing between nodes

Graph starts outside view

Two Grandparents to 1 couple

Is it possible to have two grand parents connected to a couple? 1 grandparents to a father and 1 grandparents to a mother? Father and mother would then be married and have a child?

Add node class when estimating height

Direct children to nodes

Error: Can’t find variable: TreeBuilder

I wanted to try your framework and followed the installation instructions. I referenced d3, lodash and dTree. Created the options and data and tried to initialize. I get error about missing TreeBuilder.

I guess the TreeBuilder is supposed to be included in the https://cdn.rawgit.com/ErikGartner/dTree/1.3.1/dist/dTree.min.js or then it needs to be separately referenced?

Add depth offset for node

Option to disable panning and/or zooming

We need to add options to disable pan and/or zoom.

Add support for marriages for spouses

var treeData =[  
   {  
      "name":"Abc Xyz",
      "class":"man",
      "id":"121",
      "marriages":[  
         {  
            "spouse":{  
               "name":"Jane",
               "class":"woman",
               "id":"122",
               "marriages":[  
                  {  
                     "spouse":{  
                        "name":"Jill",
                        "class":"man",
                        "id":"2304"
                     },
                     "children":[  
                        {  
                           "name":"Abc Xyz",
                           "class":"man",
                           "id":"142"
                        }
                     ]
                  }
               ]
            },
            "children":[  
               {  
                  "name":"Abc Xyz",
                  "class":"man",
                  "id":"131"
               },
               {  
                  "name":"Abc Xyz",
                  "class":"man",
                  "id":"132",
                  "marriages":[  
                     {  
                        "spouse":{  
                           "name":"Abc Xyz",
                           "class":"woman",
                           "id":"141"
                        },
                        "children":[  
                           {  
                              "name":"Abc Xyz",
                              "class":"man",
                              "id":"142"
                           }
                        ]
                     }
                  ]
               },
               {  
                  "name":"Abc Xyz",
                  "class":"man",
                  "id":"133"
               }
            ]
         }
      ]
   }
];

When used above json object dTree is not showing marriages of Jane

Add live editing

Upgrade to d3 v4.

Currently dTree supports only d3 v3 but upgrading may add some nice benefits.

Custom sorting function

Visual artifacts while panning the tree

There will be some horizontal lines occur if you drag the tree

Wrap multiline text in node

Custom rendering function

Add unit tests

Covering all the important aspects

Improved sorting callback

Better than a simple comparator callback would be a full-fledged sorting callback that receives the entire array and should return it sorted according to preference.

Add api for panning to center on node

How do you add siblings?

Hi Erik,

How would sibling's data looks like in the JSON?

Automatic node sizing

Nodes height and perhaps width should be calculated.

Preferable this mechanism should be overwritable by the user.

Option for width separation

Callback or just a constant?

Question: generate json

How do I generate the json out in php? Ive been trying for weeks but to no avail.

Add support for parents of spouses

NodeClick is having the name parameter undefined

nodeClick callback is getting the name parameter undefined, probably happened because of d3 version change, just need to change d.name to d.data.name when calling the callback. Will send a pr when free, also leaving a comment on the code if someone else is working on it.