How to draw such svg in react and not only?

Question

JavaScript

There are sections that need to be visually connected with dotted lines, and there are two types of lines:

The first kind of dotted line from section to section

Second view

The indents are always different, the line must be drawn dynamically.

Are there libraries for this?

Answer 1

Using an entire library for one line is certainly powerful : )
Use Rete.js if you don't want to bother with one line.
But there is really nothing complicated. You just need to draw the necessary line on the canvas, overlay it on top of your elements and set it to . That's all. pointer-events: none