three.js - 使用 meshStandardMaterial Three.js 无法正确渲染纹理

标签 three.js react-three-fiber

我正在尝试将纹理渲染到 Material ,但渲染不正确,也许我的纹理是错误的,但是当我在 blender 中添加纹理时,它会正确渲染。我不知道为什么。

抱歉,我刚学了 Threejs,但是当前项目需要进行 3D 渲染。所以我来这里询问是否有人有解决方案,请帮助我。

enter image description here

这是我的 Codesanbox: https://codesandbox.io/s/hero-kdhox?file=/src/App.js

我在 Blender 中添加的纹理如下所示: /image/fiSuT.jpg

最佳答案

您必须垂直翻转纹理,当您使用“useLoader”导入纹理时,ThreeJS 默认会翻转它们,有一个属性 flipY对于纹理,但它并没有可靠地工作

最好的办法是在导入之前手动垂直翻转它们

或者,将纹理打包到 blender 本身的 GLB 中

关于three.js - 使用 meshStandardMaterial Three.js 无法正确渲染纹理,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/70360931/

相关文章:

three.js - 如何通过折射和反射在 Canvas 中创建由玻璃制成的文本?

javascript - aoMap 仅适用于 THREE.BufferGeometry 吗?

javascript - 如何从场景中删除网格的子集?

javascript - 如何在 three.js 中包含 typeface.json 字体文件?

javascript - Three.js 立方体,每个面都有不同的纹理。如何隐藏边/顶点

reactjs - 带有反应 Spring 动画的 react 三纤维

javascript - 防止点击 React-Fiber Three.js 中的对象

reactjs - 如何在react-三纤中n秒后停止useFrame

javascript - @ react 三/ react 三纤维 : useLoader() to load new file on props change

reactjs - 无法在 react 三纤维中使用 Canvas 的 PixelRatio