Модель Солнечной системы

Небольшой деморолик использующий методы спрайтовой анимации и демонстрирующий модель Солнечной системы.

Главный инструмент анимации, это функция requestAnimationFrame. Зациклив вызов функции Obj в requestAnimationFrame можно очищать canvas и рисовать новое положение фигур.

Модель относительно передаёт скорости движения "планет" и их размеры. Для каждой "планеты" задан угол отклонения.

    angle += (Math.PI * 0.047) / 3;
    angleVen += (Math.PI * 0.035) / 3;
    angleEarth += (Math.PI * 0.03) / 3;
    angleMars += (Math.PI * 0.024) / 3;
    angleJup += (Math.PI * 0.013) / 3;
    angleSat += (Math.PI * 0.0097) / 3;
    angleUran += (Math.PI * 0.0068) / 3;
    angleNep += (Math.PI * 0.0054) / 3;

Используя параметрическое уравнение окружности задаётся движение "планет":

    ctx.arc(
      205 + 20 * Math.cos(angle),
      230 + 20 * Math.sin(angle),
      2,
      0,
      Math.PI * 2,
      true
    );
Исходники: