Outline around the mesh using Custom shaders

Questions
1

Hey everyone,

I’ve been trying to figure out how to create an outline around a mesh in Babylon.js, similar to this image.

image

I checked out this previous question on the forum and found the method using renderOutline, outlineColor, and outlineWidth, which works great.

But here’s the twist: I need to achieve the same effect using a Custom Shader. It’s a bit of a requirement for what I’m working on.

Can anyone lend a hand with this?

Thanks a bunch!

2

does this solve your question? Create outline around a 3D object - #5 by Evgeni_Popov

1 Like
3

Unfortunately No, I want to use proper shaders to achieve that effect. I am not allowed to use any predefined Babylon method. :slightly_smiling_face:

4

I guess you are finding custom postprocess? If you are asking the shader content rather than where to use the shader, it should be similar with glowlayer.

5

well, the babylon methods ARE using proper shaders to do that :slight_smile:

You can check the shaders used for the outline renderer or the glow layer and see what we are doing to make that work. Not sure why you can’t use the babylon methods (some assignment), but babylon is open source, everything we do is open to inspect.

6

Thank you. Can you please share me any reference link where I can find the code working under those methods.

Thank you in advance. :saluting_face:

7

Thank you for the reply. Will look into this as well! :handshake:

8

This is the class - Babylon.js/packages/dev/core/src/Rendering/outlineRenderer.ts at master · BabylonJS/Babylon.js (github.com)

Shader is this - Babylon.js/packages/dev/core/src/Shaders/outline.vertex.fx at master · BabylonJS/Babylon.js (github.com)
and
(vry simple fragment) Babylon.js/packages/dev/core/src/Shaders/outline.fragment.fx at master · BabylonJS/Babylon.js (github.com)

Babylon.js Playground (babylonjs.com)

1 Like