Solved

is there an easy way to draw a tree with javascript ? what lib would be the one to use  ?

Posted on 2016-11-28
6
87 Views
Last Modified: 2016-11-29
hello,

i'd like to draw a tree with data that i have in a table.

the table has the following columns :

id; nodename; parentID.
1; nodetop; 0
2: nodeFirstA:1
3: nodeFirstB:1
4: nodeFirstC:1
5: nodeSecondA:2
6: nodeSecondB:2
....


is there some easy way for drawing trees with such data ?

thank you in advance.
0
Comment
Question by:toshi_
  • 3
  • 2
6 Comments
 
LVL 52

Expert Comment

by:Julian Hansen
ID: 41904138
JavaScript does not natively support such an operation but there are many libraries available on the net that do this.

Search for JavaScript Tree should yield a few.

Here is one that renders out a directory type tree
https://www.jstree.com/
0
 

Author Comment

by:toshi_
ID: 41904143
Hello Julian,

of course i dont expect javascript to pass a query to the db.

i can create an array with those values in order to pass them to a js function to have the tree draw.

is there such a function that would help to draw this tree ?

thanks
0
 
LVL 8

Accepted Solution

by:
James Bilous earned 500 total points
ID: 41904382
toshi_, Julian is saying that you will need to use a javascript library that provides the "function" which draws the tree since javascript does not have this function built in as part of its default implementation.

You will most likely have to reorganize your array of data into a format that suits whatever library you use. This library: http://sigmajs.org/ , for example, requires data to be formatted as a JSON object. Google "graph visualization javascript library" and do some research to figure out which one best suits your needs.
0
Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

 
LVL 52

Expert Comment

by:Julian Hansen
ID: 41904460
@toshi_ - can you explain your choice of answer please.
1
 

Author Comment

by:toshi_
ID: 41905660
Hello Julian,

Of course i can explain my choice.

your 1st. sentence :
"JavaScript does not natively support such an operation but there are many libraries available on the net that do this."
you can replace Javascript with any language and the sentence still be acceptable by anyone.....kind of bot's sentence.

your 2nd sentence :
"Search for JavaScript Tree should yield a few."
makes me think about that old website "doyouwantmetogooglethatforyou"

your proposal :
Here is one that renders out a directory type tree https://www.jstree.com/
kind of realization of 2nd sentence.


Now, look at your avatar and compare it with that beauty and colorfull james' avatar...no comparaison

yourself: black t-shirt, serious, looking in front of you as if you were chasing :)
james : colorfull, shini stars in the background, looking at the sky as with hope ....and that wonderfull sky :)  

i hope it helps and you now understand my choice.

best regards,

Toshi
1
 
LVL 52

Expert Comment

by:Julian Hansen
ID: 41905688
Thanks Toshi_ I will endeavour to colourise my avatar to make my posts more technically relevant.

Suggestion for the future: if you want a detailed answer try giving more detail in your question - it was somewhat open ended hence the reply you received. Without knowing the kind of tree you want to draw it is is a bit like saying what are the best tyres for my car but not telling us what car you drive or what you use it for.
is there some easy way for drawing trees with such data ?
The answer is yes - literally hundreds of ways - which one is right for you - well you did not give enough information.

The accepted answer does not really provide any more information than the first so it would seem the Avatar approach to selecting answer is the valid one here.

Good luck with your project.
1

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

I've been trying to accomplish this for a while and it just struck me yesterday how to accomplish this task. I have done searches all over the internet looking for ways to email pages from my applications and finally I have done it!!! Every single s…
Boost your ability to deliver ambitious and competitive web apps by choosing the right JavaScript framework to best suit your project’s needs.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

947 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

23 Experts available now in Live!

Get 1:1 Help Now