title: Create a visual mapping between two elements in Angular2+
body: <p>I am trying to implement "visual mapping" in Angular 2+. I've tried two popular libraries so far: <code>dragula</code> and material's <code>drag-and-drop</code>, 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:</p>
  
  <p><img src="https://i.stack.imgur.com/fJONy.png" alt="this mapping">.</p>
  
  <p>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).</p>
  
  <p>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?</p>