I’m working on a diagram editor built with Drawflow, and I’m experimenting with Dagre to automatically arrange the graph.

I'm successfully computing new positions for the nodes using Dagre, but when I update Drawflow's node positions (node.pos_x = pos.x; node.pos_y = pos.y;), the changes are not reflected on screen.

I've searched through Drawflow's documentation and source code, but I can't find a way to force an update to the display so that the nodes visually move to their new positions, while keeping their connections.

Here’s my current function:

function applyDagreLayout(drawflow) {
  const nodes = drawflow.drawflow.drawflow.Home.data;
  const graph = new dagre.graphlib.Graph();
  graph.setGraph({ rankdir: 'LR', nodesep: 50, edgesep: 20, ranksep: 80 });

  // Add nodes to Dagre
  for (let key in nodes) {
    graph.setNode(key, { width: 100, height: 100 });
  }

  // Add edges to Dagre
  for (let key in nodes) {
    const node = nodes[key];
    if (node.inputs) {
      for (let input in node.inputs) {
        const sourceNode = input.node;
        if (sourceNode) {
          graph.setEdge(sourceNode, key);
        }
      }
    }
  }

  // Compute new layout
  dagre.layout(graph);

  // Update node positions in Drawflow
  for (let key in nodes) {
    const node = nodes[key];
    const pos = graph.node(key);

    node.pos_x = pos.x;
    node.pos_y = pos.y;

    console.log(`Updated node ${key} position to:`, node.pos_x, node.pos_y);
    
    // Attempted fixes (None of these work so far)
    // drawflow.moveNode(key, pos.x, pos.y); // Is what I'd like to do ideally, but it doesn't exist
    // drawflow.removeNodeId(key);
    // const newNode = drawflow.addNode({ ...node }); // Deleting the node and creating a new one with the same data might work, but then I'll have to create its connections again, and it can introduce other problems as well since the node's id will technically not be the same, I'd rather avoid this and do it the 'proper' way, if such a thing exists in this library
  }

  // Tried reloading the editor, but this caused there to be duplicate nodes (the new nodes didn't have any connections)
  // drawflow.load();
}

What I've Tried:

• Directly modifying node.pos_x and `node.pos_y.
• Searching for a function like moveNode(), update(), or refresh() in Drawflow.
• Removing and re-adding nodes using removeNodeId() and addNode().
• Calling drawflow.render() to force a redraw.

Question:

How can I update the Drawflow canvas to reflect the new node positions after applying the Dagre layout?