英文:
Some transparent textures in three.js
问题
渲染到浏览器时,一些纹理是透明的。有办法解决这个问题吗?我刚开始学习Three.js。
loader.load(model, (object) => {
object.position.set(-0.8, -0.5, -0.2);
scene.add(object);
scene.add(pointLight);
renderer.render(scene, camera);
document.body.appendChild(renderer.domElement);
const controls = new OrbitControls(camera, renderer.domElement);
camera.position.z = 2;
camera.position.y = 1;
camera.position.x = 2.8;
function animate() {
requestAnimationFrame(animate);
controls.update();
renderer.render(scene, camera);
}
animate();
}
尝试了多个模型,但结果始终相同。
英文:
> Some textures are transparent when I render them out in the browser. Is there a way to solve this issue? Im just started learing Three.js.
loader.load(model, (object) =\>
{
object.position.set(-0.8,-0.5,-0.2)
scene.add(object)
scene.add(pointLight)
renderer.render(scene, camera);
document.body.appendChild(renderer.domElement);
const controls = new OrbitControls(camera, renderer.domElement);
camera.position.z = 2;
camera.position.y = 1;
camera.position.x = 2.8;
function animate(){
requestAnimationFrame(animate);
controls.update();
renderer.render(scene,camera);
}
animate();
}
Tried with multiple models but always same result.
答案1
得分: 0
那些区域是透明的,因为你正在查看几何体的背面。默认情况下禁用了渲染背面,但你可以在材质上启用它:
object.material.side = THREE.DoubleSide;
你可以在文档中了解更多关于 Material.side
的信息。
英文:
Those areas are transparent because you're looking at the back-face of your geometry. Rendering the back-face is disabled by default, but you can enable it on your material:
object.material.side = THREE.DoubleSide;
You can read more about Material.side
in the docs.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论