jsPlumb可拖動元素javascript函數

JSFiddle將清楚地讓你明白這個問題。jsPlumb可拖動元素javascript函數

我希望端點綁定到每個容器中可拖動的元素，但只有首先繪製的端點是正確的。第二次調用繪圖函數時，位置不正確，拖動不同步。

我有一個猜測，問題在於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(); 
}

來源

2016-08-23 SachiDangalla

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

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

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

編輯：一擺弄你的榜樣https://jsfiddle.net/mkaran/aof6mq34/

來源

2016-08-23 10:12:45 mkaran

化險爲夷！我是jsPlumb的新手。我還有其他重要的方面嗎？ @mkaran – SachiDangalla

很高興我幫助:)。嗯，我不記得現在需要注意的任何事情，看看[基本設置]（https://jsplumbtoolkit.com/community/doc/home#setup），還可以設置一個窗口調整大小 - > jsPlumb.repaint（）事件，以便jsplumb可以很好地響應窗口更改。最少但不最後，如果你有很多連接器，請利用'jsPlumb.setSuspendDrawing（true）;'。祝你好運！ :) – mkaran

jsPlumb可拖動元素javascript函數

回答

相關問題