jQuery, связь блоков линиями

jsPlumb.ready(function() {
      
   var a = $("#a");
   var b = $("#b");
   
   var stateMachineConnector = {
      connector:"StateMachine",
      paintStyle:{lineWidth:2,strokeStyle:"#8890a2"},
      hoverPaintStyle:{strokeStyle:"#8890a2"},
      endpoint:"Blank",
      anchor:"Continuous",
      overlays:[ ["PlainArrow", {location:1, width:10, length:10} ]]
   };
 
     // связь от #a к #b
   jsPlumb.connect({
      source:"a",
      target:"b",
      anchors:["Center", "Center"]
   }, stateMachineConnector); 
 
   jsPlumb.draggable($(".draggable")); // при необходимости сделать элементы перетаскивающимися

});
 

 <div style="position: relative">
 
   <div id="a" class="a draggable" style="top:50px; left:50px; width:100px; height: 100px;position: absolute;">
      #a
   </div>

   <div id="b" class="b draggable" style="top:50px; left:250px; width:100px; height: 100px;position: absolute;">   
      #b
    </div>
 
</div>