背景遮擋

我想渲染2個場景。第一個場景只是一個2D背景平面。在第二個場景中，我設置了對象。第一個對象（頭部）材質不透明度設置爲1.我認爲這是一種簡單快速的方法來計算場景中第二個對象（太陽鏡）的遮擋。事實上，這項工作就像我想要的一樣，但現在頭部也遮擋了背景，儘管他應該是透明的。（我清除了深度緩衝繪製第二現場之前，並設置renderer.autoClear = false）背景遮擋

renderer.autoClear = false; 
var headMaterial = new THREE.MeshBasicMaterial({ color: 0x000000, opacity: 1 }); 
... 
//Renderloop 
renderer.clear(); 
renderer.render(background, camera); 
renderer.clear(false,true,false); 
renderer.render(scene, camera);

來源

2012-12-07 Draxas

是否有令人信服的理由，使兩個場景，而不是包含全部的對象只是一個場景？他們共享相同的相機，不是嗎？

嘗試先渲染頭部和太陽眼鏡。用模板掩蓋太陽鏡。然後用模板測試渲染背景（但不是深度測試）。你會渲染更少的背景像素，導致整體渲染速度更快。

來源

2012-12-07 17:30:20 bjorke

好的，但我真的不知道如何做到這一點，我找不到任何例子來如何用模具蒙版。另外我不知道如何指定對象的渲染順序......如果可能，我將不勝感激任何示例和鏈接。謝謝！ – Draxas

如果說「背景」，你的意思是隻有飛機上有一些紋理的場景 - 爲什麼不將背景設置爲html背景？那就是你不必計算飛機的正確位置來填滿所有屏幕區域。現在

，透明度的問題 - 這裏是你一些例子：http://jsfiddle.net/ajJmx/1/

看你們還怎麼你前面的立方體側設置爲半透明，你可以看到多維數據集的行吟詩人兩側。如果你打開立方體45度 - 你會發現即使背景上有其他物體 - 你的立方體立方體保持穩定。

你基本上想要做的是將transparent:true, opacity:0.6設置爲你的太陽鏡材質。而已！你也可以玩弄材質混合，並嘗試根據你的太陽鏡類型設置blending:THREE.AdditiveBlending。

來源

2012-12-09 00:11:16

好吧，我得到它的工作。在背景中設置背景，而不是在平面紋理上渲染它的技巧。它不是真的如何讓它工作，但它的工作原理。對於正確的遮擋，我將頭部材質設置爲透明：false，不透明度：0 AND顏色：0x000000。不知道爲什麼，但它只能通過將顏色設置爲黑色來起作用。感謝Alex。 – Draxas

歡迎您！繼續研究，一起我們將建立一個更好的網站！）） –

回答

相關問題