Флудилка тваринки, його намагання писати пет-проєкти, щось досліджувати, чи просто займатися фігньою

Ті, кого я автоматично додав, можете лівати (я не ображуся). Просто Я замучився кидати усе в 3 різних чати. Буду кидати сюди

продовжую гратися із алгоритмом малювання дерев. я узагальнений алгоритм напишу пізніше, бо не має на нього часу.

я вирішив довести до пуття вже написані PoC алгоритмів.
я подумав, що якщо я вмію малювати direct предків, то не має проблеми малювати дітей для людини. той самий алгоритм, але іде деревом не знизу вверх, а навпаки.

я його переписав та узагальнив. тепер одна і таж імплементація агоритму використовується щоб малювати предків та малювати дітей.

на скрінові вище малюються тільки дати для ноди, яка виділена стрілочкою

я дуже горжуся як я це абстрагував. просто в клас прокидаються функції, які роблять кроки по графу, але саме обрахування координат міститься тільки в середині імплементації класу: https://github.com/TheBestTvarynka/grafily/blob/feat/direct-ancestors-descendants-tree/src/layout/tree.ts#L69-L88

class ReingoldTilford {
    getRightmostChildren: (id: Id, family: Index) => Id | null;
    getLeftmostChildren: (id: Id, family: Index) => Id | null;
    getChildNodesIds: (currentNode: Id, family: Index) => Id[];
    getY: (level: number) => number;
    family: Index;

    constructor(
        getRightmostChildren: (id: Id, family: Index) => Id | null,
        getLeftmostChildren: (id: Id, family: Index) => Id | null,
        getChildNodesIds: (currentNode: Id, family: Index) => Id[],
        getY: (level: number) => number,
        family: Index,
    ) {
        this.getRightmostChildren = getRightmostChildren;
        this.getLeftmostChildren = getLeftmostChildren;
        this.getChildNodesIds = getChildNodesIds;
        this.getY = getY;
        this.family = family;
    }

// ...

ось так виглядає зараз. я добавив людей та об'єднав дерева батьків та дітей.

навіть дітей можна колапсити (ви бачите кнопки мінус на вузлах)

стрілочкою вказана starting node

гляньте що я випадково знайшов: https://github.com/NorthwoodsSoftware/GoJS

по-ідеї, воно імплементує один із алгоритмів, що мені треба

https://gojs.net/latest/samples/ldLayout.html

у них ще є класна демка. треба у себе локально запустити та спробувати внести дані родинного дерева. якщо леяут буде нормальний, тоді варто імплементовувати цей алгоритм

дуже потужна ліба. тут приклади використання: https://gojs.net/latest/samples/

як добре що є ai.
клонував репу. тикнув у потрібний sample і сказав написати такий самий, але координати графа захардкодити замість автогенерування.

в принципі, алгоритм працює добре.
там є багато дрібних косяків. дещо не по центру. дещо треба було свапати місцями щоб було норм.

проте свапання можна легко пофіксити власною імплементацією обходу графа. головне що overall layout виглядає нормально та видно зв'язки