This visualization builds a dependency graph based on dependencies between nodes (here, using an application ecosystem as example dataset).
This POC is based on a demo by Harry Love.
Note that the visualization "Application dependencies POC (Chord Diagram)" uses the same data structure, and thus provides a different view on the same data.
Each item has:
{
"items" : [
{
"id" : "0",
"label" : "Authentication",
"color" : "#440154ff",
"client" : {
"1" : 1, "2" : 1, "3" : 1, "4" : 1
}
},
{
"id" : "1",
"label" : "Lab",
"color" : "#31668dff",
"client" : { "4" : 2 }
},
{
"id" : "2",
"label" : "Sales Inventory",
"color" : "#37b578ff",
"client" : { "4" : 2 }
},
{
"id" : "3",
"label" : "HR",
"color" : "#fde725ff",
"client" : { "1" : 1 , "2" : 1 , "4" : 4 }
},
{
"id" : "4",
"label" : "Accounting",
"color" : "#ed4044ff",
"client" : {}
}
]
}
The data is loaded from a JSON file using D3's JSON function.
d3.json("data.json").then(function(data) {
console.log(data);
});