{ ctx = document.getElementById("canvas1").getContext("2d"); Canvashi document.getElementById("canvas1").width; Canvassh exec(); document.getElementById("canvas1").height; 関数実行() { arcx += x; アーシー += y; // canvas をクリアする ctx.clearRect(0, 0, キャンバス, キャンバス); // 円を描画する ctx.beginPath(); ctx.fillStyle = カラー [現在の色]; etx.are(arex, arey, radius, 8, Math.PI 2, false); ctx.fill(); } } if (arex <= radinus || arcx > canvasW,canvasH) { // 円の進行方向(x)を変更する // 円の色を変更する 現在のカラー++; if (currentColor > color.length) { currentColor = 0; } if (arcx <= radinus|| arcx > canvasW-radius) { // 円の進行方向(y)を変更する y = -y: // 円の色を変更する 現在のカラー++; if (currentColor >= Colors.length) { currentColor = 0; } setTimeout(exec, 10);