search

kentor / www.kentor.dev

Writing on Web Development
https://www.kentor.dev
6 stars 0 forks source link

Creating diagrams with React, SVG, and CSS-Layout #22

Open thomas9202 opened 5 years ago

thomas9202 commented 5 years ago

Thanks for the write up on this! I really enjoyed piecing together the different parts to reach the wireframe with svgs.

I managed to refactor in a way that allowed for varying numbers of servers to be shown like in your gif demo but I’m utterly stumped on how to approach adding the arrow connectors. Could you offer any guidance on this? I was hopeful that I could write the paths manually but since css-layout provides positions relative to parent it feels like a poor approach as the path needs to map from the top box (labelled rescale) to the bottom one (labelled on-premise).

Thanks again and hope to hear from you :-)