How can I use webgl2 API such as Deferred Shading.

[Dong]

I need to use some of the features of webgl2.0 (http://doc.babylonjs.com/features/webgl2) in some businesses,such as deferred shadding.

but it says "In Babylon.js, our first use of this technique is to render a geometry buffer of the scene."  in the document#Multiple Render Target.

I still don't know how I should code,can I just use API from https://developer.mozilla.org/zh-CN/docs/Web/API/WebGL2RenderingContext/drawBuffers ???

I would like to have a documentation to help me ! thannnnnnnks

[Sebavan]

Hello, it is such a broad question ?

Deferred shading is not a webgl 2 feature but some features from webgl2 or through extension in webgl 1 called draw buffers can ease its implementation.

Currently our entire lighting and standard materials are based on forward rendering techniques.

In order to implement deferred most of the lighting shared code would require to be changed if you are willing to benefit from the other framework features.

That said it would be a nice addition to the framework. You could start by taking a look at the multi render target class and how it is used in ssao2 or object motion blur in order to inspire yourself and see how you could leverage it to create a deferred support.

Hope this might help.

[Dong]

5 hours ago, Sebavan said:

Hello, it is such a broad question ?

Deferred shading is not a webgl 2 feature but some features from webgl2 or through extension in webgl 1 called draw buffers can ease its implementation.

Currently our entire lighting and standard materials are based on forward rendering techniques.

In order to implement deferred most of the lighting shared code would require to be changed if you are willing to benefit from the other framework features.

That said it would be a nice addition to the framework. You could start by taking a look at the multi render target class and how it is used in ssao2 or object motion blur in order to inspire yourself and see how you could leverage it to create a deferred support.

Hope this might help.

Yeah,My confusion is how do I migrate a program I wrote in webgl2 to BABYLON, like deferred shadding based on MRT or something.

I can't find a way to use it in the document, like I want to create a frame buffer, send it to the shader through drawBuffer, and then output it to a different texture object.

 

[Guest]

You should be able to use the geometry buffer renderer like what we do in the Motion Blur postprocess: https://github.com/BabylonJS/Babylon.js/blob/master/src/PostProcess/babylon.motionBlurPostProcess.ts#L56

This object is responsible for the draw buffer webgl2 code. Once done you can use the data generated like a texture in your own shader: https://github.com/BabylonJS/Babylon.js/blob/master/src/PostProcess/babylon.motionBlurPostProcess.ts#L74

How to use your own shader: http://doc.babylonjs.com/how_to/shader_material