@SpaceBox777

Как рандомизировать анимацию падающих символов?

Имеется код приведенный ниже, необходимо, чтобы анимация падения символов запускалась при запуске страницы в случайном порядке, а не волной, а потом уже в случайном. Как это исправить?

<body onload="setup();">
    <canvas id="cvs" height="1081" width="2133"></canvas>
</body>

var canvas, ctx;
var columns, font_size = 10;
var drops = [];
function setup() {
    canvas = document.getElementById("cvs");
    ctx = canvas.getContext("2d");
    canvas.height = window.innerHeight;
    canvas.width = window.innerWidth;

    ctx.font = font_size + "px arial";
    columns = canvas.width / font_size;
    //alert(columns);
    for (var x = 0; x < columns; x++)
        drops[x] = 1;
    setInterval(draw, 35);
}

function draw() {
    ctx.fillStyle = "rgba(24, 24, 24, 0.1)";
    ctx.fillRect(0, 0, canvas.width, canvas.height);
    ctx.fillStyle = "#00FF00";
    for (var i = 0; i < drops.length; i++) {
        ctx.fillText(String.fromCharCode(Math.floor(2720 + Math.random() * 32)), i * font_size, drops[i] * font_size);
        if (drops[i] * font_size > canvas.height && Math.random() > 0.975)
            drops[i] = 0;
        drops[i]++;
    }
}
  • Вопрос задан
  • 110 просмотров
Решения вопроса 1
0xD34F
@0xD34F
Пусть дефолтными номерами строк, на которых надо рисовать символы, будут не единицы, а случайные отрицательные значения. Т.е., drops[x] = 1; замените на, например

drops[x] = -Math.random() * canvas.height / font_size | 0;
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы