It's not interactive for me:

https://codepen.io/ItIsHappy/pen/vEXrXxg

Yes, I'm being pedantic, but that was the point of my comment. SVGs aren't interactive by default, you need to bring your own interactivity.

For static content, SVGs work great, but for interactive content the additional sematic layer of JSON Canvas has a clear benefit. SVGs represent connections using paths, while JSON Canvas uses a graph. This means SVG cannot connect a single node to more than 2 adjacent nodes. If I want to draw arrows from Alice, Bob, and Charlie all to Dave, then I need to create a second Dave or reference to that location somehow. (You can see this in your sword example by moving one of the edge points. The sword delaminates because only two of the four edges at that point can be connected together.) SVG provides limited tooling for this, but it gets rather complicated rather quickly.