#How to get measured width/height on server?

1 messages · Page 1 of 1 (latest)

sand ravine
#

Hello, In my react app previously I had all rendered on client side. Initially default code with dagre was not properly positioning nodes that are bigger than default width/height, so I applied solution from here: https://github.com/xyflow/xyflow/issues/991#issuecomment-808862965

Now I want to move all of this logic to server. And I'm hittint the same issue of wrong positioning again. I'm not rendering reactFlow component itself on server, but I'm pre-rendering the nodes for it. How do I prerender nodes on server side so that each node gets correct measured.width and measured.height? And if there's no way to do that, what are my other options on server side?

General goal is to provide the correct nodes positions to client-side right away, without double step of first calculating incorrectly and then adjusting on client side.

sand hemlock
#

You will have to pass the width and height for the nodes manually like this. The measure.width etc happens automatically on the client using DOM's API but that can't happen on the server. You can make an estimate of what the height/width of the node would be on the server based on its inner content/data.

React Flow

Step-by-step guide render React Flow apps on the server for displaying static flows, dynamically generating images from flows, or rendering graphs in non-javascript environments