Environment texutre doesn't work when develop with react-babylonjs

[Franco]

I try to use the .env format environment texture for my model, I can see the source has been loaded in the source but haven’t seen any effect.

The part of react code:

I am sure that the source path is fine cause the sources have been loaded. Please help!

[labris]

Hello and welcome!

I don’t use React but here is how it is performed with Babylon.js - https://playground.babylonjs.com/#0Q38WW#3

var hdrTexture = new BABYLON.CubeTexture("https://assets.babylonjs.com/environments/environmentSpecular.env", scene);
hdrTexture.gammaSpace = false;
scene.environmentTexture = hdrTexture;

[Franco]

Hi @labris , thank you for your feedback.

I also use vallina JavaScript version before, and it works fine. But I really want to know how to fix this when work with React.

[brianzinn]

hi Franco. That’s a good question. Would this syntax be an acceptable solution?

<Scene ...>
  <cubeTexture ...  assignTo="environmentTexture" />
</Scene>

The thing about having a texture as a child of a component is that react-babylonjs doesn’t know where to attach it. So, if you have multiple textures as children, you can assign them to emissive, diffuse (this is default, if you don’t specify), bump, etc in the case of Materials. Actually, materials are automatically assigned to a mesh.material, because they can be applied without ambiguity. Here is an example with textures being assigned to different properties of materials:
react-babylonjs/image-texture.stories.js at master · brianzinn/react-babylonjs (github.com)

Having said that I can tell you that the texture probably won’t attach to the scene, but it should. The reason it won’t is here (that code needs to be relaxed I think):
react-babylonjs/TexturesLifecycleListener.ts at master · brianzinn/react-babylonjs (github.com)

The way to get it to attach will end up being the same as the fixes done in March for post-processing that can attach configurations to ie: “Scene.imageProcessingConfiguration”. Do you mind @Franco to create an issue in the react-babylonjs repo?

If environmentTexture is the only texture prop on Scene object then it could perhaps be automatic.