Threejs WebGLRenderTarget通过渲染到屏幕返回不同的纹理结果

时间:2017-05-11 09:55:10

标签: three.js

代码

var renderTargetParameters = { minFilter: THREE.LinearFilter, magFilter: THREE.LinearFilter, format: THREE.RGBAFormat, stencilBuffer: false,depthBuffer:false },
        renderTargetOcl = new THREE.WebGLRenderTarget( SCREEN_WIDTH/4, SCREEN_HEIGHT/4, renderTargetParameters );

    var effectFXAA = new THREE.ShaderPass( THREE.ShaderExtras[ "fxaa" ] );
    effectFXAA.uniforms[ 'resolution' ].value.set( 1 / SCREEN_WIDTH, 1 / SCREEN_HEIGHT );

    let hblur = new THREE.ShaderPass( THREE.ShaderExtras[ "horizontalBlur" ] );
    let vblur = new THREE.ShaderPass( THREE.ShaderExtras[ "verticalBlur" ] );

    var bluriness = 2;

    hblur.uniforms[ 'h' ].value = bluriness / SCREEN_WIDTH*2;
    vblur.uniforms[ 'v' ].value = bluriness / SCREEN_HEIGHT*2;

    var renderModel = new THREE.RenderPass( this.scene, this.camera );
    var renderModelOcl = new THREE.RenderPass( this.oclscene, this.oclcamera );

    let grPass = new THREE.ShaderPass( THREE.ShaderExtras['Godrays'] );
    grPass.needsSwap = true;
    grPass.renderToScreen = false;

    var finalPass = new THREE.ShaderPass( THREE.ShaderExtras['Additive'] );
    finalPass.needsSwap = true;
    finalPass.renderToScreen = true;

    let oclcomposer = new THREE.EffectComposer( this.renderer, renderTargetOcl );

    oclcomposer.addPass( renderModelOcl );
    oclcomposer.addPass( hblur );
    oclcomposer.addPass( vblur );
    oclcomposer.addPass( hblur );
    oclcomposer.addPass( vblur );
    oclcomposer.addPass( grPass );



    let renderTarget = new THREE.WebGLRenderTarget( SCREEN_WIDTH, SCREEN_HEIGHT, renderTargetParameters );

    let finalcomposer = new THREE.EffectComposer( this.renderer, renderTarget );

    finalcomposer.addPass( renderModel );
    // finalcomposer.addPass( effectFXAA );
    finalcomposer.addPass( finalPass );

    finalPass.uniforms[ 'tAdd' ].value = oclcomposer.renderTarget1.texture;

我试图轻轻刮擦。

设置grPass.renderToScreen = true时;和finalPass.renderToScreen = false;我得到了正确的结果。这意味着第一位作曲家运作良好。

虽然我使用oclcomposer作为平面材质的纹理,但它得到了错误的结果:光线持续闪亮,并且有绿色和黄色环。

我想要的结果是:enter image description here,不是一直闪闪发光,只有蓝色。一旦我切断屏幕,错误的结果就会消失。

从上面来看,我认为来自rendertarget的结果是错误的,不知道它改变了纹理

1 个答案:

答案 0 :(得分:0)

哦,当我设置grPass.needsSwap = false时,它可以工作。像版本更改一样。