Question

编程新手，并且难以理解为什么文字不会出现在我的画布上。

HTML：

    <div id="gameWindow">
        <canvas id="gameCanvas" width="854" height="480"></canvas>
    </div>

JS：

function init() {
    var canvas = document.getElementById("gameCanvas");
    var ctx = canvas.getContext("2d");



    ctx.font = "32px Verdana";
    ctx.fillStyle = '#000';
    ctx.fillText("Hello World", 400, 400);
}

CSS：

#gameCanvas {
    margin: 0 auto;
    background: #ffffff;
    align-self: center;
    color: black;
    text-align: left;
}

对不起，如果这是一个愚蠢的问题。

Answer 1

您需要调用init方法

＆＃13;

function init() {
  var canvas = document.getElementById("gameCanvas");
  var ctx = canvas.getContext("2d");
  ctx.font = "32px Verdana";
  ctx.fillStyle = '#000';
  ctx.fillText("Hello World", 400, 400);
}
init() //Changed here

＆＃13;

#gameCanvas {
  margin: 0 auto;
  background: #ffffff;
  align-self: center;
  color: black;
  text-align: left;
}

＆＃13;

<div id="gameWindow">
  <canvas id="gameCanvas" width="854" height="480"></canvas>
</div>

＆＃13;

JS文本没有出现在HTML5画布上

1 个答案: