mxGraph Hierarchical layout咋么使用

mxGraph Hierarchical layout的使用可以分为三个步骤：

1. 创建mxGraph对象和要布局的图形

var graph = new mxGraph(container); // container是一个HTML元素，用于显示图形
var parent = graph.getDefaultParent(); // 获取图形的根节点

2. 创建mxHierarchicalLayout对象并设置属性

var layout = new mxHierarchicalLayout(graph);
layout.orientation = mxConstants.DIRECTION_NORTH; // 设置布局方向
layout.intraCellSpacing = 50; // 设置节点之间的水平间距
layout.interRankCellSpacing = 100; // 设置节点之间的垂直间距

3. 运行布局算法

layout.execute(parent); // parent为要布局的节点的父节点

完整的代码示例：

var container = document.getElementById('container');
var graph = new mxGraph(container);
var parent = graph.getDefaultParent();

var layout = new mxHierarchicalLayout(graph);
layout.orientation = mxConstants.DIRECTION_NORTH;
layout.intraCellSpacing = 50;
layout.interRankCellSpacing = 100;

graph.getModel().beginUpdate();
try {
  layout.execute(parent);
} finally {
  graph.getModel().endUpdate();
}

这样就可以对mxGraph对象中的节点进行Hierarchical layout布局了。当然，您还可以根据需要对mxHierarchicalLayout的其他属性进行设置，以满足您的具体需求。