kineticjs - 如何从组中完全删除一个矩形？

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;
}