Search code examples
three.jsreact-three-fiber

Texture is rendering not correctly with meshStandardMaterial three.js

I'm trying to render texture to material but it rendered is not correctly, maybe my texture is wrong, but when i add the texture in blender it renders correctly. I don't know why.

Sorry I just learned threejs, but the current project needs to render in 3d. So I came here to ask if anyone has a solution, please help me.

enter image description here

Here is my Codesanbox: https://codesandbox.io/s/hero-kdhox?file=/src/App.js

The texture I have added in Blender something like this: https://i.sstatic.net/fiSuT.jpg

Solution

  • You must flip your textures vertically, threejs will by default flip them when you import them using 'useLoader' there is a property flipY for textures but it hasn't been working reliably

    Your best bet is to flip them vertically manually before importing

    Alternatively, pack the textures in your GLB on blender itself