Каждый элемент сцены рисуется отдельной функцией:
Функция drawSun(x, y, radius) рисует солнце с лучами. Основной круг заполняется золотистым цветом (#FFD700) через метод arc(). Лучи создаются в цикле: для каждого из 12 лучей вычисляются начальные координаты на окружности солнца и конечные координаты на расстоянии 30 пикселей от нее. Лучи рисуются оранжевыми линиями (#FF8C00) толщиной 3 пикселя.
Функция drawCloud(x, y) создает облако из четырех перекрывающихся белых кругов разных размеров и позиций, что формирует пушистый вид. Затем рисуется тень облака — аналогичная композиция из кругов, но смещенная на 5 пикселей вправо-вниз и заполненная полупрозрачным черным цветом (rgba(0,0,0,0.1)), что создает эффект объема.
Функция drawCloud2(x, y) рисует второе облако по аналогичному принципу, но с пятью кругами для более сложной формы и с меньшей прозрачностью тени (0.08), что дает визуальное разнообразие.
Функция drawCar(x, y) рисует упрощенный автомобиль. Кузов состоит из двух красных прямоугольников: основного (100x30) и верхней части (50x15). Окно — голубой прямоугольник (40x10). Фара — желтый круг радиусом 5 пикселей. Колеса — два черных круга радиусом 10 пикселей по бокам кузова.
Функция updateAnimation() является ядром анимации. При каждом вызове:
Увеличивается счетчик кадров frameCount.
Первое облако движется влево на 1.5 пикселя за кадр; при выходе за левую границу холста оно возвращается справа с новой случайной высотой.
Второе облако движется вправо на 1.2 пикселя за кадр; при выходе за правую границу возвращается слева.
Автомобиль движется вправо на 3 пикселя за кадр; при полном пересечении холста появляется слева.
Вызывается drawScene() для отрисовки обновленной сцены.
Если анимация активна (isAnimating = true), планируется следующий кадр через requestAnimationFrame().