React Cytoscape JS：所有节点都累积在一个位置中

Question

[使用dagre创建路径时，整个节点会累积在一个位置。我们如何为节点设置默认位置（无需反应的Cytoscape js可以正常工作），而不是使用节点的position属性单独设置位置。

const layout = {
  name: "dagre",
  rankDir: "LR"
}
pageData = < CytoscapeComponent
elements = {
  CytoscapeComponent.normalizeElements({
    nodes: nodess,
    edges: edgess,
    layout: layout,
  })
}
pan = {
  {
    x: 200,
    y: 200
  }
}
autounselectify = {
  true
}
userZoomingEnabled = {
  false
}
boxSelectionEnabled = {
  false
}
style = {
  {
    width: "1200px",
    height: "1000px"
  }
}
/>
return (
  < div

  {
    pageData
  }
  < /div>
);

预期结果：“ >>

当前结果：“>

[使用dagre创建路径时，整个节点会累积在一个位置。我们如何为节点设置默认位置（无需反应的Cytoscape js可以正常工作），而不是分别设置位置...

Answer 1

有一种在添加节点位置时强制计算节点位置的方法。当图形的元素随组件的状态动态变化并且必须使用更新的节点位置再次绘制图形时，这也很有用。

<CytoscapeComponent
    cy={(cy) => {
      this.cy = cy
      cy.on('add', 'node', _evt => {
      cy.layout(this.state.layout).run()
      cy.fit()
      })   
    }}
/>