Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/html/84.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 容器中的形状不会显示在舞台上_Javascript_Html_Containers_Shapes_Easeljs - Fatal编程技术网

Javascript 容器中的形状不会显示在舞台上

Javascript 容器中的形状不会显示在舞台上,javascript,html,containers,shapes,easeljs,Javascript,Html,Containers,Shapes,Easeljs,在这段代码中,我尝试在舞台上放置一个大容器。这个大容器有另外两个容器,每个容器包含一个形状。 我想看看舞台上的造型,但我做不到。 编译器不会抛出错误 以下是我编写的代码: // CREATE STAGE // var stage = new createjs.Stage("myCanvas"); // CREATE TIME_CONTAINER // var time_container = new createjs.Container(); time_container.x = stage.

在这段代码中,我尝试在舞台上放置一个大容器。这个大容器有另外两个容器,每个容器包含一个形状。 我想看看舞台上的造型,但我做不到。 编译器不会抛出错误

以下是我编写的代码:

// CREATE STAGE //
var stage = new createjs.Stage("myCanvas");

// CREATE TIME_CONTAINER //
var time_container = new createjs.Container();
time_container.x = stage.x;
time_container.y = stage.y;
time_container.width =  stage.width;
time_container.height = stage.height;

// CREATE DEV CONTAINER //
var dev_container = new createjs.Container();
dev_container.x = time_container.x;
dev_container.y = time_container.y;
dev_container.width = time_container.width / 2;
dev_container.height = time_container.height;
var dev_shape = new createjs.Shape();
dev_shape.graphics.beginFill("#ff0000").drawRect(dev_container.x,dev_container.y,dev_container.width,dev_container.height);




 // CREATE PLAYER CONTAINER //
 var player_container = new createjs.Container();
 player_container.x = time_container.width / 2;
 player_container.y = time_container.y;
 player_container.width = time_container.width / 2;
 player_container.height = time_container.height;
 var player_shape = new createjs.Shape();
 player_shape.graphics.beginFill("#ff0000").drawRect(player_container.x,player_container.y,player_container.width,player_container.height);



// ADD TIME_CONTAINER TO THE STAGE //
stage.addChild(time_container);
time_container.addChild(dev_container,player_container);
dev_container.addChild(dev_shape);
player_container.addChild(player_shape);
stage.update();

我设法在舞台上得到了两种形状。形状属性(x、y、宽度、高度)不正确。我从第一个形状中获取了形状属性,现在它可以正常工作了。 代码如下:

// CREATE STAGE //
var stage = new createjs.Stage("myCanvas");

// CREATE TIME_CONTAINER //
var time_container = new createjs.Container();
time_container.x = stage.x;
time_container.y = stage.y;
time_container.width =stage.canvas.width;
time_container.height =stage.canvas.width;

// CREATE DEV CONTAINER //
var dev_container = new createjs.Container();
dev_container.x = time_container.x;
dev_container.y = time_container.y;
dev_container.width = time_container.width / 2;
dev_container.height = time_container.height;
var dev_shape = new createjs.Shape();
dev_shape.graphics.beginFill("#00b35a").drawRect(dev_container.x,dev_container.y,dev_container.width,dev_container.height);


// CREATE PLAYER CONTAINER //
var player_container = new createjs.Container();
player_container.x = time_container.width / 2;
player_container.y = time_container.y;
player_container.width = time_container.width / 2;
player_container.height = time_container.height;
var player_shape = new createjs.Shape();
player_shape.graphics.beginFill("#ff0000").drawRect(dev_container.x,dev_container.y,dev_container.width,dev_container.height);



// ADD TIME_CONTAINER TO THE STAGE //
dev_container.addChild(dev_shape);
player_container.addChild(player_shape);
time_container.addChild(dev_container);
time_container.addChild(player_container);
stage.addChild(time_container);
stage.update();

这是到舞台的链接。宽度和高度未定义@ProllyGeek我有这样的画布如果我从画布创建allready有宽度和高度,我还需要定义舞台的宽度和高度吗?不,你刚刚错过了stage.canvas.width;和stage.canvas.height,你的回答对我很有帮助,但我仍然不能在舞台上展示第二个容器。你知道这不管用吗?它就在那里,只是换了颜色我准备好了。第二个没有添加到stage控制台说dev和player容器都没有定义!奇怪的
// CREATE STAGE //
var stage = new createjs.Stage("myCanvas");

// CREATE TIME_CONTAINER //
var time_container = new createjs.Container();
time_container.x = stage.x;
time_container.y = stage.y;
time_container.width =stage.canvas.width;
time_container.height =stage.canvas.width;

// CREATE DEV CONTAINER //
var dev_container = new createjs.Container();
dev_container.x = time_container.x;
dev_container.y = time_container.y;
dev_container.width = time_container.width / 2;
dev_container.height = time_container.height;
var dev_shape = new createjs.Shape();
dev_shape.graphics.beginFill("#00b35a").drawRect(dev_container.x,dev_container.y,dev_container.width,dev_container.height);


// CREATE PLAYER CONTAINER //
var player_container = new createjs.Container();
player_container.x = time_container.width / 2;
player_container.y = time_container.y;
player_container.width = time_container.width / 2;
player_container.height = time_container.height;
var player_shape = new createjs.Shape();
player_shape.graphics.beginFill("#ff0000").drawRect(dev_container.x,dev_container.y,dev_container.width,dev_container.height);



// ADD TIME_CONTAINER TO THE STAGE //
dev_container.addChild(dev_shape);
player_container.addChild(player_shape);
time_container.addChild(dev_container);
time_container.addChild(player_container);
stage.addChild(time_container);
stage.update();