jsPlumb可拖动元素javascript函数

Question

JSFiddle将清楚地让你明白这个问题。

我希望端点绑定到每个容器中可拖动的元素，但只有首先绘制的端点是正确的。第二次调用绘图函数时，位置不正确，拖动不同步。

我有一个猜测，问题在于CSS位置，但我找不到它。

jsPlumb.ready(function() { 
    $(".scroll-box").draggable({ 
    drag: function() { 
     jsPlumb.repaintEverything(); 
     //jsPlumb.repaint($(this)); 

    } 
    }); 
    //   jsPlumb.draggable($(".scroll-box")); 


    drawEndPoints("in-leaf", "Right"); 
    drawEndPoints("out-leaf", "Left"); 



}); 

function drawEndPoints(classname, endpointposition) { 

    var endpointOptions = { 
    isSource: true, 
    isTarget: true, 
    endpoint: ["Dot", { 
     radius: 10 
    }], 
    style: { 
     fillStyle: 'blue' 

    }, 
    maxConnections: -1, 
    connector: "Straight", 
    connectorStyle: { 
     lineWidth: 2, 
     strokeStyle: 'black' 
    }, 
    scope: "blackline", 
    dropOptions: { 
     drop: function(e, ui) { 
     alert('drop!'); 
     } 
    } 
    }; 

    jsPlumb.addEndpoint($("." + classname), { 
    anchor: endpointposition 
    }, endpointOptions); 
    //jsPlumb.repaintEverything(); 
} 

Answer 1

你缺少jsPlumb.setContainer($("body"));

https://jsfiddle.net/mkaran/mLthybzo/

https://jsplumbtoolkit.com/community/doc/home

编辑：一摆弄你的榜样https://jsfiddle.net/mkaran/aof6mq34/