Question

我无法让我的RenderPass写入MaskPass。如果我单独尝试传递（例如只有一个TexturePass;或者TexturePass + OutputPass）它可以工作，但是我无法让我的模板缓冲区工作。

http://signaturefloors.dev.flooradvisor.com.au/productapp/floor_align.php

我只想将主要的“场景”渲染2到3次到不同的模板（然后组合）但如果我也使用RenderPass，我甚至无法使用单个MaskPass。掩码+纹理传递似乎有效，它是RenderPass导致我的问题。

基本上，如果我使用MaskPass，则显示RenderPass。它应该只是给我一个蒙面飞机。

// Composer

    var texture1 = new THREE.TextureLoader().load( 'textures/2294472375_24a3b8ef46_o.jpg' );
    var texturePass1 = new THREE.TexturePass( texture1 );

    var clearMask = new THREE.ClearMaskPass();
    var renderMask = new THREE.MaskPass( this.scene, this.camera );
    var renderMaskInverse = new THREE.MaskPass( this.scene, this.camera );
    renderMaskInverse.inverse = true;

    var viewScene = new THREE.RenderPass( this.scene, this.camera );

    // Composition pass
    var outputPass = new THREE.ShaderPass( THREE.CopyShader );
    outputPass.renderToScreen = true;

    var renderTargetParameters = {
        minFilter: THREE.LinearFilter,
        magFilter: THREE.LinearFilter,
        format: THREE.RGBFormat,
        stencilBuffer: true
    };

    // Setup render target
    var renderTarget = new THREE.WebGLRenderTarget( SCREEN_WIDTH, SCREEN_HEIGHT, renderTargetParameters );
    this.composer = new THREE.EffectComposer(this.renderer, renderTarget);

    var renderPass = new THREE.RenderPass(this.scene, this.camera);
    //renderPass.renderToScreen = true;

    this.composer.addPass( texturePass1 );
    //this.composer.addPass( viewMask );

    this.composer.addPass( renderMask );
    this.composer.addPass( viewScene );
    this.composer.addPass( clearMask );
    this.composer.addPass( outputPass );

Answer 1

我一直在寻找解决方案一天左右，并且遇到了像你这样的很多问题。没有可用的答案，但我认为我找到了一个解决方案：

要启用RenderPass的遮罩，您需要设置 clear = false 。在你的情况下：

var viewScene = new THREE.RenderPass( this.scene, this.camera );
viewscene.clear = false

应该这样做！这是一个codepen：https://codepen.io/staus/pen/BJNNLq

使用RenderPass的Three.js Composer无法使用MaskPass

1 个答案: