将Excel列映射到Parent-Child JSON

时间:2023-02-04 08:18:44

I have a CSV input like this:

我有这样的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,,,,

And I'm trying to transform that into a JSON output that complies with this format (http://bl.ocks.org/mbostock/raw/4063550/flare.json) so I can leverage d3.js to visualize the parent-child tree (http://bl.ocks.org/mbostock/4063570).

我正在尝试将其转换为符合此格式的JSON输出(http://bl.ocks.org/mbostock/raw/4063550/flare.json),以便我可以利用d3.js来显示父母 - 子树(http://bl.ocks.org/mbostock/4063570)。

I'm looking to visualize my data exactly like that example, but I don't have/need weights. If need be, I can add a common first-level parent. Just looking to visualize the tree(s).

我正在寻找可视化我的数据,就像那个例子,但我没有/需要权重。如果需要,我可以添加一个共同的第一级父级。只是想看看树的可视化。

Largest depth is always 5.

最大深度始终为5。

I was playing around with doing some array stuff in PHP (after reading in with fgetcsv()), but I was bumbling around and could use some help.

我正在玩PHP中的一些数组(在用fgetcsv()阅读之后),但我笨手笨脚,可以使用一些帮助。

PHP or Javascript solution preferred, since that's all I can work with through my work computer setup. I really appreciate the help!

首选PHP或Javascript解决方案,因为我可以通过我的工作计算机设置来解决这个问题。我非常感谢你的帮助!

1 个解决方案

#1


It sounds like you're looking for a tree structure where your data looks like the following:

听起来你正在寻找一个树形结构,你的数据如下所示:

          a            j      o
         / \          /
        b   g        k
       / \   \      / \
      c   f   h    l   m
     /         \        \
    d           i        n
   /
  e

if so, the following javascript code should do what you want:

如果是这样,以下javascript代码应该做你想要的:

var csv = //CSV CONTENT HERE
  , 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])
       }
   })
}

JSFiddle Demo

#1


It sounds like you're looking for a tree structure where your data looks like the following:

听起来你正在寻找一个树形结构,你的数据如下所示:

          a            j      o
         / \          /
        b   g        k
       / \   \      / \
      c   f   h    l   m
     /         \        \
    d           i        n
   /
  e

if so, the following javascript code should do what you want:

如果是这样,以下javascript代码应该做你想要的:

var csv = //CSV CONTENT HERE
  , 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])
       }
   })
}

JSFiddle Demo