Настраиваемый узел дерева D3.js перекрывается

Question

Я искал форум по аналогичной проблеме, но ничего не нашел.

Я использую this d3-based org chart в качестве отправной точки.

Выше нижняя часть моего дерева. На узлах листа (желтый) Я должен изменить их размер, чтобы разместить больше элементов, которые я не знаю, сколько заранее. В результате один узел перекрывает другие узлы.

Надеется, что вы, ребята, можете помочь мне здесь:

1/ Как изменить размер в узлы без disrepect расстояния между ними?

2/ Даже если я могу управлять, чтобы сделать узлы на желтой ветке не перекрываются, когда я расширяю узлы на зеленой ветви, они по-прежнему перекрывают узлы на желтой стороне?

3/ или есть лучший способ достичь этого?

Спасибо!

Answer 1

Для тех, кто должен что-то делать, Tree layout separation - это путь.

function separation (a, b) { 
    return a.parent == b.parent ? 1 : 2; 
} 

Это сбивает с толком чтения документа, но после просмотра некоторых статей, здесь идет (, что это число 1,2 означает?):

Расстояние между узлами будет результатом , что число раз ширина узла

Итак, что вы хотите сделать, это установить узел по умолчанию-х Размер быть [1, YOUR_DEFAULT_HEIGHT]

Тогда вместо возврата 1 или 2, вы бы вернуть узла ширина. Вот почему вы установили ширину начального узла равным 1.

Вот и все. Надеюсь, что это поможет :)