D3 Диаграмма Сосульки Статическая Высота Узла

#d3.js #icicle-diagram

Вопрос:

Я создаю горизонтальную диаграмму сосулек D3, которая будет использоваться для отображения родословной. Это покажет только отца/мать, поэтому у каждого узла будет только два ребенка (его родителей), и это будет продолжаться до конца этой конкретной строки.

Проблема, с которой я сталкиваюсь, заключается в том, что некоторые строки длиннее других, и это приводит к большему значению для его родительских узлов. Это значение затем делает эту конкретную высоту узла больше, чем другую, так как именно так работают диаграммы сосулек.

Хотя в этом наблюдаемом нет родословной, он показывает пример масштабируемой диаграммы сосулек: https://observablehq.com/@john-guerra/zoomable-variable-size-icicle

«vis» в приведенном выше примере всегда будет больше, чем «util», потому что он имеет большее значение, основанное на его дочерних элементах (и их значениях). Что я хотел бы сделать, так это установить, чтобы каждый дочерний узел был одинаковой высоты.

Чтобы еще больше упростить это, это означало бы, что каждый дочерний узел будет составлять 50% высоты своего родительского узла.

Я не хочу устанавливать статические/жестко заданные значения высоты, так как я хотел бы, чтобы это оставалось отзывчивым и приводило к беспорядку при отображении последующих поколений.

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

Благодарен за любой совет или указание в правильном направлении с этим.

Комментарии:

1. Ваша ссылка на observablehq нарушена…

2. @RobinMackenzie Спасибо, не знал, что мое личное. Вот ссылка на пример, который я раздвоил: observablehq.com/@john-guerra/zoomable-variable-size-icicle