Already much better positions

This commit is contained in:
Ruben van de Ven 2019-02-25 17:05:14 +01:00
parent 6f8cacdaae
commit 0bdc79aff2

View file

@ -218,7 +218,7 @@ class Graph {
c.attr( "transform", d3.event.transform ); c.attr( "transform", d3.event.transform );
} }
this.svg.call( d3.zoom() this.svg.call( d3.zoom()
.scaleExtent( [1 / 2, 8] ) .scaleExtent( [1 / 16, 8] )
.on( "zoom", zoomed ) ); .on( "zoom", zoomed ) );
this.nodesG = this.container.append( "g" ) this.nodesG = this.container.append( "g" )
@ -1043,10 +1043,17 @@ class Graph {
// .force( "center", d3.forceCenter( this.width / 2, this.height / 2 ) ) // .force( "center", d3.forceCenter( this.width / 2, this.height / 2 ) )
.force( "collide", d3.forceCollide( this.nodeSize * 1.5 ).strength(1) ) .force( "collide", d3.forceCollide( this.nodeSize * 1.5 ).strength(1) )
.force( "forceX", d3.forceX(function(m){ .force( "forceX", d3.forceX(function(m){
let fx = panopticon.graph.distances[m['@id']] !== null ? panopticon.graph.distances[m['@id']] * panopticon.graph.nodeSize * 4 : 0 let fx = panopticon.graph.distances[m['@id']] !== null ? panopticon.graph.distances[m['@id']][0] * panopticon.graph.nodeSize * 4 : 0
// console.log('fx', m['@id'], panopticon.graph.distances[m['@id']], fx); // console.log('fx', m['@id'], panopticon.graph.distances[m['@id']], fx);
return fx; return fx;
}).strength(50)) }).strength(50))
.force( "forceY", d3.forceY(function(m){
// if(panopticon.graph.distances[m['@id']] !== null )
// console.log(panopticon.graph.distances[m['@id']][1]);
let fy = panopticon.graph.distances[m['@id']] !== null ? panopticon.graph.distances[m['@id']][1] * panopticon.graph.nodeSize * 3: 0
// console.log('fx', m['@id'], panopticon.graph.distances[m['@id']], fx);
return fy;
}).strength(50))
// .force( "forceY", d3.forceY(m => panopticon.graph.distances[m['@id']] !== null ? 0 : panopticon.graph.nodeSize * 3 ).strength(30)) // .force( "forceY", d3.forceY(m => panopticon.graph.distances[m['@id']] !== null ? 0 : panopticon.graph.nodeSize * 3 ).strength(30))
; ;
this.simulation.velocityDecay(.99); this.simulation.velocityDecay(.99);
@ -1247,33 +1254,45 @@ class Graph {
sourcesPerMsg[to].push(from); sourcesPerMsg[to].push(from);
} }
let traverseMsg = function(msgId, depth, goingDown) { let traverseMsg = function(msgId, depth, goingDown, yPos) {
let msgsPerMsg = goingDown ? targetsPerMsg : sourcesPerMsg; let msgsPerMsg = goingDown ? targetsPerMsg : sourcesPerMsg;
// console.log(goingDown, msgId, depth); // console.log(goingDown, msgId, depth);
if(!msgsPerMsg.hasOwnProperty(msgId)) { if(!msgsPerMsg.hasOwnProperty(msgId)) {
// end of trail // end of trail
return; return yPos;
} }
let i = 0;
for(let childMsgId of msgsPerMsg[msgId]) { for(let childMsgId of msgsPerMsg[msgId]) {
if(distances[childMsgId] === null || (goingDown && distances[childMsgId] > depth)) { if(distances[childMsgId] === null || (goingDown && distances[childMsgId][0] > depth)) {
distances[childMsgId] = depth; if(i > 0)
yPos++;
i++;
distances[childMsgId] = [depth, yPos];
// console.log(goingDown, childMsgId, depth); // console.log(goingDown, childMsgId, depth);
traverseMsg(childMsgId, goingDown ? (depth+1) : (depth - 1), goingDown); yPos = traverseMsg(childMsgId, goingDown ? (depth+1) : (depth - 1), goingDown, yPos);
} }
else if(!goingDown && distances[childMsgId] < depth) { else if(!goingDown && distances[childMsgId][0] < depth) {
// console.log('a', depth); // console.log('a', depth);
traverseMsg(childMsgId, depth - 1, goingDown); yPos = traverseMsg(childMsgId, depth - 1, goingDown, yPos);
} else { } else {
// apparently, there is a loop. Don't traverse it. // apparently, there is a loop. Don't traverse it.
} }
} }
return yPos;
} }
let yPos = 0;
for(let startMsg of starts) { for(let startMsg of starts) {
if(distances[startMsg['@id']] === null) { if(distances[startMsg['@id']] === null) {
distances[startMsg['@id']] = 0; distances[startMsg['@id']] = [0, yPos];
} }
traverseMsg(startMsg['@id'], 1 , true); yPos = traverseMsg(startMsg['@id'], 1 , true, yPos);
yPos += 1;
} }
// now we have the formal tree, lets try to polish the rest: // now we have the formal tree, lets try to polish the rest:
@ -1283,7 +1302,7 @@ class Graph {
} }
// let's see if there are parent nodes that are not in the distances array // let's see if there are parent nodes that are not in the distances array
// traverse up and see whether we encounter anything new // traverse up and see whether we encounter anything new
traverseMsg(msgId, distances[msgId] -1, false) traverseMsg(msgId, distances[msgId][0] -1, false, distances[msgId][1])
} }
// let additionalsDepth = 0; // let additionalsDepth = 0;