Add glow to NodeMaterial

Questions
1

Hi,

So far I’ve been using PBRMaterials with GlowLayer for glow effects. But now I need to build my own materials in Node Material Editor. How can I add glow to NodeMaterial? Can I somehow convert the NodeMaterial to PBRMaterial or…?

2

The glow layer actually can rely on material’s emissiveColor even if it is a nodeMaterial, so a really hack way is https://playground.babylonjs.com/#LRFB2D#542.
Besides, as far as I know there is no good way to convert NodeMaterial to PBRMaterial, you can try to use PBRCustomMaterial or material plugin, but they need you to write the shader your own.

3

You can also consider writing a material plugin.

4

I’m quite confused what’s going on here, since NodeMaterial doesn’t have emissive properties NodeMaterial | Babylon.js Documentation.

Ok, but I’m using TypeScript, so if I // @ts-ignore emissive assign lines, then it runs… However this completely ignores my opaticy/alpha… which is not good…

Here’s the example of the problem.

@Evgeni_Popov Would Material Plugin solve the problem of ignored alpha/opacity?

5

When setting the emissiveTextureAndColor, it use the (<any>material).emissiveColor directly, that’s the reason. So as I said it is a really hack way, it is not recommended to use before you absolutely know what you’re doing.
As for the ignore the alpha, I think it is expected, you can try to reduce the glowlayer’s intensity: https://playground.babylonjs.com/#LRFB2D#547, or maybe what you need is not glowlayer?

Edit: Set emissiveIntensity can also have the same effect for only one mesh: https://playground.babylonjs.com/#LRFB2D#548

6

I’m building some glowing UI, eg:

image

Yeah GlowLayer is very easy to setup quickly, but maybe what I need is a PostProcess instead…

7

I think using the glowlayer is a good approach for your situation, but maybe you should turn to PBRCustomMaterial or material plugin.

8

You can try something like that to take alpha into account:

9

I don’t think alpha mode can do what I want. Also it looks like the glow is based on the texture, however it always glows the whole mesh of the object. And what I want is to have more glow on the areas with higher alpha, and no glow when alpha is 0.

But I realized that I’m using DefaultRenderingPipeline, so I can achieve a similar result with bloom effect:

image

3 Likes