我想在 Three.js 中制作一个 3D 房间。我希望当我旋转房间时，相机 View 前面的墙壁变得透明。
这是我需要的示例:http://jsfiddle.net/tp2f2oo4/
似乎解决方案是将 THREE.BackSide 添加到 Material 中。
var material2 = new THREE.MeshPhongMaterial( {
color: 0xffffff,
transparent: false,
side: THREE.BackSide
} );
事实上，当一个房间充当单个 THREE.BoxGeometry 时，这非常有效， 但就我而言，每面墙、天花板和地板都是独立的 THREE.BoxGeometry 对象。当它们位于相机 View 前面时，有什么方法可以隐藏它们或不渲染它们吗？
最佳答案
您想要根据某些条件隐藏网格。这是使用 onBeforeRender() 和 onAfterRender() 方法的完美用例。
// callbacks
var onBeforeRender = function() {
var v = new THREE.Vector3();
return function onBeforeRender( renderer, scene, camera, geometry, material, group ) {
// this is one way. adapt to your use case.
if ( v.subVectors( camera.position, this.position ).dot( this.userData.normal ) < 0 ) {
geometry.setDrawRange( 0, 0 ); // it is too late to set visible = false, so do this, instead
}
};
}();
var onAfterRender = function( renderer, scene, camera, geometry, material, group ) {
geometry.setDrawRange( 0, Infinity );
};
// mesh
mesh = new THREE.Mesh( geometry, material );
mesh.position.set( 0, 0, 10 );
mesh.rotation.set( 0, 0, 0 );
scene.add( mesh );
mesh.userData.normal = new THREE.Vector3( 0, 0, - 1 );
mesh.onBeforeRender = onBeforeRender;
mesh.onAfterRender = onAfterRender;
fiddle :http://jsfiddle.net/3qh815xa/
三.js r.114
关于javascript - THREE.js 如何在 3d 房间模型中制作透明的前墙，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/46238866/