将图层添加到另一个图层

时间:2012-08-15 19:50:59

标签: javascript html5 canvas html5-canvas kineticjs

我有以下代码,我试图将一些Kineticjs图层添加到另一个图层,但是当我什么都不做的时候会显示出来。我有其他形状添加到画布,显示很好,如果我分开添加所有图层,然后它们出现。这是一个错误还是我做错了什么?

this.canvas = new Kinetic.Stage({ "container": jQuery( "#testElement" ).get(0),
    "width": ShooterGame.WIDTH, "height": ShooterGame.HEIGHT });

this.container = new Kinetic.Layer();
this.layer1 = new Kinetic.Layer();
this.layer2 = new Kinetic.Layer();
this.layer3 = new Kinetic.Layer();

this.layer1Bg = new Kinetic.Rect({ "width": 100, "height": 100, "fill": "#FF0000" });
this.layer2Bg = new Kinetic.Rect({ "width": 100, "height": 100, "fill": "#FF0000" });
this.layer3Bg = new Kinetic.Rect({ "width": 100, "height": 100, "fill": "#FF0000" });

this.layer1.add( this.layer1Bg );
this.layer2.add( this.layer2Bg );
this.layer3.add( this.layer3Bg );

this.container.add( this.layer1 );
this.container.add( this.layer2 );
this.container.add( this.layer3 );
this.canvas.add( this.container );

this.container.draw();

1 个答案:

答案 0 :(得分:2)

您可以将图层添加到组(Kinetic.Group),然后将该组添加到舞台。

相关问题