would like to check what kind of codes can i write to orbit a circle for 300 pixels?

Start by running the solarSystemTEMPLATE sketch using your p5 editor (e.g. Brackets, vS code etc.). What you'll see is a function called celestialObj() which draws any celestial object you want, whether it's the sun, a planet or a moon. It takes a color and a diameter. When you first run it, the sketch already shows the sun. There's also a variable called speed which you will use in order to rotate objects at various speeds. The variable speed is equivalent to the frameCount variable of p5js, the variable that measures how many frames have been displayed on the canvas. Step 1: Create an earth of color blue and size 80. Move it to orbit 300 pixels. Hint: You should only use transformations to achieve this. Step 2: Rotate the earth around the sun at velocity "speed". Make sure you use the radians() function inside the rotate) call. Step 3: Make the earth spin around its axis at velocity "speed" too. You should now have an earth that rotates around its axis and around the sun. Step 4: Add a moon of color white and size 30 to the earth at an orbit of 100 pixels. Make the moon rotate at velocity -speed"2 so it spins the opposite way to the way the earth rotates. Make sure that your moon, while spinning around the earth, always shows the same side to earthlings (ie earthlings should not be able to see the so-called 'dark side of the moon'). Step 5: Make the sun spin around its axis, as it really does, at a slow speed/3. Step 6: Extend the sketch by adding one more celestial body by implementing one of the ideas for further development