从平面JSON生成（多级）flare.json数据格式

小编典典

从平面JSON生成（多级）flare.json数据格式

json

我有一个扁平的json文件结构，例如：

[
 { "name" : "ABC", "parent":"DEF", "relation": "ghi", "depth": 1 },
 { "name" : "DEF", "parent":"null", "relation": "null", "depth": 0 },
 { "name" : "new_name", "parent":"ABC", "relation": "rel", "depth": 2 }
 ....
 ....
 ]

我想要的是一个嵌套的文件结构，如：

[ 
 {
   "name": "DEF",
   "parent": "null",
   "relation": "null",
   "children": [
                 { "name": "ABC",
                   "parent": "DEF",
                   "relation": "ghi",
                   "children": [
                                 "name": "new_name",
                                 ...
                                 "children": []
                               ]
                 }
               ]
  }
 ]

对于应该深入多少层没有限制。我当前拥有的最大值是30。一个节点可以拥有的子级数量没有限制。例如。根节点将其余所有节点作为其子节点。

到现在为止我一直在尝试什么？

阅读有关d3.nest（）的信息，以及它如何能够嵌套但并不完美。 https://groups.google.com/forum/?fromgroups=#!topic/d3-js/L3UeeUnNHO8/discussion
为此编写了一个python脚本，但是它卡在空值中，并且由于数据没有边界（每天以两位数增加），因此非常慢。
我尝试使用力导向布局，效果很好，但是我想添加另一种布局以使可视化变得容易。
我可以发布一些其他的python脚本，但是它们似乎除了“ name”和“ children”之外没有任何其他信息。
我读了这篇文章：http : //blog.pixelingene.com/2011/07/building-a-tree-diagram-in-d3-js/，但它们也首先具有正确的格式数据。我打算创建的是 http://bl.ocks.org/mbostock/4339083。

数据源是我正在通过python获取和解析的MS SQL Server数据库。请帮助！在过去的两个星期中，我一直坚持这一点。

谢谢

阅读 904

2020-07-27

共1个答案

小编典典

这是一个使用Javascript的实现：http :
//jsfiddle.net/9FqKS/

首先，创建基于名称的地图以方便查找。有几种不同的方法可以执行此操作-
在这种情况下，我使用一个.reduce方法，该方法以一个空对象开头并遍历data数组，为每个节点添加一个条目：

// create a {name: node} map
var dataMap = data.reduce(function(map, node) {
    map[node.name] = node;
    return map;
}, {});

这等效于：

var dataMap = {};
data.forEach(function(node) {
    dataMap[node.name] = node;
});

（我有时认为reduce更为优雅。）然后迭代地将每个子代添加到其父代，如果找不到父代，则将其添加到根数组：

// create the tree array
var tree = [];
data.forEach(function(node) {
    // find parent
    var parent = dataMap[node.parent];
    if (parent) {
        // create child array if it doesn't exist
        (parent.children || (parent.children = []))
            // add node to parent's child array
            .push(node);
    } else {
        // parent is null or missing
        tree.push(node);
    }
});

除非您的树很大，否则我认为这应该不会太昂贵，因此您应该能够在客户端进行操作（如果不能这样做，那么在任何情况下都可能有太多数据无法轻松显示）。

2020-07-27