簡體   English   中英

Three.js陰影投射在通暢的臉上,啟動時分辨率較低

[英]Three.js shadows casting on unobstructed faces, low resolution to boot

這是我的問題:

問題

文本上的陰影不應存在,盡管我對shadowMap分辨率進行了更改,但沒有任何變化。 這是用於生成網格的代碼:

var materialArray_Flying = [
        new THREE.MeshPhongMaterial( { color: 0xff00ff, ambient: 0xff00ff } ), //face
        new THREE.MeshPhongMaterial( { color: 0x008888, ambient: 0x008888 } )]; //sides

var textGeom_Flying = new THREE.TextGeometry( "{Flying}",
        {
        size: 4, height: .25, curveSegments: 3,
        font: "helvetiker", weight: "bold", style: "normal",
        bevelThickness: 0.025, bevelSize: 0.05, bevelEnabled: true,
        material: 0, extrudeMaterial: 1
        });
var textMesh_Flying = new THREE.Mesh(textGeom_Flying, new THREE.MeshFaceMaterial(materialArray_Flying));
scene.add(textMesh_Flying);
textMesh_Flying.castShadow = true;
textMesh_Flying.receiveShadow = true;

我的渲染器設置如下:

var renderer = new THREE.WebGLRenderer({antialias: true});
renderer.shadowMapEnabled = true;
renderer.shadowMapSoft = true;
renderer.shadowMapType = THREE.PCFSoftShadowMap;
renderer.shadowCameraNear = 3;
renderer.shadowCameraFar = camera.far;
renderer.shadowCameraFov = 50;
renderer.setClearColor(0x000000, 1);
renderer.shadowMapWidth = 4096;
renderer.shadowMapHeight = 4096;

歡迎任何幫助。

我相信您所看到的是由於以下事實:對象的單位空間非常小,並且陰影貼圖技術正在努力將如此小的浮點轉換為可用的紋理。 加上非常“薄”的幾何形狀,有時即使最小的shadowCameraNear值仍然足夠大,可以從網格中“看到”。

我可以看到兩種解決方案。

1)停止接受主網格上的陰影

textMesh_Flying.receiveShadow = false;

或2)增加整個場景的大小/字母的厚度,為陰影算法提供一些“肉”。

注意:您可以嘗試使用shadowCameraNear = 0.001; 看看是否也有幫助。

希望能有所幫助,

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM