You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

39 lines
1.4 KiB

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>Graphische Datenverarbeitung - Raytracing - Many Spheres</title>
  6. <script type="text/javascript" src="manyspheres.bundle.js"></script>
  7. <link rel="icon" type="image/png" href="ai-logo.png">
  8. </head>
  9. <body>
  10. <nav class="navbar navbar-light bg-light">
  11. <div class="container">
  12. <a class="navbar-brand" href="/index.html">
  13. <img src="ai-logo.png" width="30" height="30" class="d-inline-block align-top" alt="">
  14. Graphische Datenverarbeitung
  15. </a>
  16. <div class="navbar-brand">Raytracing</div>
  17. </div>
  18. </nav>
  19. <br>
  20. <div class="container">
  21. <div class="row">
  22. <figure class="figure col-sm-6">
  23. <canvas id="result" class="figure-img mx-auto d-block" width="500" height="500"></canvas>
  24. <figcaption class="figure-caption text-center">
  25. Implement a Raytracer by sending a ray into the scene for every pixel. Color the pixel with the color of the nearest sphere if the ray hits.
  26. </figcaption>
  27. </figure>
  28. <figure class="col-sm-6 figure">
  29. <img class="figure-img mx-auto d-block" src="manyspheres-finished.png">
  30. <figcaption class="figure-caption text-center">Reference image</figcaption>
  31. </figure>
  32. </div>
  33. </div>
  34. </body>
  35. </html>