Как сделать mxCompactTreeLayout справа налево? инвертировать не работает - PullRequest
Новая
       50

Как сделать mxCompactTreeLayout справа налево? инвертировать не работает

0 голосов
/ 28 апреля 2020

Обновление # 1:

Вот несколько новых подсказок, выглядит invert только обменивается source и target края, но не меняет направление дерева.

Эффект обмена root и v1 такой же, как при установке invert на true

const root = graph.insertVertex(parent, 'root', 'Root', 0, 0, 60, 40);

const v1 = graph.insertVertex(parent, 'child-2', 'Child 1', 0, 0, 60, 40);

graph.insertEdge(parent, null, null, root, v1);

const v2 = graph.insertVertex(parent, 'child-1', 'Child 2', 0, 0, 60, 40);

graph.insertEdge(parent, null, null, root, v2);

новой демонстрации: https://codepen.io/hungtcs/pen/eYpRGNg

Есть ли способ изменить направление (справа налево) дерева?

Origin:

Я хочу создать компактную компоновку дерева справа налево наконец-то я нашел inverted переменную mxCompactTreeLayout, но она не работает, моя живая демонстрация

mxCompactTreeLayout.invert Указывает, является ли ребро направления должны быть инвертированы

Это случай, когда инвертировано ложно

enter image description here

Это случай, когда инвертировано верно , макет нарушен

enter image description here

1 Ответ

1 голос
/ 28 апреля 2020

Я не думаю, что это возможно из коробки, но если вы измените немного внутренних элементов mxCompactTreeLayout, это может сработать:

Есть такая функция attachParent : 

mxCompactTreeLayout.prototype.attachParent = function(node, height)
{
    var x = this.nodeDistance + this.levelDistance;
    var y2 = (height - node.width) / 2 - this.nodeDistance;
    var y1 = y2 + node.width + 2 * this.nodeDistance - height;

    node.child.offsetX = x + node.height;
    node.child.offsetY = y1;

    node.contour.upperHead = this.createLine(node.height, 0,
        this.createLine(x, y1, node.contour.upperHead));
    node.contour.lowerHead = this.createLine(node.height, 0,
        this.createLine(x, y2, node.contour.lowerHead));
};

Не знаю, почему offsetX зависит от высоты, но если вы измените это одно присвоение на -(x + node.height), ваш пример будет выглядеть так:

reversedLayout

просто добавьте это: 

layout.attachParent = function(node, height)
{
    var x = this.nodeDistance + this.levelDistance;
    var y2 = (height - node.width) / 2 - this.nodeDistance;
    var y1 = y2 + node.width + 2 * this.nodeDistance - height;

    node.child.offsetX = -(x + node.height);
    node.child.offsetY = y1;

    node.contour.upperHead = this.createLine(node.height, 0,
        this.createLine(x, y1, node.contour.upperHead));
    node.contour.lowerHead = this.createLine(node.height, 0,
        this.createLine(x, y2, node.contour.lowerHead));
};

или проверьте пример https://codepen.io/godric3/pen/rNOwRxK

...