three.js所的双面材料不投射在平坦的几何参数

的两侧阴影见本jfiddle：http://jsfiddle.net/blwoodley/5Tr4D/1/three.js所的双面材料不投射在平坦的几何参数

我有照在旋转旋转正方形蓝色点光源。这给底层地面投下了阴影。除了它只在广场的一侧投下阴影。

我看到了这个讨论：https://github.com/mrdoob/three.js/issues/3544这表明在平面上剔光是原因。建议给我的广场一些深度，即使它成为一个立方体。

我可以用这个简单的例子来做到这一点，但是我遇到了一个表面参数几何问题。有没有办法让双方都投下阴影，而不必让我的几何图形有深度或不需要？

这是在与一个平面复制问题的小提琴主要功能：

function init() { 

container = document.createElement('div'); 
document.body.appendChild(container); 

camera = new THREE.PerspectiveCamera(30, window.innerWidth/window.innerHeight, 1, 100000); 
camera.position.x = 100; 
camera.position.y = 100; 
camera.position.z = 100; 
camera.lookAt({x: 0,y: 0,z: 0}); 

scene = new THREE.Scene(); 

var groundMaterial = new THREE.MeshLambertMaterial({ 
    color: 0xffffff, side:THREE.DoubleSide 
}); 
plane = new THREE.Mesh(new THREE.PlaneGeometry(2000,2000,10,10), groundMaterial); 
plane.rotation.x = Math.PI/2; 
plane.position.y = -40; 
plane.receiveShadow = true; 

scene.add(plane); 

var light; 

light = new THREE.SpotLight(0x0000ff); 
light.position.set(40, 40, 0); 
light.castShadow = true; 
light.shadowCameraVisible = true; 
light.shadowMapWidth = 2048; 
light.shadowMapHeight = 2048; 
light.position.set(24, 20, 0); 
light.lookAt(plane);  
light.castShadow = true; 
light.angle = .8; 
light.intensity = 30; 
light.distance=0; 
light.shadowCameraNear = 2; 
light.shadowCameraFar = 100; 
light.shadowCameraFov = 100; 
light.shadowDarkness = 1; 
light.shadowCameraVisible = true; 
scene.add(light); 

var planeGeo = new THREE.PlaneGeometry(20,20,20,20) 
_planeMesh = new THREE.Mesh(planeGeo, new THREE.MeshLambertMaterial({ color: 0x00ff00, side:THREE.DoubleSide })); 
_planeMesh.castShadow = true; 
scene.add(_planeMesh); 


// RENDERER 
webglRenderer = new THREE.WebGLRenderer(); 
webglRenderer.setSize(SCREEN_WIDTH, SCREEN_HEIGHT); 
webglRenderer.domElement.style.position = "relative"; 
webglRenderer.shadowMapEnabled = true; 
webglRenderer.shadowMapSoft = true; 

container.appendChild(webglRenderer.domElement); 
window.addEventListener('resize', onWindowResize, false);

}

来源

2013-12-09 Bob Woodley

是的，这是一个特点。

WebGLRenderer默认情况下，在渲染阴影时挑选正面。这是可以的，因为假定对象具有深度。如果你愿意，你可以选择背面：

renderer.shadowMapCullFace = THREE.CullFaceBack;

...但是两者都不是选项。

投射阴影时未考虑material.side属性。

three.js r.63

来源

2013-12-09 14:33:58 WestLangley

感谢您的回答。似乎我需要一个坚实的，而不是一个表面。但似乎没有办法挤压参数化几何，这是否正确？ –

您需要创建一个新帖子并描述您的特定几何体。 – WestLangley

three.js所的双面材料不投射在平坦的几何参数

回答

相关问题