JavaScript 画布上随机大小的矩形

Randomly sized rectangles on JavaScript canvas

本文关键字:随机 JavaScript      更新时间:2023-09-26

我正在尝试在画布上绘制随机大小的矩形。这是我拥有的代码,但当我运行它时它没有显示任何内容。

我认为画布的大小已关闭,矩形已从屏幕上绘制。

window.addEventListener('load', drawLine);
function drawLine() {
  var canvas = document.getElementById('myCanvas');
  var context = canvas.getContext('2d'); 
    context.beginPath();
    context.lineWidth = "100";
    context.strokeStyle = 'black';
    context.rect(10, 10, Math.floor((Math.random() * 100)), Math.floor(Math.random() * 100));
    context.stroke();
  }
canvas {
  height: 400px;
  width: 400px;
  border: thin solid black;
}
<canvas id="myCanvas"></canvas>

我认为问题可能是您的矩形的原点是 910, 400。因此,您的矩形可能正在绘制,但刚好偏离画布的可见边界。