Example on how to render custom nodes

First of all, thanks for the great work on this library!

Is your feature request related to a problem? Please describe. I would like to render custom nodes (my own React component, which is just a simple rectangle with some basic styles). I can’t use the default rendering of the nodes because my text gets cut off, and I’d like to render them as rectangles instead of circles (screenshot attached below)

I see in #36 that I could use renderNode or renderNodeText. However, it’s not clear what the contract for these 2 props are, and how I could use it to render my own component.

It would be great if you could provide a sample code on how to render nodes using our custom React components.Thanks!

[iChaosren]

You can checkout the source code for the Node and Node Text components. They should give you a good indication of what to do…

• Example for renderNodeText: node-text.js

• Example for renderNode: node.js

And in case you were curios… Here’s where the function you pass through gets executed:

• renderNode(this.nodeRef, data, data[nodeKey], selected, hovered)
• renderNodeText(data, id, isSelected)

[AdityaAnand1]

Were you able to figure out what was happening @EfstathiadisD?

Also, which one of the solutions worked? Can I use a custom <div/> or <Component/> as a node?