2

I'm seeking a long time for a graph library which support, after I tried vis.js, echarts, recharts, etc.

The project requirement is:

  • collapsible tree by click node
  • events on nodes / edges
  • lable / tooltip on edge and node both

Better support react and render HTML components as nodes and edges.

Improve this question
1
  • Did you ever find a solution? Now I am starting to code React Native & would like such a thing :-)
    – Mawg says reinstate Monica
    Nov 14, 2018 at 13:44

2 Answers 2

Reset to default
0

As you probably already know, D3JS is reckoned by many to be the best JS charting library that there is - just check out the great examples

Googling for collapsible D3JS found a few hits, so it looks like it can be done. I don't have time to look further for the exact implementation details, so please Google & investigate this yourself.

See, for instance https://stackoverflow.com/questions/30496291/how-to-create-d3-js-collapsible-force-layout-with-non-tree-data

And this demo.

There's your answer, but you have to do the coding :-)

Improve this answer
4
  • 1
    I already google a lot. if no other choice, so we can just use d3. tnx
    – Jie Hu
    Aug 16, 2018 at 17:07
  • If so, please accept the answer - not because I want the points, but because it will help others who read ths question in future. If you think it won't help, then don't accept; I won't mind & will continue to help you in future :-)
    – Mawg says reinstate Monica
    Aug 16, 2018 at 20:38
  • 1
    I just want to wait a moment. Thanks
    – Jie Hu
    Aug 16, 2018 at 22:01
  • That's perfectly fine - someone may come along with a better suggestion. If they don't, after a week or so, then if you accept this it will help others who read this in future. I am just explaining because you are new. Also, it is perfectly acceptable to post an answer to your own question, and to accept it, because that will also help others.
    – Mawg says reinstate Monica
    Aug 17, 2018 at 6:07
0

My suggestion is to try the Syncfusion React Diagram library.

I have created a sample with collapsible nodes with a label, tooltip, and notification using diagram events. Find the sample from the below link.

sample: https://xvk22yvl4.codesandbox.io/ Source: https://codesandbox.io/s/xvk22yvl4

In this sample, I have created a click event for the node, when you click a node it shows an alert message. For complete API documentation, visit here

Other related links:

Tooltip demo, UG for Creating labels using annotation

Note: I work for Syncfusion

Improve this answer

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.