JSFiddle - React, Tailwind, and code Playground
HTML
<script id="csv" type="text/csv">
Column1,Column2,Column3,Column4,Column5
a,b,c,d,e
a,b,f,,
a,g,h,i,
j,k,l,,
j,k,m,n,
o,,,,
</script>
JavaScript
var csv = document.getElementById('csv').textContent.trim()
, data = parseCSV(csv)
, structure = toJSONStructure(data)
, formattedForD3 = toNameChildFormat(structure)
console.log(formattedForD3)
function parseCSV(csv) {
return csv.split('\n').slice(1).map(function(line) {
return line.split(',')
})
}
function toJSONStructure(data) {
var structure = {}
data.forEach(function(line) {
var o = structure
line.forEach(function(val) {
if(val) o = o[val] = o[val] || {}
})
})
return structure
}
function toNameChildFormat(structure) {
return Object.keys(structure).map(function(key) {
return {
name:key,
children:toNameChildFormat(structure[key])
}
})
}