CustomProceduralTexture and vTextureCoord as emissiveTexture

Questions
1

Hi everyone,

I’ve currently 2 problems…

I want to add an animated noise overlay on an existing texture for a model.
To achieve this, I’ve created a fragment shader for the CustomProceduralTexture.
The texture can be set with .setTexture(‘u_emissiveTexture’, textureObject)

Problem 1)

The position of the texture2d is wrong. The problem is, that vPosition is the wrong value because the texture2d needs the correct vTextureCoord, not the vPosition.

The output would be
gl_FragColor = texture2D(u_emissiveTexture, vTextureCoord) + vec4(color, 1.0);

Currently it is
gl_FragColor = texture2D(u_emissiveTexture, vPosition) + vec4(color, 1.0);

When i try to declare

varying vec2 vPosition;
varying vec2 vTextureCoord;
varying vec2 vUV;

and use vTextureCoord it fails, because the vertex-shader that is used by CustomProceduralTexture does not declare vTextureCoord.

How can I solve this problem?

Problem 2)

I declared a glowLayer (Make Mesh Glow - Babylon.js Documentation) which works fine with emissive colors but i can’t get it to work with an emissiveTexture. It’s just not glowing.
And it doesn’t matter if it’s the CustomProceduralTexture or if i set the emissiveTexture directly with the right image.

Thank you all for the great support and piece of software you’ve provided :slight_smile:

2

A playground would help a lot with this. If you can get me one ill take a look.

3

Unfortunately not quick, there’s a NDA for this project.

Isn’t it possible to extend this one

with

attribute vec2 aTextureCoord;

// Output
varying vec2 vPosition;
varying vec2 vUV;
varying vec2 vTextureCoord;

const vec2 madd = vec2(0.5, 0.5);

void main(void) {	
	vPosition = position;
	vUV = position * madd + madd;
	vTextureCoord = aTextureCoord;
	gl_Position = vec4(position, 0.0, 1.0);
}

that would solve the whole texture2d problem i guess? but i’m not THAT great in guessing :smiley:

5

For 1, you must use vUV and not vPosition for the texture coordinates:

gl_FragColor = texture2D(u_emissiveTexture, vUV) + vec4(color, 1.0);

For 2, I think you should provide a PG else we won’t be able to help much.

6

Hi Evgeni

well - when i apply the texture directly as an albedoTexture or emissiveTexture, it is correct.
When i apply the texture with texture2d(u_emissiveTexture, vUV) it is flipped and wrong positioned.
When i apply the texture with texture2d(u_emissiveTexture, vPosition) it is not flipped, but wrong positioned.
(I’ve tried to apply texture.invertZ = true before setTexture(), this does not help)

I wish I could provide a fast example, I guess it will take one or two days (going on a workshop tomorrow)

7

vUV.y = 1.-vUV.y?

2 Likes
8

Holy… had to reassign vUV to a new vec2 (vUV can’t be modified) - but yes - this freaking works :smiley:
You made my day :slight_smile:

1 Like