Ich baue eine Baumstruktur (oder modifiziere eines der Beispiele mit einem Satz meiner eigenen Daten in meinem eigenen json) und ich versuche, einige Funktionen zu erstellen:
Das Layout meines Baums ist das aus dem Baumbeispiel: Ссылка
Ich füge (zu den Kreisen) ein onclick-Ereignis hinzu, das ich die untergeordneten Elemente des angeklickten Knotens reduzieren möchte. Das heißt, wenn ein Benutzer auf den stahlblauen Kreis klickt, der einem Knoten zugeordnet ist, möchte ich, dass die Knoten untergeordnete Elemente verschwinden.
Ich habe die Dokumentation durchforstet und habe nichts gefunden, was es mir erlauben würde, Knoten zum Kollaps oder zum Verschwinden zu bringen.
Was könnte ich tun?
Da ist das:
Es gibt eine Reihe anderer interaktiver hierarchischer Layout-Beispiele aus meinem SVG Open-Keynote .
Leider bin ich immer noch mit D3 auf dem Laufenden und bin mir nicht sicher, wie ich Ihre Frage am besten beantworten soll. Aber hier ist ein kraftgesteuertes Layout, mit dem Sie Knoten anzeigen / ausblenden können, indem Sie darauf klicken, was Ihnen einige Ideen geben könnte: Ссылка
Es gibt ein paar Ansätze, eines davon besteht darin, den regulären Stil zu verwenden, um das Markup der Kinder zu verbergen (Deckkraft: 0 oder Anzeige: keine). Dies macht jedoch nur die Daten unsichtbar, der Baum behält seine Form bei, als ob die Daten dort sind, Sie können es einfach nicht sehen.
Normalerweise möchten Sie, dass der Baum so tut, als ob die Daten nicht vorhanden wären, und entsprechend aktualisieren. Dafür können Sie den gleichen Ansatz wie das Beispiel für das erzwungene Layout im obigen Link verwenden.
Es läuft darauf hinaus: 1) Verwenden Sie eine Funktion, um den Baum d3 zu erstellen 2) Anhängen eines Klickereignisses an die kollabierbaren Knoten 3) Das click-Ereignis benennt die children-Eigenschaft des Knotens um und ruft die Funktion in 1) auf, die die Baumstruktur ohne die untergeordneten Elemente dieses Knotens neu zeichnet.
Hier ist der relevante Code aus dem Link in nkorens Antwort ( Ссылка ):
%Vor%Tags und Links hierarchy d3.js force-layout