画布没有上色

Question

I am following a tutorial to fill a canvas with color.我正在学习用颜色填充画布的教程。 No coloring is happening.没有着色发生。 Could this be because the function update() and function draw() is empty?这可能是因为函数 update() 和函数 draw() 为空吗？

<!DOCTYPE html>
<html>
    <head>
        <title>Basic Example</title>
        <script src="BasicExample.js">  
        </script>
    </head>
    <body>
        <div id="gameArea">
            <canvas id="myCanvas" width="800" height="480"></canvas>
        </div>
    </body>
</html>

The javascript file javascript 文件

var canvas = undefined;
var canvasContext = undefined;

function start () {
    canvas = document.getElementById("myCanvas");
    canvasContext = canvas.getContext("2d");
    gameLoop();
}

document.addEventListener('DOMContentLoaded', start);

fuction update() {
}

function draw() {
}

function gameLoop () {
    canvasContext.fillStyle = "blue";
    canvasContext.fillRect(0, 0, canvas.width, canvas.height);
    update();
    draw();
    window.setTimeout(gameLoop, 100 / 60);
}

Answer 1

Your fuction update should be function update ->typo on the word "function"您的功能更新应该是功能更新->“功能”一词上的错字

See the corrected html/script below:请参阅以下更正后的 html/脚本：

<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
</head>

<body>
<div id="gameArea">
    <canvas id="myCanvas" width="800" height="480"></canvas>
</div>
<script>
var canvas = undefined;
var canvasContext = undefined;

function start () {
    canvas = document.getElementById("myCanvas");
    canvasContext = canvas.getContext("2d");
    gameLoop();
}

document.addEventListener('DOMContentLoaded', start);

function update() {
}

function draw() {
}

function gameLoop () {
    canvasContext.fillStyle = "blue";
    canvasContext.fillRect(0, 0, canvas.width, canvas.height);
    update();
    draw();
    window.setTimeout(gameLoop, 100 / 60);
}   
</script>
</body>
</html>

画布没有上色

问题描述

1 个解决方案

解决方案1
0 2017-10-13 04:09:43

画布没有上色

问题描述

1 个解决方案

解决方案1 0 2017-10-13 04:09:43

解决方案1
0 2017-10-13 04:09:43