使用格式将树结构表导出到csv

Question

I have a tree structure in my html table which is nested multi level

 Parent 
    --- Child1
           ----Parent
                   ---- Child
   - Child

SampleJSON:

I need to export the above data to CSV with a tree structure for the Name field, I attached the CSV image of how this data has to be extracted with column headers. for instance if i have 5 level of depth in the json i want the first 5 columns as Name and 6th column as Status and 7th column Country all data is present inline with column header

[![expected output][1]][1]

[Final CSV to be exported][1]

Answer 1

You can use recursion to determine the maximum depth of the structure, then use a second recursive function to build your result, padding each row with comma-delimited cells along the way. Joining the array with newlines produces a CSV string.

Having said that, the structure you've presented isn't an actual tree nor a "JSON" object because there may be multiple roots in the outer array. If you're passing a {id: 0, name: "", children: [ ... ]} in as the outermost (root) element, then you're dealing with a real tree and will need to tweak the functions shown here slightly to work on that (work on the current node, then recurse on children if extant).

I also went ahead and added quotes around each field in case you might have commas in your data at some point.

 const data = [ { "id": "692953339134475108", "entityID": "5000231121", "Name": "*Test1", "status": "Active", "date": "-", "country": "IND", "children": [ { "id": "699554426559363304", "parentId": "692953339134475108", "Name": "Testing 1", "entityID": "1416474126", "hierarchyId": "699154426559445604", "status": "Active", "date": "-", "country": "IND" }, { "id": "697253339134484008", "parentId": "692953339134475108", "Name": "*Test 2", "entityID": "1398417635", "hierarchyId": "697553339134529808", "status": "Active", "date": "-", "country": "IND" }, { "id": "696253339134488908", "parentId": "692953339134475108", "Name": "Not Available", "entityID": "Not Available", "hierarchyId": "694653339134506008", "status": "Not Available", "date": "Not Available", "country": "Not Available" },{ "id": "691453339134493608", "parentId": "692953339134475108", "Name": "*Test 3", "entityID": "1387487096", "hierarchyId": "691653339134511008", "status": "Active", "date": "-", "country": "IND" }, { "id": "697053339134483308", "parentId": "692953339134475108", "Name": "*TEst 5", "entityID": "1396529024", "hierarchyId": "694053339134516108", "status": "Active", "date": "-", "country": "IND" }, { "id": "698653339134491308", "parentId": "692953339134475108", "Name": "*test 6", "entityID": "1396474242", "hierarchyId": "695553339134503808", "status": "Active", "date": "-", "country": "IND" }, { "id": "692053339134490708", "parentId": "692953339134475108", "Name": "*test 7", "entityID": "1396505159", "hierarchyId": "699853339134497808", "status": "Active", "date": "-", "country": "IND" }, { "id": "691054426559395204", "parentId": "692953339134475108", "Name": "*atest 8", "entityID": "1416469729", "hierarchyId": "696954426559401304", "status": "Active", "date": "-", "country": "IND" }, { "id": "696353339134489808", "parentId": "692953339134475108", "Name": "*TWSTTTT", "entityID": "1396474493", "hierarchyId": "693853339134524908", "status": "Active", "date": "-", "country": "IND" }, { "id": "697454426559390004", "parentId": "692953339134475108", "Name": "*test9", "entityID": "1376584880", "hierarchyId": "698054426559423304", "status": "Active", "date": "-", "country": "IND", "children": [ { "id": "698653991889575501", "parentId": "697454426559390004", "directPercent": "10", "totalPercent": "50", "Name": "Not Available", "entityID": "Not Available", "hierarchyId": "694453991889580001", "status": "Not Available", "date": "Not Available", "country": "Not Available" } ] }, { "id": "693653339134492808", "parentId": "692953339134475108", "Name": "Not Available", "entityID": "1376584880", "hierarchyId": "691153339134501508", "status": "Not Available", "date": "Not Available", "country": "Not Available" }, { "id": "696154426559394204", "parentId": "692953339134475108", "Name": "*THE TEST", "entityID": "1416583295", "hierarchyId": "698854426559467404", "status": "Active", "date": "-", "country": "IND" }, { "id": "692153339134481408", "parentId": "692953339134475108", "Name": "*TESTT", "entityID": "1396477303", "hierarchyId": "691053339134522808", "status": "Active", "date": "-", "country": "IND" }, { "id": "694553339134485108", "parentId": "692953339134475108", "Name": "*TEDTTTETETE", "entityID": "1392671953", "hierarchyId": "698853339134513508", "status": "Active", "date": "-", "country": "IND" }, { "id": "696953339134492208", "parentId": "692953339134475108", "Name": "*TESSRTTT", "entityID": "1387487096", "hierarchyId": "696153339134518708", "status": "Active", "date": "-", "country": "IND" } ] } ]; const depth = (a, d=0) => { let deepest = d; for (const node of a) { if (node.children) { deepest = Math.max(deepest, depth(node.children, d + 1)); } } return deepest; }; const dataToCSV = (a, res, maxDepth, depth=0) => { for (const node of a) { const row = Array(maxDepth + 1).fill("") .concat([node.status, node.country]) ; row[depth] = node.Name; res.push(row); if (node.children) { dataToCSV(node.children, res, maxDepth, 1 + depth); } } return res; }; const body = dataToCSV(data, [], depth(data)); const headers = Array(body[0].length) .fill("\\"Name\\"") .concat(["\\"status\\"", "\\"Country\\""]) .slice(2) .join(",") + "\\n" ; const csv = headers + body.map( e => e.map(cell => `"${cell}"`).join(",") ).join("\\n"); console.log(csv); 

Result CSV string in spreadsheet previewer: