Write a ray tracing renderer. 

Responsive Centered Red Button

Need Help with this Question or something similar to this? We got you! Just fill out the order form (follow the link below), and your paper will be assigned to an expert to help you ASAP.

Objective
This is a difficult assignment.  You should start on this project far before of the due date, to give yourself time to write and debug your code.
The goal of this project is to write a ray tracing renderer.  You will write a collection of Javascript functions that, when called, will create a 3D scene and produce 2D images of the scene.  One of the functions will initialize the scene, others will create objects, lights and a virtual camera, and one additional function will cause the scene to be rendered into a 2D image.  You will be provided with various scenes that will call your functions to test your ray tracing code.
This is the first half of a two-part project. For this first part you will cast eye rays into the scene for each pixel, test these rays for intersection with cylinder objects, and then use the diffuse shading equation to find the color for each pixel.  In the second half of the project you will expand your Ray Tracer to include new functionality.
Project Description
You have four primary goals for the first part of this project:
Initialize the scene
Cast eye rays for each pixel
Implement detection of ray intersection with cylinders
Implement the diffuse shading equation
You can accomplish these goals however you see fit. A good approach would be to use object oriented programming practices and create objects for each of the major scene components (light, ray, cylinder). Global lists of scene objects can be stored to allow for easy access. You can then create a Ray object for each pixel and write a method which will take a Ray as input and test it against the scene objects for intersections, returning the closest hit. This Hit object, containing all necessary information, can then be passed to a shading function which would implement the shading equation (for multiple light sources) and return the pixel color. Such an approach would be easy to test and to extend in the next stage of the project.
However you implement the ray tracer, your results should appear exactly like the examples shown below in Results.
Provided Code
The PROVIDED SOURCE CODE  Download PROVIDED SOURCE CODE contains functions that describe various scenes with cylinders. Each number key 1-4 is assigned to a single scene function and pressing that key should reset the scene and create an image of the new one.
You should modify the source code in any way you see fit, and comment your code (include placing your name in the header). The source code is written in Processing/Javascript. Visit “p5js.org/reference/” for more information on built in functions. You are NOT allowed to use most of the built in processing/openGL functions in this project such as for drawing spheres. We are not using rasterization for this project!  You are, however, encouraged to use the p5.Vector data type and the standard math functions.  When in doubt about what library functions are okay to use, please ask the instructor or a TA.
You must set the color of each pixel manually. The easiest way to set a pixel’s color is to create a one-by-one pixel rectangle using the rect() function, as is shown in the provided code.
Scene Description Language
Each scene is described by calling several functions that set up and render the scene.  In addition to the test scenes, we have also provided empty functions for you to write in order to create your ray tracer.  Feel free to define any classes, objects, data structures, and global variables that you want to accomplish this project.
Below are the functions that you will need to implement for this assignment:
reset_scene()
Initialize all the data structures and variables so you can start with an empty scene.
set_background (r, g, b)
Sets the background color. If a ray misses all the objects in the scene, the pixel should be given this color.
set_fov (angle)
Specifies the field of view (in degrees) for perspective projection.  You will assume that the eye is at the origin, and that it is looking down the -z axis.
new_light (r, g, b, x, y, z)
Create a point light source at position (x,y,z) and its color (r, g, b). Your code should allow any number of light sources. For the second part of this assignment, you will cause these lights to cast shadows.
new_material  (dr, dg, db, ar, ag, ab, sr, sg, sb, spec_power, k_refl)
Specifies a new surface material with diffuse color (dr, dg, db).  Ignore the other terms for now, since we will not use them until the second part of this assignment.
new_cylinder  (x, y, z, radius, height)
Specifies the creation of a vertical cylinder with its base at (x, y, z) and with a given radius and height.  The material properties of the surface are given by the last new_material() command that was executed prior to this command.
draw_scene()
Ray-traces the scene and displays the image in the canvas region in your browser.
Note on color specification: Each of the red, green, and blue components for the above commands are floating point values in the range of 0.0 to 1.0.
Results
Below are the images that your program should generate for a given scene, when you press the keys 1-4.  There will be additional scene descriptions provided for Part B of this project.
My advice: use this github repo for a very similar project to reference functions and essentially copy but for cylinders instead of spheres
https://github.com/nathandaven/jsRayTracer

How to create Testimonial Carousel using Bootstrap5

Clients' Reviews about Our Services