jeudi 21 juillet 2016

Mind-Map Chart on React.js

I wondering how to modeling the components on a Mind-Map chart so it can handle hundreds of nodes and work fast and smooth.

You can see an example of mind-map chart here: http://ift.tt/X47lS6 (Source code: http://ift.tt/1fekMok)

Please be noted that this chart is NOT a tree chart. Close loops is allowed and also detached nodes.

I need that each node will implement React.Component so events like move, click or drag will handle on the component itself. I'm wondering what to do with the node lines.

How can I model the lines on React efficiently and make sure that any change on the node component will change the lines as well? I need also an option to add or remove nodes or lines on the fly without rendering the whole chart again.

Aucun commentaire:

Enregistrer un commentaire