1

我使用分层布局作为我的页面的默认设置。我想使用一些顶点(“2”)作为其他元素(“2.1”...“2.3”)的容器。

我怎样才能做到这一点?

var graph = new mxGraph(document.getElementById('graphContainer'));
var layout =  new mxHierarchicalLayout(graph);

graph.getModel().beginUpdate();
try {
  var parent = graph.getDefaultParent();
  var v0 = graph.insertVertex(parent, null, "0", 0, 0, 240, 30);
  var v1 = graph.insertVertex(parent, null, "1", 0, 0, 240, 30);

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

  var v2 = this.graph.insertVertex(parent, null, "2", 0, 0, 240, 30, 'o1');
  graph.insertEdge(parent, null, null, v1, v2);

  graph.insertVertex(v2, null, "2.1", 0, 0, 220, 30);
  graph.insertVertex(v2, null, "2.2", 0, 0, 220, 30);
  graph.insertVertex(v2, null, "2.3", 0, 0, 220, 30);

  var v3 = this.graph.insertVertex(parent, null, "3", 0, 0, 240, 30);
  graph.insertEdge(parent, null, null, v1, v3);

  layout.execute(parent);

} finally {
  graph.getModel().endUpdate();
}
<script src="http://jgraph.github.io/mxgraph/javascript/src/js/mxClient.js"></script>
<div id="graphContainer" />

4

1 回答 1

0

beginUpdate()和之间的部分endUpdate()都是一个复合操作。mxGraph 在每次更改时更新模型,但仅触发模型更改事件并在之后重绘endUpdate()

因此,您可以依次调用布局,它将作为一个可撤消的操作发生。

如果您要从最子单元格布局到最顶层容器,则可能需要切换:

mxHierarchicalLayout.resizeParent

mxHierarchicalLayout.moveParent

true. 有关更多详细信息,请参阅类 API 规范中的相关条目。

于 2015-10-07T08:17:45.970 回答