首页 > 解决方案 > ThreeJS 纹理与原始渲染不匹配

问题描述

以下是一些截图来描述我的问题:

这是 .glb 文件及其质量的原始渲染。 原始渲染

这是它在浏览器中呈现的样子,如果你看看他所戴的帽子的边缘,你会发现它们似乎有一些纹理问题。此外,如果您旋转头部,您会看到模型本身将有部分您可以看穿。 浏览器渲染

这是我正在使用的代码,您会看到我正在尝试更改 gamma 并使用适当的技术来更好地应用纹理。

function ( gltf ) {
gltf.scene.traverse( function ( child ) {
  if ( child.isMesh ) {
    child.material.alphaTest = .5;
    child.material.map.anisotropy = maxAnisotropy;
  }
} );
scene.add( gltf.scene );
this.renderer.gammaOutput = true;
this.renderer.gammaInput = true;
this.renderer.gammaFactor = 2.2;
this.encoding = THREE.sRGBEncoding
this.anisotropy = maxAnisotropy;
this.mipmaps = true;
gltf.animations; // Array<THREE.AnimationClip>
gltf.scene; // THREE.Group
gltf.scenes; // Array<THREE.Group>
gltf.cameras; // Array<THREE.Camera>
gltf.asset; // Object
},

请让我知道您认为我应该怎么做才能让这个模型以更高的质量加载。

标签: javascriptthree.js

解决方案


推荐阅读