https://github.com/thatsinewave/ray-tracing-simulator
Interactive ray tracing simulation built with JavaScript and HTML5 Canvas.
https://github.com/thatsinewave/ray-tracing-simulator
good-first-contribution good-first-issue good-first-pr good-first-pr-first-contribution ray-tracing raycasting raytracer raytracing raytracing-render thatsinewave
Last synced: 2 days ago
JSON representation
Interactive ray tracing simulation built with JavaScript and HTML5 Canvas.
- Host: GitHub
- URL: https://github.com/thatsinewave/ray-tracing-simulator
- Owner: ThatSINEWAVE
- License: mit
- Created: 2025-02-08T13:38:49.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2025-03-11T02:15:30.000Z (about 1 year ago)
- Last Synced: 2025-03-11T03:22:12.616Z (about 1 year ago)
- Topics: good-first-contribution, good-first-issue, good-first-pr, good-first-pr-first-contribution, ray-tracing, raycasting, raytracer, raytracing, raytracing-render, thatsinewave
- Language: JavaScript
- Homepage: https://thatsinewave.github.io/Ray-Tracing-Simulator/
- Size: 31.3 KB
- Stars: 2
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
- Funding: .github/FUNDING.yml
- License: LICENSE
- Code of conduct: CODE_OF_CONDUCT.md
- Security: SECURITY.md
Awesome Lists containing this project
README
# [Ray Tracing Simulator](https://thatsinewave.github.io/Ray-Tracing-Simulator/)
An interactive **ray tracing simulation** built with JavaScript and HTML5 Canvas. This simulator allows users to visualize the behavior of light rays interacting with different objects, including reflective and absorptive surfaces.
## 🌟 Features
- **Real-time ray tracing** with adjustable parameters.
- **Dynamic scene manipulation** – add, remove, and move objects.
- **Multiple object types** – mirrors and circles with different materials.
- **Customizable light sources** – place and move light sources freely.
- **User-friendly controls** – tweak ray density, reflections, and length.
## ☕ [Support my work on Ko-Fi](https://ko-fi.com/thatsinewave)
## 🎮 How to Use
1. Open `index.html` in your browser.
2. Adjust ray settings using the control panel.
3. Add new objects (mirrors or circles) and change their material properties.
4. Click and drag objects to reposition them.
5. Observe how light interacts with different surfaces.
## 📌 Technologies Used
- HTML5 Canvas
- JavaScript (ES6+)
- CSS3 (for UI styling)
## [Join my discord server](https://discord.gg/2nHHHBWNDw)
## 🚀 Future Improvements
- Additional object types (prisms, lenses)
- Light absorption and scattering effects
- More advanced material properties
## 🛠️ Setup & Installation
No installation required! Just clone the repository and open `index.html` in your browser.
```sh
git clone https://github.com/yourusername/Ray-Tracing-Simulator.git
cd Ray-Tracing-Simulator
```
Then open `index.html`.
## 📜 Controls
- **Left Click & Drag** – Move objects or light sources.
- **Right Click** – Delete selected object.
- **Input Fields & Sliders** – Adjust ray count, reflection limits, and other parameters.
## Contributing
If you'd like to contribute to this project, please fork the repository and create a pull request.
## License
This project is licensed under the MIT License. See the [LICENSE](LICENSE) file for details.