Texture in onLoadObservable; Doesn't work in ShaderMaterail

Bugs
1

I wanted to load in a texture then send it to a shader with shaderMat.setTexture('texture', tx), but I encountered a problem. PS I am just getting started with shaders:

let texture = new BABYLON.Texture("https://i.imgur.com/M5VKiE7.png", scene);
texture.onLoadObservable.addOnce((tx) => {
        console.log(tx === texture); // true
        cube.material.setTexture("texture", tx);
});

But when I try it this way it passes. Why?

let texture = new BABYLON.Texture("https://i.imgur.com/M5VKiE7.png", scene);
cube.material.setTexture("texture", texture);

A link to the CYOS shader I wrote, link.

And here is a link to the playground, link. Or is it a problem with my shader? Any help would be very appreciated.

2

first you use a reserved keyword texture for your sampler name and did not declare it in the samplers list: https://playground.babylonjs.com/#2YJJIA#6

and if you fix that, then it works : https://playground.babylonjs.com/#2YJJIA#7

1 Like
3

In CYOS, the time uniform is automatically updated. But in the playground it does not. Is there something I am missing.

4

So it is smthg you need to handle on your side. Time is not automagically managed in shaderMaterial.

5

Here’s how you can handle your time parameter with a ShaderMaterial:

https://playground.babylonjs.com/#2YJJIA#8

1 Like
6

So the time uniform is not automatically updated by BabylonJS under the hood? And what is the onBind observable? Can you explain what you have done? Thanks in advance

7

No, there’s no automatic time uniform, you have to handle it yourself.

onBind is called each time the material has to be bound to render a mesh, so it’s the right time to set the new value of the time parameter.

This doc may help: Shaders | Babylon.js Documentation

1 Like
8

I will try to figure it out for more. Keep sharing such informative post keep suggesting such post.

1 Like