J'utilise la disposition de l'arbre D3, telle que celle-ci: http: //mbostock.github. Com / D3 / Talk / 20111018 / Tree.html
Je l'ai modifié pour mes besoins et je suis en cours d'exécution. L'exemple a le même problème que si vous avez trop de nœuds ouverts, ils deviennent compacts et font de la lecture et d'interagir difficiles. Je veux définir un espace vertical minimum entre les nœuds lors de la réinitialisation de la scène pour permettre un tel espacement.
J'ai essayé de modifier l'algorithme de séparation pour le faire fonctionner: qui n'a pas fonctionné. J'ai également essayé de calculer quelle profondeur avait la plupart des enfants que de dire à la hauteur de la scène d'être J'ai également essayé de modifier aussi la valeur de la valeur Si vous pouvez suggérer un moyen ou savoir une manière que je peux accomplir un minimum d'espacement verticalement entre les nœuds s'il vous plaît Publier. Je serai très reconnaissant. Je manque probablement quelque chose de très simple. enfants * spacebetweennodes . Cela m'a rapproché, mais n'était toujours pas précis. x du nœud dans la méthode ci-dessous où elle calcule La séparation y , mais pas de cigare. Je posterais aussi ce changement aussi mais je l'ai supprimé de mon code.
4 Réponses :
J'ai pu comprendre cela avec l'aide d'un utilisateur sur Google Groupes. Je n'ai pas pu trouver le post. La solution vous oblige à modifier d3.js dans un endroit, qui n'est pas recommandée, mais c'était le seul à contourner ce problème que je pouvais trouver.
Démarrage de la ligne STRY> Changement: strong> p> 5724 code> ou cette méthode: D3_LAYOUT_TREEVISATIADER CODE> P> var tree = d3.layout.tree()
.size(null)
.elementsize(50, 240);
Voici le lien Google Groupes pour plus d'infos groups.google.com / Forum /? Fromgroups #! Topic / D3-JS / 7JS0DGLYEK
Dans la version 3 D3, il y a maintenant une propriété nagonnée qui fera la même chose que la modification ci-dessus. Ref: Github.com/mbostock/d3/wiki/tree-layout#NodeDesize < / a>
Le correctif original que vous avez proposé fonctionnera, il vous suffit de vous assurer de le faire après avoir tout ajouté à la toile. D3 recalculer la mise en page Chaque fois que vous entrez, quittez, appendez, etc. Une fois que vous avez tout fait, vous pouvez jouer avec le D.Y pour résoudre la profondeur.
nodes.forEach(function(d) { d.y = d.depth * fixdepth});
Je sais que je ne suis pas censé répondre à d'autres réponses, mais je n'ai pas assez de réputation pour ajouter un commentaire.
Quoi qu'il en soit, je voulais juste mettre à jour cela pour les personnes utilisant les derniers d3.v3.js déposer. (Je suppose que cela est dû à une nouvelle version, car les références de la ligne dans la réponse acceptée étaient fausses pour moi.)
la fonction D3.Layout.tree que vous modifiez est trouvée entre les lignes 6236 et 6345 . D3_LAYOUT_TREEVISATIADERTER Démarre à la ligne 6318. La variable de hiérarchie est déclarée à la ligne 6237. Le bit d'arbre.elementsize est toujours debout - je l'ai mis à la ligne 6343.
Enfin (je suppose que c'était une erreur): Vous créez l'arbre, mettez les dimensions à l'intérieur des crochets, comme vous le faites normalement avec la "taille". Donc:
Si vous utilisez la version 3, vous ne devriez pas avoir à effectuer la modification. Il y a déjà une propriété nocignotisée qui peut être utilisée à la place des éléments.
À partir de 2016, j'ai pu atteindre cet article en utilisant juste https://github.com/mbostock/d3/wiki/tree-layout#NodeDesize La référence de l'API est un peu pauvre, mais fonctionne jolie directe. Assurez-vous de l'utiliser après Pour plus de référence: D3 Séparation de la disposition de l'arborescence entre les nœuds à l'aide de nodesize Tree.Size ([Hauteur, Largeur]) ou d'autre, vous remplacerez vos valeurs à nouveau.