Entfernen Sie die Verknüpfung zum Stammknoten von untergeordneten Knoten in d3 Baum

Question

Ich folgte dieser blog, um eine eingerückte zusammenklappbare Struktur zu erstellen. Ich brauche eine kleine Änderung in diesem. Ich möchte, dass dieser Baum ohne Wurzel ist. Das hört sich vielleicht dumm an, aber das ist es, was ich brauche. Jetzt sind zwei Hauptkomponenten von d3 tree Knoten und Links. Ich habe einen Workaround ausgetrickst, um die Knoten mit diesem link auszublenden und den Höhenfaktor für Wurzelknoten und Beschriftung als "0" zu setzen. Daher ist der Wurzelknoten nicht mehr sichtbar. Ich habe jedoch keinen Trick im Zusammenhang mit dem Verstecken der Links von 24 untergeordneten Knoten zu root gemacht. Daher scheinen alle untergeordneten Knoten mit einem Wurzelknoten "ohne Name" verknüpft zu sein. Ich möchte jeden Link zur Wurzel des Baumes verstecken. Hinweis: alle 24 unterordnete Knoten haben Unterkind. Unten ist ein Teil des Links, der nicht funktioniert.

// Update the links 
var link = svg.selectAll("path.link") 
    .data(tree.links(nodes), function(d) { return d.target.id; }); 

link.enter().insert("path", "g") 
    .attr("class", "link") 
    .attr("d", function(d) { 
     var o = {x: source.x0, y: source.y0}; 
     return diagonal({source: o, target: o}); 
    }) 
    .transition() 
    .duration(duration) 
    .attr("d", diagonal); 

// Transition links to their new position. 
link.transition() 
    .duration(duration) 
    .attr("d", diagonal); 

// Transition exiting nodes to the parent's new position. 
link.exit().transition() 
    .duration(duration) 
    .attr("d", function(d) { 
     var o = {x: source.x, y: source.y}; 
     return diagonal({source: o, target: o}); 
    }) 
    .remove(); 

// Stash the old positions for transition. 
nodes.forEach(function(d) { 
    d.x0 = d.x; 
    d.y0 = d.y; 
}); 

Answer 1

Sie können die Anzeigeeigenschaft auf Verbindungselemente verwenden

link.enter().insert("path", "g") 
.attr("class", "link") 
.attr("d", function(d) { 
    var o = {x: source.x0, y: source.y0}; 
    return diagonal({source: o, target: o}); 
}) 
.style("display", function (d) { 
    if (d.depth == 1) { //Is top link         
     return 'none'; 
    } 
}) 
.transition() 
.duration(duration) 
.attr("d", diagonal); 

Diese alle Verbindungen mit einer Tiefe von 1 verstecken würde, zeigen aber immer noch die andere, die