search

tisoap / react-flow-smart-edge

Custom Edge for React Flow that never intersects with other nodes
https://tisoap.github.io/react-flow-smart-edge/
MIT License
242 stars 26 forks source link

Make Edge labels also avoid overlaping with each other #25

Open 0xJem opened 2 years ago

0xJem commented 2 years ago

Two edge labels could overlap. It would be even better if we could configure the labels of different edges to not overlap.

tisoap commented 2 years ago

That's a really neat idea @0xJem ! But I'm afraid it wouldn't be easy to implement. I'm able to do path finding using the nodes because React Flow gives me an useNodes hook that I can use to get all nodes in the graph. There's no equivalent for just labels, since they're part of the edges.

I'll leave this open so I can brainstorm later if there's anything that can be done.

tisoap commented 1 year ago

Opened issue on React Flow: https://github.com/wbkd/react-flow/issues/2522

Edit: Negative response from the React Flow developer to expose an "useLabels" equivalent, will have to think about an alternative solution. Maybe doing inversion of control and letting user set arbitrary areas on the map to avoid will be the solution here.