KineticJS：将克隆的项目分组以拖动它们

如何将克隆的形状和图像分组，以便将它们拖到一起？我把克隆的图像放在克隆的矩形上。每次拖动矩形时是否必须创建新的

Kinetic.Group

？有没有其他方法可以让它们拖动而不分组

---

我正在使用kineticJS执行从一层到另一层的任意多个克隆项目的拖放操作，这是我编写的代码，直到现在我都不知道该怎么做。

Kinetic.Groups是拖动一组形状/图像的最佳方法

演示：

当您拖放其中一个克隆项目时，您可以使用

clone.on（“dragend”

）将克隆项目加入到拖放到的任何一个组（矩形）中

假设所有矩形容器都已添加到containers[]数组中

然后，您可以使用此

dragend

功能将克隆

moveTo

放入任何容器中：

clone.on("dragend",function(){
    var pos=this.getAbsolutePosition();
    var x=pos.x;
    var y=pos.y;
    var hit=-1;
    for(var i=0;i<containers.length;i++){
        var c=containers[i];
        var cx=c.x();
        var cy=c.y();
        if(x>=cx && x<=cx+c.width() && y>=cy && y<=cy+c.height()){
            hit=i;
        }
    }
    if(hit>=0){
        var container=containers[hit];
        this.x(x-container.x());
        this.y(y-container.y());
        this.moveTo(container);
    }else{
        this.x(x);
        this.y(y);
        this.moveTo(layer);
    }
});

clone.on（“dragend”，function（））{
var pos=this.getAbsolutePosition（）；
var x=位置x；
变量y=位置y；
var-hit=-1；
对于（变量i=0；i=cx&&x=cy&&y=0）{
var container=containers[hit]；
this.x（x-container.x（））；
this.y（y-container.y（））；
这个。移动到（容器）；
}否则{
这是.x（x）；
这是y（y）；
这个。移动到（层）；
}
});

当我克隆一个矩形并将其拖放到容器中时，是否可以将其设置为一个组，以便在图像被拖放时加入它？当然可以。如果您有一个包含矩形的原始组（如上面的代码所示），则可以克隆该组，并且您的矩形也将被克隆：layer.add（group.clone（{x:newX，y:newY}））；layer.draw（）；