Create a visual mapping between two elements in Angular2+

242 Views Asked by At

I am trying to implement "visual mapping" in Angular 2+. I've tried two popular libraries so far: dragula and material's drag-and-drop, but neither of them support my intended functionality. I would like to create and show mapping between nodes in a source tree and nodes in a target tree. My goal is to create something similar to this mapping:

this mapping.

The mapping represented by a line is created by dragging a node from the left tree and dropping it in the right tree, either on top of an existing node (linking the two) or in between two existing nodes into "empty" space (creating a new linked node in the right tree in that location).

The sense I got that this kind of visual mapping goes beyond what either of those libraries support. What's the best way of implementing this functionality in Angular 2+? Is there a library I could use or do I need to implement it myself with svg?

0

There are 0 best solutions below