bvh-tree | A Bounding Volume Hierarchy implementation using javascript | 3D Animation library

I am creating an OpenGL based ray tracer for polygon models. The basic structure is about to render the results to a quad from the fragment shader. To accelerate the application, BVH-trees are used. Because there is no recursion in GLSL, I decided to find an other way to traverse the bounding boxes. The bvh nodes (including the boxes) and the primitive coordinates are sent to the fragment shader into a shader storage buffer.

I am using the basic idea described in: Threaded BVH-tree traversal in shaders

The above solution uses links "which are used to skip nodes which don't need to be evaluated". There is a hit link: which node to jump to in case of a hit and there is a miss link: which node to jump to in case of a miss.

Actually, I am not using links to navigate between the boxes, as I have a complete binary tree, which makes easier to navigate between the different depths. But the basic concept is similar to link above. I store the nodes in breadth-first order.

Unfortunately, when the program is running there is a weird result. I can see the object partly ray-traced and the bounding box as well. The bounding box has grey color, but this color should be the color of the background.

The below picture shows the current state. You should see a cone in a grey background, but instead of this you can see a grey bounding box around its object.

... and how it should look like (it is a non bvh-tree version)

Here is my fragment shader:

About the project:

I am working on an Opengl ray-tracer, which is capable of loading obj files and ray-trace it. My application loads the obj file with assimp and then sends all of the triangle faces (the vertices and the indices) to the fragment shader by using shader storage objects. The basic structure is about to render the results to a quad from the fragment shader.

When I load bigger obj-s (more than 100 triangles), it took so much time for the computer to do the intersections, so I started creating a BVH-tree to speed up the process. My BVH splits up the space into two axis-aligned-bounding-boxes recursively based on the average median of the triangles faces contained in the AABB.

I succeed to build the BVH tree structure (on CPU) and now I want to convert it to a simple array, then send it to fragment shader (to a shader storage buffer).

Here is the method responsible for converting the BVH root node into an array:

I am working on an Opengl ray-tracer, which is capable of loading obj files and ray-trace it. My application loads the obj file with assimp and then sends all of the triangle faces (the vertices and the indices) to the fragment shader by using shader storage objects. The basic structure is about to render the results to a quad from the fragment shader.

When I load bigger obj-s (more than 100 triangles), it took so much time for the computer to do the intersections, so I started creating a BVH-tree to speed up the process. My BVH splits up the space into two axis-aligned-bounding-boxes recursively based on the average median of the triangles faces contained in the AABB.

I succeed to build the BVH tree structure (on CPU) and now I want to convert it to a simple array, then send it to fragment shader (to a shader storage buffer).

This is the structure of my BVH class.