有沒有辦法將節點拖入或拖出Cytoscape js中的其他節點？

我正在尋找一種方法來將node/s拖出其複合節點並將其放到另一個節點（然後將其新的父節點）。有沒有辦法將節點拖入或拖出Cytoscape js中的其他節點？

該示例顯示覆合節點中的一些捕獲節點。但是我沒有辦法通過dnd「釋放」他們。

http://jsbin.com/gist/5b192c88616af2f75344?output

我還缺少一些HTML5的事件，如的dragover，帶出這樣的事情。有沒有辦法得到它？

我試圖使用給定的cytoscape js事件來「移動」某些節點，但沒有良好的用戶體驗。

2016-08-30 J.W.

Cytoscape.js允許您通過發出自定義事件來構建自己的手勢。在drag和ele.boundingBox()之上創建自己的dragover等事件非常簡單。如果你喜歡，你可以將你的手勢和自定義事件組織成一個autoscaffolded extension以獲得更多的可重用性。如果您確實需要擴展，請考慮將其提交至the list，以便其他開發人員可以從中受益併爲其作出貢獻。

核心庫必須保持高性能，這將排除昂貴的dragover檢查。否則，其他開發者的核心用例會受到負面影響。

您的自定義手勢可以做出某些假設 - 核心庫無法 - 讓事情更快。例如，如果您只關心dragover等事件的複合父節點，那麼您只能爲父母執行包圍盒檢查。

來源

2016-08-30 17:50:02 maxkfranz

感謝您的回答，但即時尋找一個具體的答案如何解決我的問題。當我將元素e1拖到另一個元素e2上時，e2不會拋出dragover事件。我期待一個例子來構建這樣的東西：[link]（https://gojs.net/latest/samples/regrouping.html） –

基於maxkfranz的回答，這種方法將允許通過拖入父節點來添加父節點。綁定tapend事件（觸發釋放時）到孤兒節點（沒有父母）在其中檢測，如果鼠標光標處於父節點的邊界框。

//dragging orphan nodes into parents 
cy.on('tapend', ':orphan', function(event){ 
    var node = event.cyTarget; 
    var mouse = event.cyRenderedPosition; 

    cy.$(':parent').each(function(i, ele){ 
     //ensure we dont drag into self 
     if (ele !== node){ 
      //check if we dragged into a compound node 
      var pos = ele.renderedBoundingBox(); 
      if (mouse.x > pos.x1 && mouse.x < pos.x2){ 
       if (mouse.y > pos.y1 && mouse.y < pos.y2){ 
        console.log("Move ", node.id(), " into ", ele.id()); 
        node.move({ 
         parent: ele.id() 
        }); 
       } 
      } 
     } 
    }); 
});

您可能需要使用foreach循環替代，打破node.move（後環），只需在重疊的節點和輕微的性能增加的情況下。

來源

2016-10-10 08:26:42

有沒有辦法將節點拖入或拖出Cytoscape js中的其他節點？

回答

相關問題