Questions tagged [react-flow]
90 questions
1
vote
0 answers
Show a tooltip on React flow edge label
I want to show a Tooltip whenever I hover over an Edge Label in React flow.
What I want is whenever we hover over any of the labels a tooltip comes up. Can anyone tell how I can achieve this?

kaushalendra pandey
- 99
- 7
0
votes
1 answer
React-Flow, Edges changing place or dissapearing on creating a new Node with a button
Edges change their place, when i create a new node.
Gif example
Gif showing the problem
Possible cause that I can't fix
1. ReactFlowKey is updating the website without previously saving edges as they were created, because
"Couldn't create edge for…

Paweł Owczarek
- 11
- 2
0
votes
0 answers
React flow custom edge behaving weirdly after a certain point
We created a custom edge in react flow where the arrow needs to be a block edge
We used 2 smooth edge step by calling getSmoothStepPath twice, the edge was drawn properly, till we started to move the node around. Once react-flow starts to bend the…

Raman Iyer
- 1
- 1
0
votes
0 answers
React flow graph ranks
I am using react-flow with dagrejs for the layout,
and facing a challenge I'm stuck with.
Each node in my graph has in it's 'data' object a key of 'datetime'(timestamp).
I need to add to the layout logic, that nodes will also be positioned…

nadiTime
- 151
- 1
- 9
0
votes
0 answers
How to prevent edge and node intersection in react-flow?
I need an edge type that does not intersect with a node. I use the source node and target node handles vertically as a business rule. When I connect one node's bottom handle that is below the other node to another node up handle, the edge intersects…
0
votes
1 answer
how to use an image in place of simple Node in reactFlow
I'm using 'reactflow' library in my react project
I'm trying to find a way to use an image in place of node so i can drag and move the image i want and also connect two images via edges
I have gone through the docs of reactflow but didn't find a…

Burhan Ali
- 49
- 5
0
votes
0 answers
In React Flow how to Make Paths lines that connects nodes moveable just like draw.io diagrams
In React Flow diagrams how to Make Paths lines moveable and selectable that connects nodes just like draw.io diagrams where we can change position of path lines and they are selectable and moveable below is my code of Path line. Any guidance…

Rizwan Saleem
- 56
- 5
0
votes
2 answers
Styled Components not being recognized in React
I have the following Styled component (not posting complete, doesn't make any difference):
It extends Handle (and HandleProps) from 'reactflow' library
interface CustomHandleProps extends HandleProps {
istarget?: boolean;
zoomedout?: boolean;
…

Alvaro Silva
- 23
- 7
0
votes
0 answers
Creating a BPMN diagram using ReactFlow in ReactJS
I'm working on a ReactJS application and I would like to create a BPMN diagram using ReactFlow. However, I'm unsure if ReactFlow supports the full set of BPMN elements and properties required for creating BPMN diagrams. Can I use ReactFlow to create…

Sneka
- 13
- 4
0
votes
1 answer
Reactflow lock graph
Is it possible to make reactflow graph locked ? something like isLocked=true
I would like to get the easiest way to implement this. Just wanna get graph with 'view only' mode, for representing ready graphs from database.

Nadyrbek Sultanov
- 113
- 8
0
votes
1 answer
Can I use ReactFlow directly in .html file?
I am using ReactFlow in a component of my react app and the same I want to show in a pdf report(when generating from UI) as well . For a pdf I am creating a .html file on my machine locally by setting up static data and sending to BE and then they…
0
votes
0 answers
Reactflow - Adding nodes by drag and drop in Custom Edges button
Please help me with my issue. I'm currently making an open-source project using Reactflow. But I got some error.
I want to Add my drag and drop node on my "+" Edge Button. The elements are dropped on (+) it should have the same effect as the menu…

Sayedul Karim
- 117
- 6
0
votes
0 answers
How to override third party style classes in Next.js using React Flow?
Unable to override third party style classes in NextJS.
I am using react flow library and trying to update the classes using index.css but css is not getting load in browser.
I should be able to override the classes, trying to integrate react flow…

Abhas
- 1
- 1
0
votes
0 answers
React Flow Fix Node Connection in Multiple Edges
i wanna delete a node below the node i clicked where the scenario will be like the node will have two handle in the bottom of true and false where the true has separate nodes below it and the false also the same. if i click the node and say true…

Monk
- 3
- 3
0
votes
0 answers
react-three-fiber shader uv wrong when inside component
I'm trying to modify an example from react-flow-renderer (React Flow Audio) to render a shader inside each node. For that, I have a test shader that outputs the UVs, but it doesn't look right when inside a node, because not all the spectrum of…

Daniel Zufrí Quesada
- 35
- 4