Skip to content

Latest commit

Β 

History

History
83 lines (51 loc) Β· 2.85 KB

File metadata and controls

83 lines (51 loc) Β· 2.85 KB

Procedurally Generated Galaxy in Three.js

Overview

This project is a 3D visualization of a procedurally generated galaxy built using Three.js. The aim is to create an interactive and visually stunning galaxy simulation that showcases the capabilities of procedural generation and 3D rendering in modern web development. 🌌✨🌠

Galaxy Preview

Features

  • Realistic Star Placement: Procedurally generated stars with adjustable density and distribution.
  • Interactive Camera: Pan, zoom, and rotate to explore the galaxy.
  • Dynamic Star Systems: Includes star clusters, nebulae, and random celestial bodies.
  • Customizable Settings: Easily modify galaxy size, star count, colors, and other parameters.
  • Optimized Rendering: Efficiently renders thousands of stars for smooth performance.

Technologies Used

  • Three.js: Core library for 3D rendering and visualization.
  • JavaScript: Main programming language for procedural algorithms and interactivity.
  • HTML/CSS: Basic structure and styling of the application. πŸ’»πŸ”§πŸŒŸ

Getting Started

Prerequisites

  • Node.js (for running a local development server)
  • A modern web browser (e.g., Chrome, Firefox, Edge) with WebGL support πŸŒβš™οΈπŸ–₯️

Installation

  1. Clone the repository:

    git clone https://github.com/ericafk0001/threejs-procedral-galaxy
  2. Navigate to the project directory:

    cd threejs-procedral-galaxy
  3. Start live server via vscode live server (or http server):

  4. Open your browser and go to http://127.0.0.1:5500/. πŸš€πŸŒŒπŸ› οΈ

Customization

The galaxy parameters can be modified directly in the JavaScript configuration file (config/galaxyConfig.js). Key parameters include:

  • Galaxy Size: Adjust the overall radius of the galaxy.
  • Star Count: Set the number of stars to render.
  • Color Schemes: Define custom colors for stars and nebulae. πŸŽ¨βœ¨πŸ”­

Controls

  • Mouse Wheel: Zoom in/out.
  • Left Click + Drag: Rotate the galaxy.
  • Right Click + Drag: Pan the camera. πŸ–±οΈπŸŒ πŸ”§

πŸ“‚πŸ“πŸ”§

Screenshots

Screenshot 1
Caption: A zoomed-out view of the galaxy. πŸŒŒπŸ–ΌοΈβœ¨

Screenshot 2
Caption: A close-up of a star cluster. πŸŒŸπŸ”πŸ’«

License

This project is licensed under the MIT License - see the LICENSE file for details. πŸ“œβœ…πŸ’»

Acknowledgments


Feel free to share your feedback or open issues for bug reports and feature requests! πŸ’‘πŸ“¬πŸŒŸ