有没有办法将节点拖入或拖出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中的其他节点？

回答

相关问题