Old project model rendering

[David_Sili]

Hello, I am struggling with something that I hope you will be able to help me with:
I have a project that I’m working on which uses React 17.0.2 (three: 0.133.0; @react-thre/fiber: 7.0.10; @react-three/drei: 7.13.0; @types/three: 0133.0). I have also set up a quick test React app with the newest stable React 18.2.0 and plugins (three: 0.156.0; @react-three/fiber: 8.14.0; @react-three/drei: 9.81.0; @types/three: 0.155.1).
On my test app I have managed to render the model as it could be seen in other online 3d model viewer apps. However, when I render the same model in the main project (older plugin versions) I get a much more pale model (black becomes gray and the light turquoise color is barely visible.)
I have played around with lighting and shadows and managed to get it darker, but the colors were still without their original intensity (and the shadows would also be gone then).
Is there a way to achieve the same or at least similar rendering of colors/materials that is possible when using the latest versions of the plugins?
Also, the code for rendering is exactly the same.

Thanks in advance.

[drcmda]

threejs went through a series of changes that affect lights and colors.

Updates to Color Management in three.js r152

Non-color maps are not sRGB-encoded, even if they’re PNG or JPEG files. By “non-color” we mean their RGB channels are being used to represent data — normal vectors, opacities, and PBR properties — rather than to represent visible color. It’s also worth noting that while PNG and JPEG files do contain color space metadata (usually claiming to be sRGB) that metadata is inaccurate more often than not, for these files. Also note: Blender has the same concept of non-color textures, and should export…

Updates to lighting in three.js r155

No, because that changes the size of the scene in the 3D world, but not the world itself, due to a Scene being merely a top-level node in the transform graph (any transform you apply to it is currently equivalent to the same transform as if it were an Object3D). It could be possible, but would need to be implemented. Once always-physical lights is released and well tested, then it might make sense to think about adding options (if maintainers agree with the added complexity), f.e. changing the …

fiber is not really wrapping threejs or changing it, you pair it with any threejs version you like and it will display in accordance with that version. so from version 152 on until latest you need to be aware of new encodings and how physical lights work.

[David_Sili]

I did update three to the latest version. I’ve tried updating other related plugins but they were not compatible. Now I have another challenge. The color is ok, but somehow it does not react to the light the same way it did (it has lost its shininess). I have managed to mitigate it to a degree using 6 directional lights (from all directions).
Thank you for your help!

[drcmda]

more lights === more expense. since three 155 light works very differently than before, you need to go through these posts to figure out how to get back to old results, and it may not even be fully possible. the lights now work in the same way as they do in blender.

[drcmda]

alternatively you can do

<Canvas gl={{ useLegacyLights: true }}>

[trusktr]

Also note legacy lights will be removed.