search

bkrem / react-d3-tree

:deciduous_tree: React component to create interactive D3 tree graphs
https://bkrem.github.io/react-d3-tree
MIT License
1.08k stars 270 forks source link

[Question] Orient a tree from leaves to the root or layout jack in? #365

Closed spacegangster closed 3 years ago

spacegangster commented 3 years ago

Hey, thanks a lot for this wonderful project!

How can I orient a tree from leaves to the root? In horizontal layout. Or how can I plug-in my own layout function?

Sorry, if this is a wrong place to ask.

bkrem commented 3 years ago

Hi @spacegangster,

How can I orient a tree from leaves to the root? In horizontal layout.

If I'm understanding you correctly, you want the root to be the furthest on the right in this case. Here's an example using the depthFactor prop with a negative value to invert the tree's direction: https://codesandbox.io/s/rd3t-v2-custom-event-handlers-forked-6fu87?file=/src/App.js

Or how can I plug-in my own layout function?

You can provide custom path functions that go beyond the predefined ones (straight, diagonal, etc) via the pathFunc prop: https://github.com/bkrem/react-d3-tree#providing-your-own-pathfunc

Hope that helps!

spacegangster commented 3 years ago

@bkrem yes, depthFactor it is, thanks!

By layout function plug-in I mean something to patch the x,y coordinates of the nodes themselves.