JSFiddle - React, Tailwind, and code Playground
JavaScript
var data = {
"name": "A",
"size": 45,
"children": [
{
"name": "B",
"size": 10
},
{
"name": "C",
"size": 10
},
{
"name": "D",
"size": 10
},
{
"name": "E",
"size": 45,
"children": [
{
"name": "B",
"size": 10
},
{
"name": "F",
"size": 10
}
]
},
{
"name": "G",
"size": 10
},
{
"name": "H",
"size": 45,
"children": [
{
"name": "B",
"size": 10
},
{
"name": "I",
"size": 10
},
{
"name": "F",
"size": 10
},
{
"name": "TARGET",
"size": 10
}
]
},
{
"name": "J",
"size": 10
},
{
"name": "Q",
"size": 10
},
{
"name": "L",
"size": 10
},
{
"name": "M",
"size": 10
},
{
"name": "N",
"size": 63,
"children": [
{
"name": "O",
"size": 63
},
{
"name": "P",
"size": 10
},
{
"name": "H",
"size": 45
},
{
"name": "Q",
"size": 167
}
]
},
{
"name": "I",
"size": 10
},
{
"name": "R",
"size": 10
}
]
};
var path=[];
var _break = false;
function search(self,depth,targetName){
if(_break)return;
// console.log(depth,self.name);
path.length = depth+1;
path[depth] = self;
if(self.name==targetName){
_break = true;
revert(path);
return;
}
depth++;
if(self.children){
self.children.forEach(function (child) {
search(child,depth,targetName);
})
}
}
function revert(path){
var result;
function build(self,index){
self.children = self.children || [];
...