JSFiddle - React, Tailwind, and code Playground

by Luis Fraguada

HTML

<script src="https://d3js.org/d3.v4.js"></script>
<div id="original"></div>
<div>---</div>
<div id="nested"></div>
<div>---</div>
<div id="rel"></div>

JavaScript

var data = [
{name: 'l1', Parent: "", Id:"0"},
{name: 'l2', Parent: "0", Id:"1"},
{name: 'l3', Parent: "0", Id:"2"},
{name: 'l4', Parent: "2", Id:"3"},
{name: 'l5', Parent: "", Id:"4"}];

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 = []
        }

        var parent = obj.Parent || "-";
        if(!(parent in map)){
            map[parent] = {}
            map[parent].children = []
        }

        map[parent].children.push(map[obj.Id])
    }
    return map['-']
}

document.getElementById('original').innerText = JSON.stringify(data);
document.getElementById('nested').innerText = JSON.stringify(convert(data));