Question

如何从组中删除特定对象。我希望对象留在图层上，但在组外。感谢

Answer 1

您可以使用myElement.moveTo(myLayer)取消组合myElement并将其作为独立元素放置在myLayer上。

此取消组合中唯一的小问题是myElement的[x，y]是相对于该组的。从组中删除myElement时，必须通过组[x，y]调整myElement＆＃39; s [x，y]。该代码看起来像这样：

// move myElement out of myGroup an onto myLayer
myElement.moveTo(myLayer);

// adjust myElement's [x,y] by myGroup's [x,y]
myElement.x(myElement.x()+myGroup.x());
myElement.y(myElement.y()+myGroup.y());

// redraw myLayer
myLayer.draw();

示例代码和演示：

＆＃13;

    var stage = new Kinetic.Stage({
        container: 'container',
        width: 350,
        height: 350
    });
    var layer = new Kinetic.Layer();
    stage.add(layer);


    var g=new Kinetic.Group({draggable:true});
    var r=new Kinetic.Rect({x:10,y:10,width:50,height:50,fill:'blue'});
    var c=new Kinetic.Circle({x:50,y:50,radius:15,fill:"red"});
    g.add(r);
    g.add(c);
    layer.add(g);
    layer.draw();

    $('#ungroup').click(function(){
        c.moveTo(layer);
        c.x(c.x()+g.x());
        c.y(c.y()+g.y());
        layer.draw();
    });

＆＃13;

body{padding:20px;}
#container{
  border:solid 1px #ccc;
  margin-top: 10px;
  width:350px;
  height:350px;
}

＆＃13;

<script src="http://d3lp1msu2r81bx.cloudfront.net/kjs/js/lib/kinetic-v5.1.0.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

<button id=ungroup>Move red circle out of group into layer</button>

<h4>BlueRect and RedCircle are in a draggable group.<br>Test:<br>Drag the group,<br>Click the 'Move red circle...' button,<br>Drag the group again<br>RedCircle is un-grouped</h4>

<div id="container"></div>

＆＃13;

kineticjs如何从组中删除对象

1 个答案: