I have an sorted array of objetcs. They are not attached with each other by ids, only by texts.
let result = [
{ col1: "A" , col2: "a" , col3: "1", col4: [10,15] },
{ col1: "A" , col2: "c" , col3: "1", col4: [30,35] },
{ col1: "B" , col2: "b" , col3: "1", col4: [20,25] },
{ col1: "C" , col2: "d" , col3: "1", col4: [40,45] },
{ col1: "C" , col2: "d" , col3: "2", col4: [50,55] },
{ col1: "D" , col2: "e" , col3: "3", col4: [60,65] },
{ col1: "D" , col2: "e" , col3: "4", col4: [70,75] },
{ col1: "D" , col2: "f" , col3: "1", col4: [80,85] }
]
I need to draw the following TreeTable from this array:
So, the result array will be converted into this:
this.data = [
{
// COL1
data:{
label:"A"
},
children:[
{
// COL2
data:{
label: "a"
},
children:[
{
// COL3
data:{
label: "1",
clusters: [10,15]
}
}
]
},
{
// COL2
data:{
label: "c"
},
children:[
{
// COL3
data:{
label: "1",
clusters: [30,35]
}
}
]
}
]
},
{
// COL1
data:{
label:"B"
},
children:[
{
// COL2
data:{
label: "b"
},
children:[
{
// COL3
data:{
label: "1",
clusters: [20,25]
}
}
]
}
]
},
{
// COL1
data:{
label:"C"
},
children:[
{
// COL2
data:{
label: "d"
},
children:[
{
// COL3
data:{
label: "1",
clusters: [40,45]
}
},
{
// COL3
data:{
label: "2",
clusters: [50,55]
}
}
]
}
]
},
{
// COL1
data:{
label:"D"
},
children:[
{
// COL2
data:{
label: "e"
},
children:[
{
// COL3
data:{
label: "3",
clusters: [60,65]
}
},
{
// COL3
data:{
label: "4",
clusters: [70,75]
}
}
]
},
{
// COL2
data:{
label: "f"
},
children:[
{
// COL3
data:{
label: "3",
clusters: [80,85]
}
}
]
}
]
}
];
I've tried a couple of things like grouping the result array, just doing a loop with the result array... but I couldn't manage to get this solved and eventually got lost.
Can you help me with creating the data array from the result array?
try this:
let data = [];
result.forEach((r, i) => {
let d;
for (let i = 1; i <= 3; i ++) {
const l = r["col"+i];
const rg = d ? (d.children || (d.children = [])) : data;
d = rg.find(e => e.data.label === l) || (rg[rg.length] = { data: { label: l }});
}
d.data.clusters = r["col4"];
});
console.log(data);
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.