D3.Js Dendrogramm: Binden alte und neue Eigenschaften an das SVG-Element

Question

Mein Verständnis von D3 ist derzeit eher limitiert und ich feige gerade mit einem Dendrogramm-Beispiel für d3.js. Es ist an mehreren Orten zu finden: Auf diese interaktive Version zum Beispiel.

Wenn ich es implementiere, geht es gut, bis Sie versuchen, ein Eigentum wie den Kreisdurchmesser der Knoten zu aktualisieren. Wenn ich dies tue (unter Verwendung eines interaktiven Rahmens wie Angularjs, der den Parameterwechsel beobachtet): Die Knoten ändern sich in der Größe. Noch kein Problem. Wenn ich dann jedoch auf einen der Knoten klicke, wird die Größe anstelle der neuen Größe auf die Initialisierungsgröße zurückgesetzt.

Wenn ein Knoten geklickt hat, folgen Sie der Klickfunktion:

generasacodicetagpre.

Die Klickfunktion ruft eine Update-Funktion auf.

generasacodicetagpre.

das danach das Dendrogramm aktualisiert und die erforderlichen Knoten öffnet oder schließt.

generasacodicetagpre.

Diese Aktualisierungsfunktion wird somit aufgerufen:

.

1. bei Initialisierung -> Kein Problem (Beispiel: Kreis R= 5)

2. Wenn ein Parameter aktualisiert wird -> Kein Problem, aktualisiert die Parameteraktualisierungen. (Beispiel: Kreis R= 10)

3. Wenn Sie auf einen Knoten klicken -> Problematic -> Diagramm ergibt er anfängliche Parameter. (Beispiel: Kreis R= 5)

All dies hat wahrscheinlich viel mit dem Scoping zu tun, und wie JavaScript behandelt Datenbindung, aber ich weiß nicht, wie ich das ordnungsgemäß tun soll. Ich muss entweder in der Lage sein, auf die neuen Eigenschaften anstelle der alten zuzugreifen.

Gibt es einen Weg, um entweder

zu sein?
.

1. Anpassen des Codes, sodass der neue Parameter anstelle der alten eingenommen wird?

2. Binden Sie die Parameter als Objekt an die SVG-Gruppe (wahrscheinlich nicht so effizient?), SO I kann manuell von einem beliebigen Umfang mit den D3-Selektoren reichen?

Answer 1

Ich habe eine Eigenschaft auf das DOM-Element für diejenigen Attribute eingestellt, die sich pro Datendatum nicht unterscheiden.

generasacodicetagpre.

ist möglicherweise nicht die perfekte Lösung, aber es funktioniert für mich.