Ich arbeite an einem kraftgerichteten Graphen in D3. Ich möchte den Mouseover-Knoten, seine Links und seine untergeordneten Knoten hervorheben, indem ich alle anderen Knoten und Links auf eine geringere Deckkraft setze.
In diesem Beispiel, http://jsfiddle.net/xReHA/ , kann ich alle Links und Knoten ausblenden und dann die verbundenen Links einblenden, aber bisher konnte ich die nicht elegant einblenden verbundene Knoten, die untergeordnete Knoten des aktuell mit der Maus übermittelten Knotens sind.
Dies ist die Schlüsselfunktion aus dem Code:
function fade(opacity) {
return function(d, i) {
//fade all elements
svg.selectAll("circle, line").style("opacity", opacity);
var associated_links = svg.selectAll("line").filter(function(d) {
return d.source.index == i || d.target.index == i;
}).each(function(dLink, iLink) {
//unfade links and nodes connected to the current node
d3.select(this).style("opacity", 1);
//THE FOLLOWING CAUSES: Uncaught TypeError: Cannot call method 'setProperty' of undefined
d3.select(dLink.source).style("opacity", 1);
d3.select(dLink.target).style("opacity", 1);
});
};
}
Ich erhalte eine Uncaught TypeError: Cannot call method 'setProperty' of undefined
Fehlermeldung, wenn ich versuche, die Deckkraft eines Elements festzulegen, das ich aus der Datei source.target geladen habe. Ich vermute, dass dies nicht der richtige Weg ist, um diesen Knoten als d3-Objekt zu laden, aber ich kann keinen anderen Weg finden, um ihn zu laden, ohne alle Knoten erneut zu durchlaufen, um diejenigen zu finden, die dem Ziel oder der Quelle des Links entsprechen. Um die Leistung angemessen zu halten, möchte ich nicht mehr als nötig über alle Knoten iterieren.
Ich habe das Beispiel des Ausblendens der Links von http://mbostock.github.com/d3/ex/chord.html genommen :
Dies zeigt jedoch nicht, wie die verbundenen untergeordneten Knoten geändert werden können.
Alle guten Vorschläge, wie dies gelöst oder verbessert werden kann, werden heftig positiv bewertet :)
quelle