Question

我想实现一个函数，该函数将组和矩形作为参数，并检查矩形是否属于组。如果它属于组，我想从组和层中完全删除该矩形。我尝试了group.remove（）和group.getChildren（）[i] .remove但我认为它们并没有完全删除矩形。经过一番努力，我设法做了以下对我来说很愚蠢的事情：

/**
 * Checks if a rectangle belongs in any of the existing groups
 */
function removesFromGroup(group, tempRect) {

    /**
     * I created a bin group and I send the rectangle to this group by using group.moveTo(bin)
     */
    var bin = new Kinetic.Group({
        name: 'bin',
        x: -480,
        y: -50
    });

    for (var j = 0; j < group.getChildren().length; j++) {
        //  var groupCube_x = (groups[i].getChildren()[j]).getAbsolutePosition().x;

        if (group.getChildren()[j] == tempRect) {
            tempRect.moveTo(bin);

            // alert("Move to bin");
            //tempRect.remove();
            //tempRect.getParent().remove(bin);

            //bin.destroy(); 


            layer.draw();
        }
    }
    return false;
}

然而，即使这适用于一个案例，我仍然面临着一个问题，即我不知道如何从图层或舞台中完全删除（删除）矩形或组。

如果不清楚，我可以提供更多有关我正在尝试做什么的信息。

Answer 1

每个动能节点（形状，图层，组等）都有一个名为destroy()的方法，可以删除和销毁自身，另请参见此处：http://kineticjs.com/docs/Kinetic.Node.html。

因此，在您的情况下，您可以调用tempRect.destroy()，矩形将从任何地方删除并自行销毁。当然你需要在其中一个父母身上做draw()，但你已经这样做了。您也可以删除您的bin组，这不再需要了： - ）。

/**
 * Checks if a rectangle belongs in any of the existing groups and 
 * destroys it if so.
 */
function removesFromGroup(group, tempRect) {

    group.getChildren().forEach(function(child){

        if (child == tempRect) {
            tempRect.destroy();
            layer.draw();
        }        
    });

    return false;
}

Answer 2

Javascript还提供了一个很好的方法（.indexOf()），用于检查元素是否是数组的一部分，因此您可以完全跳过循环。然后，在您确认该节点是该组的一部分后，您可以使用.destroy()方法将其销毁。

function removesFromGroup(group, tempRect) {
    if (group.getChildren().indexOf(tempRect) !== -1)
        tempRect.destroy();
        layer.draw();
    });

    return false;
}

如何从组中完全删除矩形？

2 个答案: