Path tracing possible in CYOS?

[babbleon]

Hello,

I have been thinking about how best to get a scene to render a single frame as photo-realistically as possible without any prior baking etc. I am not necessarily looking for realtime photorealism, but if it take a few mins to render out that would be fine.

There are a number of webgl path tracing examples online:

• https://kantedal.github.io/pathtracer-webgl2/
• http://jonathan-olson.com/tesserace/tests/3d.html
• https://github.com/portsmouth/snelly 
• https://github.com/apbodnar/FSPT
• http://www.madebyevan.com/webgl-path-tracing/
• https://erichlof.github.io/THREE.js-PathTracing-Renderer/Geometry_Showcase.html
• https://github.com/cgcostume/pathgl
• https://www.shadertoy.com/view/4sfGDB

My question is: would it be possible to implement path tracing using CYOS or am I coming at this from the wrong angle?

Many thanks.

[babbleon]

Just a copy & paste exercise from here to http://cyos.babylonjs.com/#177L7P#1,

this from here to http://cyos.babylonjs.com/#J2ULBB

& this from here to http://cyos.babylonjs.com/#SQ9JCC#1 (very dark for reasons not yet understood by me)

but, I guess it wouldn't be rocket science to have it render stuff in the scene rather than just the primitives.

[Nabroski]

you welcome

 

[Nabroski]

Yes the challenge with primitives from the CPU, is not do to a basic Ray/Pathtracing. It is about make it fast, acceleration structures KD, SVO, BVH , and best way to send the mesh data via textures ect. If you are not a computer sience student, this is a long term project. 

[Sebavan]

@babbleon Drawing primitive is easy as you can think about them as parametric shapes well defined by maths. 

Drawing loaded model through path tracing on gpu would be as @Nabroski said way tougher as you would need to path down the shapes off your entire scene to the shader to detect collision and intersetction on the light path.

This is usually done on CPU and some light part like sampling and so on could still be highly optimised on gpu.

[babbleon]

thank you @Nabroski.. oh, so this is not straight forward then?

I am not worried about speed as I am not intending it to be realtime, but I would like to be able to render imported meshes & textures.

 

[babbleon]

thank you @Sebavan...  at the moment, I wouldnt know where to start with regards to light paths etc.

However, if BJS could do this, it would be awesome!

[Nabroski]

Hello
you have to bypass the Vertexshader be course down the pipeline your polygone would be rasterized (broken down in little fragments, reason why it’s called fragment or sometimes p i x e l shader) , one way of doing it is to pack meshdata in RGBA textures and unpack them in the fragmentshader. This would be step one, and now you on the playground to implement a Raytracer / Rasterizer. You need a Ray Triangle Intersection Test.
And so forth ..you step  slowly forward an through computer graphic history ‘til Monte Carlo or Russian Roulette . : ) 

So i'm learing all that stuff too, it's my passion. I use this a good free learning recourse: https://www.scratchapixel.com/
Here is the bible of pathtracers: http://www.pbrt.org/

So i would go an implement a Rasterizer first. Then you have an an idea how everything works, and when you feel comfortable, copy paste stuff from shadertoy. The magic here is, to have an basic idea, what you are doing. 

 

 

[Nabroski]

@babbleon what is happening now ? Do you wait 'til someone implement it for you. Otherwise make your self clear, i can guide you through. 

[babbleon]

Hi @Nabroski, I think for the time being I will not have the time to implement this assuming it's as complicated as I am told.

Thank you for the offer of guiding me - it is much appreciated.

If someone wants to sort this, then that would be great as I'm sure it would help others, but it was not my intention to get others to do my work. I can't mark as solved, but maybe it's a 'postponed for a rainy day'.

[Pryme8]

https://www.babylonjs-playground.com/#ZUMAGX#39

❤️

Ive got a few ray marching setups if you need more.  But this is the most developed one I have done because it has normal support, AO, Shadows, and texture mapping.  
Oh and camera controls!
If you need a simpler set up let me know.

[babbleon]

@Pryme8 - got to go now, will look later!

[Pryme8]

I can toss together a CYOS environment for you as well if you prefer, but the playground environment is way more robust.

[babbleon]

On mbl, so excuse typing. If it can render imported meshes with textures and converges like demos in first post, i will be amazed, impressed & grateful.

[Nabroski]

@babbleon If i told you how to ride a bicycle, i also would sound complicated. No need to worry, we all learning here. 

The best offer i can make right now, is to do it as a community project. (I'm right now into physics  and 5 other projects, zero time for pulling anything on github, also going though process of debug and so on)
I understand. In long term maybe 2 months it more possible from my side. Meanwhile our prayers go to Pryme8. 
 
Have a nice day. 

[babbleon]

Thank yoi Nabroski. Pryme8: may the force be with you.

[Pryme8]

If you want to do "Physical" Meshs with ray-marching the solution it to iterate though each polygonal face and use one of these equations:

Triangle - unsigned - exact
float dot2( in vec3 v ) { return dot(v,v); }
float udTriangle( vec3 p, vec3 a, vec3 b, vec3 c )
{
    vec3 ba = b - a; vec3 pa = p - a;
    vec3 cb = c - b; vec3 pb = p - b;
    vec3 ac = a - c; vec3 pc = p - c;
    vec3 nor = cross( ba, ac );

    return sqrt(
    (sign(dot(cross(ba,nor),pa)) +
     sign(dot(cross(cb,nor),pb)) +
     sign(dot(cross(ac,nor),pc))<2.0)
     ?
     min( min(
     dot2(ba*clamp(dot(ba,pa)/dot2(ba),0.0,1.0)-pa),
     dot2(cb*clamp(dot(cb,pb)/dot2(cb),0.0,1.0)-pb) ),
     dot2(ac*clamp(dot(ac,pc)/dot2(ac),0.0,1.0)-pc) )
     :
     dot(nor,pa)*dot(nor,pa)/dot2(nor) );
}

Quad - unsigned - exact
float dot2( in vec3 v ) { return dot(v,v); }
float udQuad( vec3 p, vec3 a, vec3 b, vec3 c, vec3 d )
{
    vec3 ba = b - a; vec3 pa = p - a;
    vec3 cb = c - b; vec3 pb = p - b;
    vec3 dc = d - c; vec3 pc = p - c;
    vec3 ad = a - d; vec3 pd = p - d;
    vec3 nor = cross( ba, ad );

    return sqrt(
    (sign(dot(cross(ba,nor),pa)) +
     sign(dot(cross(cb,nor),pb)) +
     sign(dot(cross(dc,nor),pc)) +
     sign(dot(cross(ad,nor),pd))<3.0)
     ?
     min( min( min(
     dot2(ba*clamp(dot(ba,pa)/dot2(ba),0.0,1.0)-pa),
     dot2(cb*clamp(dot(cb,pb)/dot2(cb),0.0,1.0)-pb) ),
     dot2(dc*clamp(dot(dc,pc)/dot2(dc),0.0,1.0)-pc) ),
     dot2(ad*clamp(dot(ad,pd)/dot2(ad),0.0,1.0)-pd) )
     :
     dot(nor,pa)*dot(nor,pa)/dot2(nor) );
}

Which honestly to me sounds pretty intensive, but has been done.

 

http://iquilezles.org/www/articles/raytracing/raytracing.htm

I could hit up IQ and see if he can point me in the right direction.  Hes usually pretty good about getting back to people.

[Nabroski]

@Pryme8 Babylon has already everything implemented it is just on the CPU. https://github.com/BabylonJS/Babylon.js/blob/9824853960fc2a4be97b1acb6907244c8df9f05e/src/Culling/babylon.ray.ts#L132

So i lean back for quite a while. I created a template. 
Tipp: first go with the Rasterizer Triangel it is - l i t e r a l l y -  2 lines of code!  inspiration (reference, reference)

• https://www.babylonjs-playground.com/#FI9JFW

[Pryme8]

I can convert any of the top demo links, if y'all have a specific one you want to play with.

[Pryme8]

32 minutes ago, Nabroski said:

Tipp: first go with the Rasterizer Triangel it is - l i t e r a l l y -  2 lines of code!  inspiration (reference, reference)

The second one is going with Signed distance Functions like with the code snippets I posted above.

I "know" how to pull it off, the problem is going to be efficiency.

[Pryme8]

https://github.com/apbodnar/FSPT

Im all about this one.  Give me a few days to wrap up some other projects.

[Pryme8]

https://www.babylonjs-playground.com/#ZUMAGX#41

Here you go, Ill do a real mesh here during lunch.  

anybody got a  CORS safe link for like the budda model or the rabbit obj?

https://www.babylonjs-playground.com/#ZUMAGX#43
can anyone get this to compile?

 

https://www.babylonjs-playground.com/#ZUMAGX#44
*ACK* ill need to pass the buffer as a texture, or a custom attribute.

https://www.babylonjs-playground.com/#ZUMAGX#50 <- DO NOT CLICK UNLESS YOU WANT TO CRASH YOUR BROWSER.

Ehhh... im gonna need a different approach.

[babbleon]

@Pryme8, will chexk this out tmrw when im at my desk. Cant do anything on this phone.... Including hitting the correvt keys.

[Pryme8]

I hit up IQ The Man, The Myth, The Legend.  Cross your fingers he gets back to me and takes interest.

[Pryme8]

http://www.scratchapixel.com/lessons/3d-basic-rendering/ray-tracing-polygon-mesh/Ray-Tracing a Polygon Mesh-part-1