mxgraph

Question

mxgraph中有泳道example，但它不是自动的。所以我将graphlayout示例作为基础而不做任何改动：

• 始终使用mxSwimlaneLayout
• 从泳道示例中采用泳道细胞样式
• 创建了两个泳道
• 将它们用作顶点的父项

以下是我创建泳道的方法：

var lane1 = graph.insertVertex(parent, null, 'Lane 1', 0, 0, 1000, 100, 'swimlane');
var lane2 = graph.insertVertex(parent, null, 'Lane 2', 0, 100, 1000, 100, 'swimlane');
// use as parent...
var v1 = graph.insertVertex(lane1, null, 'A', 0, 0, w, h);

并执行布局：

layout.orientation = mxConstants.DIRECTION_WEST;
layout.resizeParent = true;
layout.execute(parent, [lane1, lane2]);

这里是test page。

现在，这里有两个问题：

• 节点未放置在车道内;似乎车道根本没有受到尊重。如何使布局将节点放入适当的通道？设置车道作为父母似乎是不够的。
• 我认为WEST会在左边构建图形，但它是相反的......还有NORTH下降......为什么？

Answer 1

远离完美，但有所改进：

Demo

我添加了：

layout.execute(lane1, [v1,v2,v3,v4]);
layout.execute(lane2, [v5,v6,v7,v8]);

并将resizeParent更改为false，看起来车道受到尊重，但看起来仍然不太舒服。

Answer 2

我也面临着同样的问题，我能够解决。 在我的代码中，为了自动重排图形，我使用了mxSwimlanelayout：

var layout = new mxSwimlaneLayout(this.editor.graph,mxConstants.DIRECTION_WEST);
layout.execute(this.editor.graph.getDefaultParent(),this.editor.graph.getDefaultParent().children /*swimlanes*/);

尽管节点（swimmlanes的子节点）是自动排列的，但不尊重swimmanes。（与作者相同）所以我通过库（mxClient.js）进行了调查。我进行了以下更改：

mxSwimlaneLayout.prototype.resizeParent = true;
mxSwimlaneLayout.prototype.moveParent = true;

内部mxSwimlaneLayout.prototype.execute函数： 将this.graph.updateGroupBounds替换为this.updateGroupBounds

和mxSwimlaneLayout.prototype.updateGroupBounds函数中， 替换了以下块：

for (var i = 0; i < edge.edges.length; i++)
{
    cells.push(edge.edges[i]);
}

作者：

for (key2 in edge)
{
    cells.push(edge[key2].edges[0]);
}

（与数据格式不兼容）

希望这会有所帮助。 我不完全了解这些更改的工作方式/原因。图书馆作者也许可以提供帮助。