diff --git a/README.md b/README.md index f977d09..07dbad0 100644 --- a/README.md +++ b/README.md @@ -30,7 +30,7 @@ The data object should have the following structure: class: "overriding-css-class", textClass: "overriding-css-class", depthOffset: 1, - marriage: { + marriages: [{ spouse: { name: "Mother", class: "overriding-css-class" @@ -39,7 +39,7 @@ The data object should have the following structure: name: "Child", class: "child-class" }] - }, + }], extra: {} }] ``` diff --git a/src/builder.js b/src/builder.js index 2c0fabe..296f7c5 100644 --- a/src/builder.js +++ b/src/builder.js @@ -47,7 +47,7 @@ class TreeBuilder { // Compute the layout. this.tree = d3.layout.tree() - .nodeSize([nodeSize[0] * 2, nodeSize[1] * 2]); + .nodeSize([nodeSize[0] * 2, nodeSize[1] * 2.5]); this.tree.separation(function separation(a, b) { if (a.hidden || b.hidden) { @@ -69,15 +69,6 @@ class TreeBuilder { var nodes = this.tree.nodes(source); - // Since root node is hidden, read adjust height. - var rootOffset = 0; - if (nodes.length > 1) { - rootOffset = nodes[1].y; - } - _.forEach(nodes, function(n) { - n.y = n.y - rootOffset / 2; - }); - var links = this.tree.links(nodes); // Create the link lines. @@ -100,7 +91,7 @@ class TreeBuilder { .enter() .append('path') .attr('class', opts.styles.marriage) - .attr('d', this._siblingLine); + .attr('d', _.bind(this._siblingLine, this)); // Create the node rectangles. nodes.append('foreignObject') @@ -210,13 +201,29 @@ class TreeBuilder { _siblingLine(d, i) { var ny = d.target.y + (d.source.y - d.target.y) * 0.50; + var nodeWidth = this.nodeSize[0]; + var nodeHeight = this.nodeSize[1]; + + // Not first marriage + if (d.number > 0) { + ny -= nodeHeight * 8 / 10; + } var linedata = [{ x: d.source.x, y: d.source.y }, { - x: d.target.x, + x: d.source.x + nodeWidth * 6 / 10, + y: d.source.y + }, { + x: d.source.x + nodeWidth * 6 / 10, + y: ny + }, { + x: d.target.x - nodeWidth * 6 / 10, y: ny + }, { + x: d.target.x - nodeWidth * 6 / 10, + y: d.target.y }, { x: d.target.x, y: d.target.y @@ -229,7 +236,7 @@ class TreeBuilder { .y(function(d) { return d.y; }) - .interpolate('step-after'); + .interpolate('linear'); return fun(linedata); } diff --git a/src/dtree.js b/src/dtree.js index e16ea08..9098593 100644 --- a/src/dtree.js +++ b/src/dtree.js @@ -97,8 +97,19 @@ const dTree = { reconstructTree(child, node); }); - // go through marriage + parent.children.push(node); + + // DEPRECATED: Backwards-compatability for v1.x syntax, remove for 2.0 if (person.marriage) { + console.log('DEPRECATED: The data attribute "marriage" is deprecated in favor of "marriages" that takes an array. It will be removed in 2.0.'); + person.marriages = [person.marriage]; + } + + //sort marriages + dTree._sortMarriages(person.marriages, opts); + + // go through marriage + _.forEach(person.marriages, function(marriage, index) { var m = { name: '', @@ -106,10 +117,10 @@ const dTree = { hidden: true, noParent: true, children: [], - extra: person.marriage.extra + extra: marriage.extra }; - var sp = person.marriage.spouse; + var sp = marriage.spouse; var spouse = { name: sp.name, @@ -122,11 +133,10 @@ const dTree = { extra: sp.extra }; - var marriedCouple = dTree._sortPersons([node, spouse], opts); - parent.children.push(marriedCouple[0], m, marriedCouple[1]); + parent.children.push(m, spouse); - dTree._sortPersons(person.marriage.children, opts); - _.forEach(person.marriage.children, function(child) { + dTree._sortPersons(marriage.children, opts); + _.forEach(marriage.children, function(child) { reconstructTree(child, m); }); @@ -136,12 +146,10 @@ const dTree = { }, target: { id: spouse.id - } + }, + number: index }); - - } else { - parent.children.push(node); - } + }); }; @@ -163,6 +171,17 @@ const dTree = { }); } return persons; + }, + + _sortMarriages: function(marriages, opts) { + if (marriages != undefined && Array.isArray(marriages)) { + marriages.sort(function(marriageA, marriageB) { + var a = marriageA.spouse; + var b = marriageB.spouse; + return opts.callbacks.nodeSorter(a.name, a.extra, b.name, b.extra); + }); + } + return marriages; } }; diff --git a/test/demo/data.json b/test/demo/data.json index a01eaf2..f14df76 100755 --- a/test/demo/data.json +++ b/test/demo/data.json @@ -2,7 +2,7 @@ "name": "Niclas Superlongsurname", "class": "man", "textClass": "emphasis", - "marriage": { + "marriages": [{ "spouse": { "name": "Iliana", "class": "woman" @@ -10,7 +10,7 @@ "children": [{ "name": "James", "class": "man", - "marriage": { + "marriages": [{ "spouse": { "name": "Alexandra", "class": "woman" @@ -18,12 +18,12 @@ "children": [{ "name": "Eric", "class": "man", - "marriage": { + "marriages": [{ "spouse": { "name": "Eva", "class": "woman" } - } + }] }, { "name": "Jane", "class": "woman" @@ -40,7 +40,7 @@ "name": "Jessica", "class": "woman" }] - } + }] }] - } + }] }]