javascript - 为什么我不能在画布中绘制图片？

Question

我试图在画布上放一张图片，但它没有出现。我已经用谷歌搜索了它以找出问题所在，不幸的是我仍然无法解决它。

这是我的代码：

window.onload = function() {
  var cnvs = document.getElementById("gc");
  var ctx = cnvs.getContext("2d");
  var img = new Image();
  img.src = "/img/road.jpg";
  ctx.drawImage(img, 0, 0);
};

* {
  box-sizing: border-box;
  padding: 0;
  margin: 0;
}

.game-border {
  display: flex;
  justify-content: center;
  justify-items: center;
}

#gc {
  width: 100vmin;
  height: 100vmin;
  background-color: coral;
}

<div class="game-border">
  <canvas id="gc"></canvas>
</div>

标签： javascripthtml

Answer 1