react-d3-graph set starting positions for nodes

Viewed 1224
1 Answers

I couldn't find it in the documentation, but you can just add an x and y property to a node to give it an initial position. (Works whether you set the prop staticGraph or not.)

The following will place node 'a' above node 'b' every time, instead of placing them randomly.

<Graph
  id="test-graph"
  data={{
    nodes: [
      { id: 'a', x: 0, y: 0 },
      { id: 'b', x: 0, y: 1 },
    ],
    links: [{ source: 'a', target: 'b' }],
  }}
/>

It's also possible to have coordinates on only some nodes. Then the ones without coordinates will be placed randomly.

Related