ランダムな円

大昔，Javaという言語（JavaScriptではありません）が現れたとき，最初に作ったApplet（Webブラウザ上で動作するJavaのプログラム）が上のようなランダムな円でした。当時のパソコンは遅いので，パラパラパラと円がアニメーションのように現れました。この懐かしい例題も，今ではJavaScriptで簡単に作ることができます。今のパソコンは速いので，瞬間に描き終わってしまいます。

function draw() {
  const canvas = document.getElementById('MyCanvas');
  const context = canvas.getContext('2d');
  for (let i = 0; i < 100; i++) {
    const x = 300 * Math.random();
    const y = 200 * Math.random();
    const r = 40 * Math.random() + 10;
    const c1 = Math.floor(256 * Math.random());
    const c2 = Math.floor(256 * Math.random());
    const c3 = Math.floor(256 * Math.random());
    context.beginPath();
    context.arc(x, y, r, 0, 2 * Math.PI);
    context.fillStyle = "rgb(" + c1 + "," + c2 + "," + c3 + ")"
    context.fill();
  }
}

詳しくはこのページのソースをご覧ください。