dkey Sankey - Evidenzia tutti i percorsi collegati dall'inizio alla fine

Question

Sto tentando di evidenziare tutti i collegamenti e i collegamenti collegati dei loro nodi di destinazione fino alla fine del layout.

Il primo livello di evidenziare è facilmente ottenibile come segue -

Nel nodo clic, chiamare highlight_paths(1);

function highlight_paths(stroke_opacity) { 
    return function(d,i){ 
     d.sourceLinks.forEach(function(srcLnk){ 
      d3.select("#link"+srcLnk.id).style("stroke-opacity", stroke_opacity); 
     }); 
     d.targetLinks.forEach(function(srcLnk){ 
      d3.select("#link"+srcLnk.id).style("stroke-opacity", stroke_opacity); 
     }); 
    } 
} 

ma non sono ancora in grado di scrivere correttamente un algoritmo ricorsivo per ottenere tutti i sourceLinks e targetLinks di ciascuno dei connessi fonte & nodi di destinazione.

Tutti i pensieri sono apprezzati!

Grazie.

Answer 1

Stavo passando attraverso il codice di layout di sankey e ho trovato un'implementazione di Breadth First Search per attraversare i nodi di layout. Alcune conoscenze su BFS qui - http://www.cse.ohio-state.edu/~gurari/course/cis680/cis680Ch14.html

puramente basato su questo, qui è la funzione di mettere in evidenza tutti i percorsi dal nodo cliccato in entrambe le direzioni - Forward (Target) e indietro (Fonte)

Spero che questo aiuti qualcuno!

esempio di lavoro - http://bl.ocks.org/git-ashish/8959771

function highlight_node_links(node,i){ 

    var remainingNodes=[], 
     nextNodes=[]; 

    var stroke_opacity = 0; 
    if(d3.select(this).attr("data-clicked") == "1"){ 
    d3.select(this).attr("data-clicked","0"); 
    stroke_opacity = 0.2; 
    }else{ 
    d3.select(this).attr("data-clicked","1"); 
    stroke_opacity = 0.5; 
    } 

    var traverse = [{ 
        linkType : "sourceLinks", 
        nodeType : "target" 
        },{ 
        linkType : "targetLinks", 
        nodeType : "source" 
        }]; 

    traverse.forEach(function(step){ 
    node[step.linkType].forEach(function(link) { 
     remainingNodes.push(link[step.nodeType]); 
     highlight_link(link.id, stroke_opacity); 
    }); 

    while (remainingNodes.length) { 
     nextNodes = []; 
     remainingNodes.forEach(function(node) { 
     node[step.linkType].forEach(function(link) { 
      nextNodes.push(link[step.nodeType]); 
      highlight_link(link.id, stroke_opacity); 
     }); 
     }); 
     remainingNodes = nextNodes; 
    } 
    }); 
} 

function highlight_link(id,opacity){ 
    d3.select("#link-"+id).style("stroke-opacity", opacity); 
}