【问题标题】:Threejs WebGLRenderTarget return different texture result with render to screenThreejs WebGLRenderTarget 返回不同的纹理结果并渲染到屏幕
【发布时间】:2017-05-16 12:01:05
【问题描述】:

代码

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 作为平面材质的纹理时,它得到了错误的结果:光线一直在发光并且周围有绿色和黄色的环。

我想要的结果是这样的:,不是一直在发光,只有蓝色。一旦我切屏,错误的结果就会消失。

从上面,我认为这是来自渲染目标的错误结果,不知道它改变了纹理

【问题讨论】:

    标签: three.js


    【解决方案1】:

    哦,当我设置 grPass.needsSwap = false 时,它​​可以工作。看起来像是版本更改。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2020-05-11
      • 1970-01-01
      • 1970-01-01
      • 2014-03-18
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多