feat: Changed data format

src/builder.js

@@ -41,32 +41,11 @@ const treeBuilder = {
       return fun(linedata);
     }
 
-    /**
-      To make the nodes in flat mode.
-      This gets all the nodes in same level
-    **/
-    function flatten(root) {
-      var n = [];
-      var i = 0;
-
-      function recurse(node) {
-        if (node.children) {
-          node.children.forEach(recurse);
-        }
-        if (!node.id) {
-          node.id = ++i;
-        }
-        n.push(node);
-      }
-      recurse(root);
-      return n;
-    }
-
     /**
       This draws the lines between nodes.
     **/
     function elbow(d, i) {
-      if (d.target.no_parent) {
+      if (d.target.noParent) {
         return 'M0,0L0,0';
       }
       var diff = d.source.y - d.target.y;
@@ -114,13 +93,16 @@ const treeBuilder = {
       .append('g')
       .attr('transform', 'translate(' + opts.margin.left + ',' + opts.margin.top + ')');
 
-    var allNodes = flatten(root);
+    console.log(root);
+    var allNodes = this._flatten(root);
     //This maps the siblings together mapping uses the ID using the blue line
 
     // Compute the layout.
     var tree = d3.layout.tree().size([opts.width, opts.height]);
     var nodes = tree.nodes(root);
+    console.log(nodes);
     var links = tree.links(nodes);
+    console.log(links);
 
     // Create the link lines.
     svg.selectAll('.link')
@@ -165,6 +147,27 @@ const treeBuilder = {
       })
       .attr('x', tx)
       .attr('y', ty);
+  },
+
+  /**
+    To make the nodes in flat mode.
+    This gets all the nodes in same level
+  **/
+  _flatten(root) {
+    var n = [];
+    var i = 0;
+
+    function recurse(node) {
+      if (node.children) {
+        node.children.forEach(recurse);
+      }
+      if (!node.id) {
+        node.id = ++i;
+      }
+      n.push(node);
+    }
+    recurse(root);
+    return n;
   }
 
 };

src/dtree.js

@@ -2,7 +2,7 @@ import treeBuilder from './builder.js';
 
 const dTree = {
 
-  init(data, options = {}) {
+  init: function(data, options = {}) {
 
     var opts = _.defaults(options || {}, {
       target: '#graph',
@@ -17,13 +17,96 @@ const dTree = {
       textOffset: {
         x: -3,
         y: 3
+      },
+      styles: {
+        node: 'node',
+        link: 'link',
+        marriage: 'marriage',
+      }
+    });
+
+    var data = this._preprocess(data);
+    treeBuilder.create(data.root, data.siblings, opts);
+
+  },
+
+  _preprocess: function(data) {
+
+    var siblings = [];
+    var id = 0;
+
+    var root = {
+      name: '',
+      id: id++,
+      hidden: true,
+      children: []
+    };
+
+    var reconstructTree = function(person, parent) {
+
+      // convert to person to d3 node
+      var node = {
+        name: person.name,
+        id: id++,
+        hidden: false,
+        children: [],
+      };
+
+      // add to parent as child
+      parent.children.push(node);
+
+      // go through marriage
+      if (person.marriage) {
+
+        var m = {
+          name: '',
+          id: id++,
+          hidden: true,
+          noParent: true,
+          children: []
+        };
+
+        parent.children.push(m);
+
+        var spouse = {
+          name: person.marriage.spouse.name,
+          id: id++,
+          hidden: false,
+          noParent: true,
+          children: []
+        };
+
+        parent.children.push(spouse);
+
+        _.forEach(person.marriage.children, function(child) {
+          reconstructTree(child, m);
+        });
+
+        siblings.push({
+          source: {
+            id: node.id
+          },
+          target: {
+            id: spouse.id
+          }
+        });
+
       }
+
+    };
+
+    _.forEach(data, function(person) {
+      reconstructTree(person, root);
     });
 
-    var root = data.root;
-    var siblings = data.siblings;
+    _.forEach(root.children, function(child) {
+      child.noParent = true;
+    });
 
-    treeBuilder.create(root, siblings, opts);
+    return {
+      root: root,
+      siblings: siblings
+    };
 
   }