使用 THREE.Renderpass 进行多场景渲染

Question

我遇到以下问题：尝试使用 RenderPass 渲染多个场景进行后处理。

现在有2个场景：

1) 地形 + 云彩

2) 文字图层

两个场景都在渲染，但文本图层混合到地形中（通常如果它们在同一场景中渲染，它应该像这样）。奇怪的是：我可以透过云层看到文字，云层渲染得比地形高很多（地形和云层在同一个场景中进行测试）

您看不到云层上方的文字，但它与地形融为一体

为了渲染它，我使用了以下代码：

    @renderPass = new THREE.RenderPass( @scene, @camera )
    @renderPass.renderToScreen = true
    @renderPass.clear = false
    @renderPass.clearDepth = true

    @textPass = new THREE.RenderPass( @textScene, @camera )
    @textPass.renderToScreen = true
    @textPass.clear = false
    @textPass.clearDepth = true

@composer = new THREE.EffectComposer( @renderer );

        @composer.addPass( @renderPass )
        @composer.addPass( @textPass )

但是当我尝试使用以下方式正常渲染它们时：

    @renderer.clear()
    @renderer.render @scene, @camera
    @renderer.clearDepth();
    @renderer.render @textScene, @camera

一切正常。

Answer 1

RenderPass 实际上没有 clearDepth 选项。我打开了一个拉取请求来添加对此的支持，这应该可以解决你的问题：

https://github.com/mrdoob/three.js/pull/10159

更新：拉取请求已合并并包含在 r83 版本中，因此您编写的代码现在应该可以工作了。

使用 THREE.Renderpass 进行多场景渲染

Multiple scenes rendering using THREE.Renderpass

rendering

three.js