fperucic / treant-js

Treant.js - javascript library for drawing tree diagrams
MIT License
864 stars 314 forks source link

How to add a child node to a parent node, and the data of node is from ajax? #99

Open mocayo opened 6 years ago

mocayo commented 6 years ago

I am new to this. How to add a child node to a parent node, and the data of node is from ajax? If you can, please give me a demo. Thanks.

SharpBCD commented 6 years ago

I'm new to this too but I already managed to get this done. I'll post my method here, in case somebody else has a better opinion. I loaded the data (tennis tournament results) in a javascript array and process it to replicate the json structure required by treant.js. Starting with the winner, I generated the children with a recursive function. To locate a node, I added an ID based on a binary won/lost + the round. So the tournament winner would be: 011111 (0 is the first node, the parent; 1 for winning (first child) 2 for losing (second child)). The final loser would be 021111 and so on. This also will allow me to collapse/expand a whole level/round.

Still not sure what to do when the tournament is not over yet. I'll have to find a way to fill it with "TBD" text - but I will ask this question in another issue. I don't want to go off-topic.

mocayo commented 6 years ago

Thanks, your idea really helps. I save the config data, when I need to add nodes via ajax, I will generate new config data and re-render the tree.