Ich habe d3.js Baum, wenn ich nach einem bestimmten Knotennamen suche Ich muss Zoom auf den jeweiligen Knoten. Idealerweise enthält mein Baum 1000 Knoten und wird verkleinert, um in den Bildschirm zu passen. Wenn ich den Fokus sage, möchte ich, dass der Knoten in der Mitte der Seite steht und der Zoom 1: 1 sein sollte. Gibt es ein bestimmtes d3-Event, das das tut?zoom d3.js Baum für einen bestimmten Knoten
0
A
Antwort
0
Ich konnte kein Ereignis finden, das dies tut, stattdessen habe ich den Knoten manuell fokussiert, indem ich den Übergang änderte.Hope das wird für jemanden nützlich sein.
/***** get co-ordinates of the entire svg group containing the node.
Tree is placed on the centre of the screen
****/
var svgGroupTranslateCoords = d3.transform($("#svg").attr("transform"))
translateX = svgGroupTranslateCoords .translate[0];
translateY = svgGroupTranslateCoords .translate[1];
scaleX = svgGroupTranslateCoords .scale[0];
scaleY = svgGroupTranslateCoords .scale[1];
/******* Get co-ordinates for the node to be highlighted or focused*******/
var nodeCoords = d3.transform($("#node").attr("transform"))
ntranslateX = nodeCoords.translate[0];
ntranslateY = nodeCoords.translate[1];
/**** find the new co-ordinates where the focused node is to be positioned ****/
var newTranslateX = translateX-ntranslateX;
var newtranslateY = translateY-ntranslateY
svgGroup.transition().attr("transform", "translate(" + newTranslateX + "," + newtranslateY + ")scale(1,1)");
Verwandte Themen
- 1. D3.js Baum benutzerdefinierte Knoten überlappend
- 2. D3.JS 'Zoom' undefined
- 3. D3.js: Erweitern Sie den Baum bis zum Knoten
- 4. Ein zusammenklappbarer Baum in D3.js
- 5. d3.js wie Knoten dynamisch zu einem Baum hinzufügen
- 6. d3.js - Hinzufügen von Zoom und Pan verhindert Knoten ziehen
- 7. D3.js: Knoten innerhalb anderem Knoten
- 8. d3 Baum Probleme Aktualisierung letzten Knoten
- 9. d3.js v4 d3.zoom und seltsame Element Reihenfolge nach Zoom oder Schwenk
- 10. d3.js Umschreiben Zoom Beispiel in version4
- 11. D3 Baum/Cluster Diagramm - Ändern Knoten Farbe
- 12. D3.js - Zoom/Transform mehrere Zeilen
- 13. d3.js: Ordinale Skalierung und Zoom/Pan
- 14. d3.js v4 programmatisch Pan + Zoom. Wie?
- 15. Heatmap auf Zoom vergrößern D3.js/v4
- 16. Zoom Pan Bilder mit d3.js
- 17. D3 Baum vertikale Trennung
- 18. Größenänderbare Rechtecke für Knoten in D3 reduzierbarem Baum
- 19. d3 js Knoten als Bilder
- 20. d3.js Eingedrückter Baum mit geraden Verbindungen
- 21. dagre-d3 js Zoom Passend für alle Inhalte
- 22. D3.js Baum Alles erweitern und Alles ausblenden
- 23. Wie erweitere ich bestimmte Knoten in einem faltbaren Baum mit d3.js?
- 24. Wie in D3.js
- 25. D3.js Baum-Layout - Willst du Nachfahren bekommen
- 26. Knoten Suchleiste für D3.js Grafik mit jQuery
- 27. D3.js feste Breite Baum mit begrenzten Vertiefung
- 28. D3 Mausrad Zoom-Richtung
- 29. D3.js Automatische Schriftgrössenberechnung basierend auf Knoten einzelnen Radius/Durchmesser
- 30. D3 Baum Level Selector