将原始json转换为d3兼容数据集

问题描述 投票:0回答:1

这更像是一个算法问题。我有两个地图:depthMap和ChildMap。 DepthMap是一个javascript地图,用以下内容发起:

let depthMap = new Map()

处理完毕后,我在地图中获得了以下数据:

0:[a,b,c,d]
1:[e,f]
2:[g,h,i]
3:[j]

同样,我有一个childMap,我初始化如下:

let childMap = new Map()

处理完成后,childMap具有以下数据:

a:[e,f]
b:[]
c:[]
d:[]
e:[g,h]
f:[i]
g:[]
h:[j]
i:[]
j:[]

现在我想从depthMap和childMap创建一个嵌套的JSON对象。我需要这个d3缩进树的数据集。最终的JSON看起来应该是这样的:

{
  name: 'a',
  children: [
     {
      name:e
      children: [
              {
                name: g,
                children:[]
              },
              {
                name: h,
                children: [..]
              }
           ]
     },
     {
       name: f
       children: [
          {
            name: i
            children: []
          }
       ]
     }
   ]
},
...

我不知道我怎么能这样做。考虑将chilMap作为邻接矩阵,我正在考虑使用普通的DFS算法来解析图形。

但是,我无法弄清楚如何实现DFS来创建这样的JSON。

任何帮助将不胜感激。我想听听使用ES6 / Javascript的方法。

javascript json d3.js
1个回答
2
投票

我会使用一点递归:

<!DOCTYPE html>
<html>

<body>
  <script>
  
    // base data
    var data = {
      'a': ['e', 'f'],
      'b': [],
      'c': [],
      'd': [],
      'e': ['g', 'h'],
      'f': ['i'],
      'g': [],
      'h': ['j'],
      'i': [],
      'j': []
    };
    
    // recursive funtion
    function iterV(v){
      
      return v.map( (k) => {
        
        var a = map.get(k); // get array
        map.delete(k); // remove from base map
        
        return {
          'name': k,
          'children': a ? iterV(a) : [] // recursively iterate
        };
      });
    }
    
    // kick it off
    var map = new Map(Object.entries(data)), // convert to map
        first = map.entries().next().value, // get first entry in map
        nest = {
          name: first[0],
          children: iterV(first[1]) // kick off recursion
        };
        
    console.log(nest);
    
  </script>
</body>

</html>
© www.soinside.com 2019 - 2024. All rights reserved.