cytoscape.js多种布局，复合节点内的不同布局

Question

库：http://js.cytoscape.org/

目标：

1. 元素必须使用多种布局（dagre和网格）放置在位置
2. 化合物 /父元素必须使用 dagre 布局
进行定位 必须使用网格布局在单个列中放置
3. 子元素（如项目列表）

问题： 使用dagre布局后，我尝试为复合节点进行布局，但是它会重置所有具有新布局的元素，而我想让父节点保持为dagre放置它们的位置

JSFIDDLE： https://jsfiddle.net/bababalcksheep/jwm701oe/

代码：

Google Cloud SDK 214.0.0 alpha 2018.08.24 
app-engine-java 1.9.64
app-engine-python 1.9.74 beta 2018.08.24 bq 2.0.34
cloud-datastore-emulator 2.0.2 
core 2018.08.24 
gsutil 4.33 
kubectl 2018.08.24 
pubsub-emulator 2018.08.24

Answer 1

最适合我的解决方案是

1. 首先在子元素上运行布局，以便复合节点可以按照样式采用正确的形状/大小
2. 然后在复合节点上运行布局

如果有更好的建议，请分享

JSFIDDLE： https://jsfiddle.net/bababalcksheep/jwm701oe/75/

  function runLayouts(fit, callBack) {
    // step-1 position child nodes 
    var parentNodes = cy.nodes(':parent');
    var grid_layout = parentNodes.descendants().layout({
      name: 'grid',
      cols: 1,
      fit: fit
    });
    grid_layout.promiseOn('layoutstop').then(function(event) {
      // step-2 position parent nodes 
      var dagre_layout = parentNodes.layout({
        name: 'dagre',
        rankDir: 'TB',
        fit: fit
      });
      dagre_layout.promiseOn('layoutstop').then(function(event) {
        if (callBack) {
          callBack.call(cy, event);
        }
      });
      dagre_layout.run();
    });
    grid_layout.run();

  }