Shapes

This example shows how to implement a custom node that can render different shapes like a circle, diamond or hexagon that are commonly used in flow charts. The shape node can be configured with these options which are added to the node data object:

• width: number
• height: number
• color: string - the background color of the node
• shape: string - the shape that the node should render (circle, round-rect, hexagon, diamond, arrow-rect, database, triangle, parallelogram)

Dependencies: reactflow (opens in a new tab)