NASA Space Apps Challenge 2024 [Noida]

Team Name - ELITE

Problem Statement - Create an orrery webapp

Team Leader Email - [email protected]

A Brief of the Prototype:

Solar System Visualization

This project is an interactive, web-based visualization of our solar system, created using HTML5 Canvas and JavaScript. It provides an engaging and educational experience for users to explore the planets, asteroid belts, and other celestial bodies in our solar system.

Features

• Realistic representation of the Sun, planets, and their orbits
• Animated planetary motion with varying speeds
• Asteroid belts (Main Asteroid Belt, Earth's Asteroid Belt, and Kuiper Belt)
• Earth's moon (satellite)
• Saturn's rings
• Interactive zoom functionality
• Click-to-view planet information
• Responsive design that adapts to different screen sizes

How to Use

1. Open the index.html file in a modern web browser.
2. The solar system will automatically start animating.
3. Use the zoom controls in the top-right corner to zoom in and out:
   • Click the "+" button to zoom in
   • Click the "-" button to zoom out
4. Click on any planet to view its name and orbit radius.
5. Click anywhere else to close the planet information popup. ##Just install live server extension on vs code and run the index.htmnl file on it and enjoy

Technical Details

• The visualization is built using HTML5 Canvas for rendering.
• JavaScript is used for animation and interactivity.
• Planet images are loaded dynamically (ensure the images folder is present with appropriate planet images).
• The project uses a custom zoom implementation to allow users to explore the solar system in detail.

Customization

You can easily customize various aspects of the visualization:

• Adjust planet sizes, colors, and orbit radii in the planets array.
• Modify the number and properties of asteroids in the asteroidBelt, earthAsteroidBelt, and kuiperBelt arrays.
• Change the appearance of Saturn's rings by modifying the saturnRings object.
• Adjust the zoom limits by changing the maxZoom and minZoom variables.

Browser Compatibility

This visualization should work in all modern web browsers that support HTML5 Canvas. For the best experience, use the latest version of Chrome, Firefox, Safari, or Edge.

Known Issues

• The background space sound may not autoplay in some browsers due to autoplay restrictions. Users may need to interact with the page first to start the audio.

Future Improvements

• Add more detailed information for each planet
• Implement touch controls for mobile devices
• Add options to adjust animation speed
• Include more celestial bodies like dwarf planets and comets

Credits

This Solar System Visualization was created as an educational project. Planet images and astronomical data are based on publicly available information from NASA and other space agencies.