Skip to content

Latest commit

 

History

4 Commits

Folders and files

NameName
Last commit message
Last commit date
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

3D Solar System Simulation 🌌

Three.js JavaScript HTML5 CSS3

An interactive 3D solar system simulation built with Three.js that allows users to explore the planets and control their orbital speeds. Experience the beauty of our solar system with realistic planet sizes, orbits, and interactive controls.

Solar System Preview

✨ Features

  • 🌞 Realistic 3D visualization of the solar system
  • 🪐 All 8 planets with accurate relative sizes and distances
  • 🎮 Interactive speed controls for each planet
  • ⭐ Beautiful starry background
  • 🌓 Dark/Light theme toggle
  • 🎥 Camera controls (zoom, rotate, pan)
  • 📱 Mobile-responsive design
  • ⏯️ Pause/Resume functionality
  • 🔍 Planet labels on hover

🚀 Live Demo

View Live Demo

Note: The live demo will be available after GitHub Pages deployment is complete.

🛠️ Technologies Used

  • Three.js - 3D graphics library
  • Vanilla JavaScript - Core functionality
  • HTML5 & CSS3 - Structure and styling
  • WebGL - 3D rendering

📦 Installation

  1. Clone the repository:
git clone https://github.com/yadavshruti6/Solar-system-simulation.git
cd Solar-system-simulation
  1. Open index.html in your browser or use a local server:
# Using Python
python -m http.server

# Using Node.js
npx serve

🎮 Usage

  • Use the sliders to control each planet's orbital speed
  • Click and drag to rotate the view
  • Scroll to zoom in/out
  • Hover over planets to see their names
  • Use the Pause/Resume button to stop/start the animation
  • Toggle between dark and light themes using the theme button

📁 Project Structure

solar-system-simulation/
├── index.html          # Main HTML file
├── styles.css          # CSS styles
├── script.js           # Three.js implementation
├── README.md          # Project documentation
└── LICENSE            # MIT License

🎯 Key Components

  • Scene Setup: Three.js scene, camera, and renderer configuration
  • Planet Creation: 3D spheres with realistic sizes and materials
  • Animation System: Smooth orbital and rotational animations
  • User Controls: Interactive speed controls and camera movement
  • Responsive Design: Mobile-friendly interface

🤝 Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

  1. Fork the repository
  2. Create your feature branch (git checkout -b feature/AmazingFeature)
  3. Commit your changes (git commit -m 'Add some AmazingFeature')
  4. Push to the branch (git push origin feature/AmazingFeature)
  5. Open a Pull Request

📝 License

This project is open source and available under the MIT License.

👩‍💻 Author

Shruti Yadav

🙏 Acknowledgments

  • Three.js community for the amazing 3D library
  • NASA for planetary data and inspiration
  • All contributors and supporters of this project

About

Interactive 3D solar system simulation built with Three.js. Features include real-time planet speed controls, camera movement, planet labels, and dark/light theme toggle.

Resources

Stars

1 star

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages