javascript - 在单元格上的两篇论文之间拖放 - JointJs

Question

我正在使用此解决方案 ( Joint.js Drag and Drop Element between two papers ) 拖放两篇论文，效果非常好。

我想知道是否存在一种方法可以知道您是否将幽灵(即 flyPaper 图中的单元格)放在主图中的单元格上，如果可能的话，我怎样才能得到这个单元格。

事实上，我想根据单元格在主图中的放置位置执行不同的操作。例如，如果将单元格放在另一个单元格(具有精确类型)上等。

感谢您的帮助。

Answer 1

这称为“重父化”，JointJs 中的以下代码描述了如何进行重父化，但在一篇论文中(不是通过两篇论文)- Reparenting

主要思想是将此单元格嵌入到父单元格中，这是使用以下代码完成的:

$('body').on('mouseup.fly', function(e) {
    var x = e.pageX,
      y = e.pageY,
      target = paper.$el.offset();

    // Dropped over paper ?
    if (x > target.left && x < target.left + paper.$el.width() && y > target.top && y < target.top + paper.$el.height()) {
      var s = flyShape.clone();
      s.position(x - target.left - offset.x, y - target.top - offset.y);
      graph.addCell(s);
      //get the parent cell and embed the dragged cell with it
      if (cellViewsBelow.length) {
        var cellViewBelow;
        for (var i = 0; i < cellViewsBelow.length; i++) {              
          if (cellViewsBelow[i].model.id !== s.id) {
            cellViewBelow = cellViewsBelow[i];
          }
        }
        // Prevent recursive embedding.
        if (cellViewBelow && cellViewBelow.model.get('parent') !== s.id) {
          cellViewBelow.model.embed(s);
        }
      }
    }