Real Life Solar System

let sunRadius = 50;

let earthRadius = 20;

let moonRadius = 10;

let marsRadius = 25;

let venusRadius = 18;

let mercuryRadius = 11;

let jupiterRadius = 15;

let jupiterRingRadius = 3;

let angle = 0;

let earthAngle = 0;

let moonAngle = 0;

let jupiterRingAngle = 0;

let rotationSpeed = 0.01;

let rotationX = 0;

let rotationY = 0;

let previousMouseX = 0;

let previousMouseY = 0;

​

let earthImage;

let moonImage;

let marsImage;

let venusImage;

​

function preload() {

  earthImage = loadImage('https://1.bp.blogspot.com/-UUXaK5GCj-k/UcsKJRMgkVI/AAAAAAAACfM/sePP_H08JTQ/s1600/1.jpg');

  moonImage = loadImage('https://uploads-ssl.webflow.com/5a621bf894d1cf000155a6d3/5d00f263ec964648102c5282_opmbuilder_opm_moon_hillshaded_albedo_20190612143649.png');

  marsImage = loadImage('https://d.ibtimes.co.uk/en/full/1590529/mars.jpg');

  venusImage = loadImage('https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRGesMYI_0fhPx60ZHwPnOFfdJNKbfGM0-f3k4317H5uPWKoTLK8hdXQr2AP33VphQdAB0&usqp=CAU');

}

​

function setup() {

  createCanvas(800, 600, WEBGL);

}

​

function draw() {

  background(0);

  noStroke();

​

  // Apply rotation from mouse interaction

  rotateX(rotationX);

  rotateY(rotationY);

​

  // Sun

  push();

  rotateY(angle);

  fill(255, 255, 0);

  sphere(sunRadius);

  pop();

​

  // Earth

  push();

  rotateY(angle);

  translate(200, 0);

  rotateY(earthAngle);

  texture(earthImage);

  sphere(earthRadius);

​

  // Moon

  rotateY(moonAngle);

  translate(50, 0);

  texture(moonImage);

  sphere(moonRadius);

  pop();

​

  // Mars

  push();

  rotateY(angle);

  translate(300, 0);

  rotateY(earthAngle);

  texture(marsImage);

  sphere(marsRadius);

  pop();

​

  // Venus

  push();

  rotateY(angle);

  translate(100, 0);

  rotateY(earthAngle);

  texture(venusImage);

  sphere(venusRadius);

  pop();

​

  // Mercury

  push();

  rotateY(angle);

  translate(100, 0);

  rotateY(earthAngle);

  fill(125);

  sphere(mercuryRadius);

  pop();

​

  // Jupiter

  push();

  rotateY(angle);

  translate(400, 0);

  rotateY(earthAngle);

  fill(255, 165, 0);

  sphere(jupiterRadius);

​

  // Jupiter Rings

  rotateY(jupiterRingAngle);

  fill(150);

  torus(jupiterRadius + jupiterRingRadius, jupiterRingRadius / 2);

  pop();

​

  angle += rotationSpeed;

  earthAngle += rotationSpeed * 2;

  moonAngle += rotationSpeed * 4;

}

​

function mouseDragged() {

  let deltaX = mouseX - previousMouseX;

  let deltaY = mouseY - previousMouseY;

​

  rotationX += deltaY * 0.01;

  rotationY += deltaX * 0.01;

​

  previousMouseX = mouseX;

  previousMouseY = mouseY;

}

​