Question

我不知道我的代码有什么问题。我是javascript的新手。有时createjs会起作用，有时候它不会起作用。它没有意义，因为我正在从其他人的教程中复制确切的代码。

<!DOCTYPE html>

<html>
<head>
    <title></title>
    <script src = "http://code.createjs.com/createjs-2013.12.12.min.js"></script>

    <script>
        var stage;

        function init(){
            stage = new createjs.Stage("myCanvas");

            var ball = new createjs.Shape();
            ball.graphics.beginFill("000000").drawCircle(0,0,50);
            ball.x = 50;
            ball.y = 200;

            stage.addChild(ball);
        }
    </script>
</head>

<body onload = "init()">
    <canvas id = "myCanvas" width = "500" height = "500">
    </canvas>
</body>
</html>

Answer 1

即使您已经解决了问题，我也会稍微改进您的代码。您不需要将此标记为正确的答案，因为您自己解决了这个问题。

<html>
<head>
    <title>Example</title>
    <script src="http://code.createjs.com/createjs-2013.12.12.min.js"></script>

    <script>
        var stage;

        function init(){
            stage = new createjs.Stage("myCanvas");

            var ball = new createjs.Shape();
            ball.graphics.beginFill("000000").drawCircle(0,0,50);
            ball.x = 50;
            ball.y = 200;
            ball.cache(-50, -50, 100, 100); // -50 is -radius, 100 is radius*2

            stage.addChild(ball);
            stage.update();
        }
    </script>
</head>

<body onload="init()">
    <canvas id="myCanvas" width="500" height="500">Do you even HTML5?</canvas>
</body>
</html>

首先，我已经为您的文档添加了一个标题，该标题必须是有效的HTML5。您可以将其更改为您想要的任何内容。
另外，我缓存了你的球对象，所以现在它是一个图像而不是一个形状，每次更新阶段时CPU都不需要重绘它。这是一个很大的性能提升。
最后，如果不支持HTML5画布，我还添加了一个后备文本（＆＃34;你甚至是HTML5？＆＃34;）。它位于<canvas>和</canvas>标记之间，您可以将其更改为您喜欢的任何内容。

Answer 2

我看不到你在舞台上实际调用update()以使其画画的地方。事实上，最令人费解的是为什么你说这个代码甚至有时会起作用。它根本不应该在屏幕上显示任何内容。

编辑：我看到你发表评论，你说你想出来了。没关系。

CreateJS无法加载

2 个答案: