This is an example of a collapsible drag and drop tree implementing slightly modified code from https://gist.github.com/robschmuecker/7880033
This is posted in order to demonstrate a viable answer for a Stack Overflow question http://stackoverflow.com/questions/20539922/has-anyone-produced-a-virtualised-javascript-tree-for-thousands-of-nodes
The only difference between this gist and the one referenced above is that the JSON file has changed. Each node contains 15 children and the depth is 4. Hence over 50,000 nodes.
The performance is fine if not too many of the nodes are present at once in the DOM. The JSON was contructed at http://www.json-generator.com/ with the following markup
{
user_id: '{{index}}',
name: '{{firstName}} {{surname}}',
children: [
'{{repeat(15)}}',
{
user_id: '{{index}}',
name: '{{firstName}} {{surname}}',
children: [
'{{repeat(15)}}',
{
user_id: '{{index}}',
name: '{{firstName}} {{surname}}',
children: [
'{{repeat(15)}}',
{
user_id: '{{index}}',
name: '{{firstName}} {{surname}}',
children: [
'{{repeat(15)}}',
{
user_id: '{{index}}',
name: '{{firstName}} {{surname}}'
}
]
}
]
}
]
}
]
}
For any help/queries, http://www.robschmuecker.com @robschmuecker or robert.schmuecker at gmail dot com
Modified http://code.jquery.com/jquery-1.10.2.min.js to a secure url
Modified http://d3js.org/d3.v3.min.js to a secure url
https://code.jquery.com/jquery-1.10.2.min.js
https://d3js.org/d3.v3.min.js