Hierarchical json from flat with parent ID
Improved version, accepting parameters.
function convert(rows, options) {
var options = options || {};
var idProp = options.id || 'id';
var parentProp = options.parent || 'parent';
var childProp = options.children || 'children';
function exists(rows, parent) {
for (var i = 0; i < rows.length; i++) {
if (rows[i][idProp] == parent) return true;
}
return false;
}
var nodes = [];
// get the top level nodes
for (var i = 0; i < rows.length; i++) {
var row = rows[i];
if (!exists(rows, row[parentProp])) {
nodes.push(Object.assign({}, row));
}
}
var toDo = [];
for (var i = 0; i < nodes.length; i++) {
toDo.push(nodes[i]);
}
while (toDo.length) {
var node = toDo.shift();
// the parent node
// get the children nodes
for (var i = 0; i < rows.length; i++) {
var row = rows[i];
if (row[parentProp] == node[idProp]) {
var child = Object.assign({}, row);
node[childProp] = node[childProp] || [];
node[childProp].push(child);
toDo.push(child);
}
}
}
return nodes;
}
// Usage
var data = [...];
convert(data);
// Or
convert(data, { id: 'Id', parent: 'Parent', children: 'Children' });
Try something like
var arry = [{ "Id": "1", "Name": "abc", "Parent": "", "attr": "abc" },
{ "Id": "2", "Name": "abc", "Parent": "1", "attr": "abc" },
{ "Id": "3", "Name": "abc", "Parent": "2", "attr": "abc" },
{ "Id": "4", "Name": "abc", "Parent": "2", "attr": "abc" }];
function convert(array){
var map = {};
for(var i = 0; i < array.length; i++){
var obj = array[i];
obj.items= [];
map[obj.Id] = obj;
var parent = obj.Parent || '-';
if(!map[parent]){
map[parent] = {
items: []
};
}
map[parent].items.push(obj);
}
return map['-'].items;
}
var r = convert(arry)
Demo: Fiddle
Result
[{
"Id" : "1",
"Name" : "abc",
"Parent" : "",
"attr" : "abc",
"children" : [{
"Id" : "2",
"Name" : "abc",
"Parent" : "1",
"attr" : "abc",
"children" : [{
"Id" : "3",
"Name" : "abc",
"Parent" : "2",
"attr" : "abc",
"children" : []
}, {
"Id" : "4",
"Name" : "abc",
"Parent" : "2",
"attr" : "abc",
"children" : []
}]
}]
}]
@Arun P Johny's answer is good, but it has a problem, when the array is not sorted, it will flush sub-trees. I updated it as this.
var arry = [
{ "Id": "5", "Name": "abc", "Parent": "3", "attr": "abc" },
{ "Id": "2", "Name": "abc", "Parent": "1", "attr": "abc" },
{ "Id": "4", "Name": "abc", "Parent": "2", "attr": "abc" },
{ "Id": "3", "Name": "abc", "Parent": "2", "attr": "abc" },
{ "Id": "1", "Name": "abc", "Parent": "", "attr": "abc" }
];
function convert(array){
var map = {}
for(var i = 0; i < array.length; i++){
var obj = array[i]
if(!(obj.Id in map)){
map[obj.Id] = obj
map[obj.Id].children = []
}
if(typeof map[obj.Id].Name == 'undefined'){
map[obj.Id].Id = obj.Id
map[obj.Id].Name = obj.Name
map[obj.Id].attr = obj.attr
map[obj.Id].Parent= obj.Parent
}
var parent = obj.Parent || '-';
if(!(parent in map)){
map[parent] = {}
map[parent].children = []
}
map[parent].children.push(map[obj.Id])
}
return map['-']
}
console.log(JSON.stringify(convert(arry)))
The result is as this:
{
"children": [
{
"children": [
{
"Id": "2",
"Name": "abc",
"Parent": "1",
"attr": "abc",
"children": [
{
"Id": "4",
"Name": "abc",
"Parent": "2",
"attr": "abc",
"children": []
},
{
"children": [
{
"Id": "5",
"Name": "abc",
"Parent": "3",
"attr": "abc",
"children": []
}
],
"Id": "3",
"Name": "abc",
"attr": "abc",
"Parent": "2"
}
]
}
],
"Id": "1",
"Name": "abc",
"attr": "abc",
"Parent": ""
}
]
}
function convert(rows) {
function exists(rows, Parent) {
for (var i = 0; i < rows.length; i++) {
if (rows[i].Id == Parent) return true;
}
return false;
}
var nodes = [];
// get the top level nodes
for (var i = 0; i < rows.length; i++) {
var row = rows[i];
if (!exists(rows, row.Parent)) {
nodes.push({
id: row.Id,
name: row.Name,
attr: row.attr
});
}
}
var toDo = [];
for (var i = 0; i < nodes.length; i++) {
toDo.push(nodes[i]);
}
while (toDo.length) {
var node = toDo.shift();
// the parent node
// get the children nodes
for (var i = 0; i < rows.length; i++) {
var row = rows[i];
if (row.Parent == node.Id) {
var child = {
Id: row.Id,
Name: row.Name,
attr: row.attr
};
if (node.options) {
node.options.push(child);
} else {
node.options = [child];
}
toDo.push(child);
}
}
}
return nodes;}