提交 599a3dff 编写于 作者: M Mugen87

OutlinePass: Enable renderToScreen

上级 c36f35d9
......@@ -243,106 +243,116 @@ THREE.OutlinePass.prototype = Object.assign( Object.create( THREE.Pass.prototype
render: function ( renderer, writeBuffer, readBuffer, delta, maskActive ) {
if ( this.selectedObjects.length === 0 ) return;
if ( this.selectedObjects.length > 0 ) {
this.oldClearColor.copy( renderer.getClearColor() );
this.oldClearAlpha = renderer.getClearAlpha();
var oldAutoClear = renderer.autoClear;
this.oldClearColor.copy( renderer.getClearColor() );
this.oldClearAlpha = renderer.getClearAlpha();
var oldAutoClear = renderer.autoClear;
renderer.autoClear = false;
renderer.autoClear = false;
if ( maskActive ) renderer.context.disable( renderer.context.STENCIL_TEST );
if ( maskActive ) renderer.context.disable( renderer.context.STENCIL_TEST );
renderer.setClearColor( 0xffffff, 1 );
renderer.setClearColor( 0xffffff, 1 );
// Make selected objects invisible
this.changeVisibilityOfSelectedObjects( false );
// Make selected objects invisible
this.changeVisibilityOfSelectedObjects( false );
var currentBackground = this.renderScene.background;
this.renderScene.background = null;
var currentBackground = this.renderScene.background;
this.renderScene.background = null;
// 1. Draw Non Selected objects in the depth buffer
this.renderScene.overrideMaterial = this.depthMaterial;
renderer.render( this.renderScene, this.renderCamera, this.renderTargetDepthBuffer, true );
// 1. Draw Non Selected objects in the depth buffer
this.renderScene.overrideMaterial = this.depthMaterial;
renderer.render( this.renderScene, this.renderCamera, this.renderTargetDepthBuffer, true );
// Make selected objects visible
this.changeVisibilityOfSelectedObjects( true );
// Make selected objects visible
this.changeVisibilityOfSelectedObjects( true );
// Update Texture Matrix for Depth compare
this.updateTextureMatrix();
// Update Texture Matrix for Depth compare
this.updateTextureMatrix();
// Make non selected objects invisible, and draw only the selected objects, by comparing the depth buffer of non selected objects
this.changeVisibilityOfNonSelectedObjects( false );
this.renderScene.overrideMaterial = this.prepareMaskMaterial;
this.prepareMaskMaterial.uniforms[ "cameraNearFar" ].value = new THREE.Vector2( this.renderCamera.near, this.renderCamera.far );
this.prepareMaskMaterial.uniforms[ "depthTexture" ].value = this.renderTargetDepthBuffer.texture;
this.prepareMaskMaterial.uniforms[ "textureMatrix" ].value = this.textureMatrix;
renderer.render( this.renderScene, this.renderCamera, this.renderTargetMaskBuffer, true );
this.renderScene.overrideMaterial = null;
this.changeVisibilityOfNonSelectedObjects( true );
// Make non selected objects invisible, and draw only the selected objects, by comparing the depth buffer of non selected objects
this.changeVisibilityOfNonSelectedObjects( false );
this.renderScene.overrideMaterial = this.prepareMaskMaterial;
this.prepareMaskMaterial.uniforms[ "cameraNearFar" ].value = new THREE.Vector2( this.renderCamera.near, this.renderCamera.far );
this.prepareMaskMaterial.uniforms[ "depthTexture" ].value = this.renderTargetDepthBuffer.texture;
this.prepareMaskMaterial.uniforms[ "textureMatrix" ].value = this.textureMatrix;
renderer.render( this.renderScene, this.renderCamera, this.renderTargetMaskBuffer, true );
this.renderScene.overrideMaterial = null;
this.changeVisibilityOfNonSelectedObjects( true );
this.renderScene.background = currentBackground;
this.renderScene.background = currentBackground;
// 2. Downsample to Half resolution
this.quad.material = this.materialCopy;
this.copyUniforms[ "tDiffuse" ].value = this.renderTargetMaskBuffer.texture;
renderer.render( this.scene, this.camera, this.renderTargetMaskDownSampleBuffer, true );
// 2. Downsample to Half resolution
this.quad.material = this.materialCopy;
this.copyUniforms[ "tDiffuse" ].value = this.renderTargetMaskBuffer.texture;
renderer.render( this.scene, this.camera, this.renderTargetMaskDownSampleBuffer, true );
this.tempPulseColor1.copy( this.visibleEdgeColor );
this.tempPulseColor2.copy( this.hiddenEdgeColor );
this.tempPulseColor1.copy( this.visibleEdgeColor );
this.tempPulseColor2.copy( this.hiddenEdgeColor );
if ( this.pulsePeriod > 0 ) {
if ( this.pulsePeriod > 0 ) {
var scalar = ( 1 + 0.25 ) / 2 + Math.cos( performance.now() * 0.01 / this.pulsePeriod ) * ( 1.0 - 0.25 ) / 2;
this.tempPulseColor1.multiplyScalar( scalar );
this.tempPulseColor2.multiplyScalar( scalar );
var scalar = ( 1 + 0.25 ) / 2 + Math.cos( performance.now() * 0.01 / this.pulsePeriod ) * ( 1.0 - 0.25 ) / 2;
this.tempPulseColor1.multiplyScalar( scalar );
this.tempPulseColor2.multiplyScalar( scalar );
}
// 3. Apply Edge Detection Pass
this.quad.material = this.edgeDetectionMaterial;
this.edgeDetectionMaterial.uniforms[ "maskTexture" ].value = this.renderTargetMaskDownSampleBuffer.texture;
this.edgeDetectionMaterial.uniforms[ "texSize" ].value = new THREE.Vector2( this.renderTargetMaskDownSampleBuffer.width, this.renderTargetMaskDownSampleBuffer.height );
this.edgeDetectionMaterial.uniforms[ "visibleEdgeColor" ].value = this.tempPulseColor1;
this.edgeDetectionMaterial.uniforms[ "hiddenEdgeColor" ].value = this.tempPulseColor2;
renderer.render( this.scene, this.camera, this.renderTargetEdgeBuffer1, true );
// 4. Apply Blur on Half res
this.quad.material = this.separableBlurMaterial1;
this.separableBlurMaterial1.uniforms[ "colorTexture" ].value = this.renderTargetEdgeBuffer1.texture;
this.separableBlurMaterial1.uniforms[ "direction" ].value = THREE.OutlinePass.BlurDirectionX;
this.separableBlurMaterial1.uniforms[ "kernelRadius" ].value = this.edgeThickness;
renderer.render( this.scene, this.camera, this.renderTargetBlurBuffer1, true );
this.separableBlurMaterial1.uniforms[ "colorTexture" ].value = this.renderTargetBlurBuffer1.texture;
this.separableBlurMaterial1.uniforms[ "direction" ].value = THREE.OutlinePass.BlurDirectionY;
renderer.render( this.scene, this.camera, this.renderTargetEdgeBuffer1, true );
// Apply Blur on quarter res
this.quad.material = this.separableBlurMaterial2;
this.separableBlurMaterial2.uniforms[ "colorTexture" ].value = this.renderTargetEdgeBuffer1.texture;
this.separableBlurMaterial2.uniforms[ "direction" ].value = THREE.OutlinePass.BlurDirectionX;
renderer.render( this.scene, this.camera, this.renderTargetBlurBuffer2, true );
this.separableBlurMaterial2.uniforms[ "colorTexture" ].value = this.renderTargetBlurBuffer2.texture;
this.separableBlurMaterial2.uniforms[ "direction" ].value = THREE.OutlinePass.BlurDirectionY;
renderer.render( this.scene, this.camera, this.renderTargetEdgeBuffer2, true );
// Blend it additively over the input texture
this.quad.material = this.overlayMaterial;
this.overlayMaterial.uniforms[ "maskTexture" ].value = this.renderTargetMaskBuffer.texture;
this.overlayMaterial.uniforms[ "edgeTexture1" ].value = this.renderTargetEdgeBuffer1.texture;
this.overlayMaterial.uniforms[ "edgeTexture2" ].value = this.renderTargetEdgeBuffer2.texture;
this.overlayMaterial.uniforms[ "patternTexture" ].value = this.patternTexture;
this.overlayMaterial.uniforms[ "edgeStrength" ].value = this.edgeStrength;
this.overlayMaterial.uniforms[ "edgeGlow" ].value = this.edgeGlow;
this.overlayMaterial.uniforms[ "usePatternTexture" ].value = this.usePatternTexture;
if ( maskActive ) renderer.context.enable( renderer.context.STENCIL_TEST );
renderer.render( this.scene, this.camera, readBuffer, false );
renderer.setClearColor( this.oldClearColor, this.oldClearAlpha );
renderer.autoClear = oldAutoClear;
}
// 3. Apply Edge Detection Pass
this.quad.material = this.edgeDetectionMaterial;
this.edgeDetectionMaterial.uniforms[ "maskTexture" ].value = this.renderTargetMaskDownSampleBuffer.texture;
this.edgeDetectionMaterial.uniforms[ "texSize" ].value = new THREE.Vector2( this.renderTargetMaskDownSampleBuffer.width, this.renderTargetMaskDownSampleBuffer.height );
this.edgeDetectionMaterial.uniforms[ "visibleEdgeColor" ].value = this.tempPulseColor1;
this.edgeDetectionMaterial.uniforms[ "hiddenEdgeColor" ].value = this.tempPulseColor2;
renderer.render( this.scene, this.camera, this.renderTargetEdgeBuffer1, true );
// 4. Apply Blur on Half res
this.quad.material = this.separableBlurMaterial1;
this.separableBlurMaterial1.uniforms[ "colorTexture" ].value = this.renderTargetEdgeBuffer1.texture;
this.separableBlurMaterial1.uniforms[ "direction" ].value = THREE.OutlinePass.BlurDirectionX;
this.separableBlurMaterial1.uniforms[ "kernelRadius" ].value = this.edgeThickness;
renderer.render( this.scene, this.camera, this.renderTargetBlurBuffer1, true );
this.separableBlurMaterial1.uniforms[ "colorTexture" ].value = this.renderTargetBlurBuffer1.texture;
this.separableBlurMaterial1.uniforms[ "direction" ].value = THREE.OutlinePass.BlurDirectionY;
renderer.render( this.scene, this.camera, this.renderTargetEdgeBuffer1, true );
// Apply Blur on quarter res
this.quad.material = this.separableBlurMaterial2;
this.separableBlurMaterial2.uniforms[ "colorTexture" ].value = this.renderTargetEdgeBuffer1.texture;
this.separableBlurMaterial2.uniforms[ "direction" ].value = THREE.OutlinePass.BlurDirectionX;
renderer.render( this.scene, this.camera, this.renderTargetBlurBuffer2, true );
this.separableBlurMaterial2.uniforms[ "colorTexture" ].value = this.renderTargetBlurBuffer2.texture;
this.separableBlurMaterial2.uniforms[ "direction" ].value = THREE.OutlinePass.BlurDirectionY;
renderer.render( this.scene, this.camera, this.renderTargetEdgeBuffer2, true );
// Blend it additively over the input texture
this.quad.material = this.overlayMaterial;
this.overlayMaterial.uniforms[ "maskTexture" ].value = this.renderTargetMaskBuffer.texture;
this.overlayMaterial.uniforms[ "edgeTexture1" ].value = this.renderTargetEdgeBuffer1.texture;
this.overlayMaterial.uniforms[ "edgeTexture2" ].value = this.renderTargetEdgeBuffer2.texture;
this.overlayMaterial.uniforms[ "patternTexture" ].value = this.patternTexture;
this.overlayMaterial.uniforms[ "edgeStrength" ].value = this.edgeStrength;
this.overlayMaterial.uniforms[ "edgeGlow" ].value = this.edgeGlow;
this.overlayMaterial.uniforms[ "usePatternTexture" ].value = this.usePatternTexture;
if ( maskActive ) renderer.context.enable( renderer.context.STENCIL_TEST );
renderer.render( this.scene, this.camera, readBuffer, false );
renderer.setClearColor( this.oldClearColor, this.oldClearAlpha );
renderer.autoClear = oldAutoClear;
if ( this.renderToScreen ) {
this.quad.material = this.materialCopy;
this.copyUniforms[ "tDiffuse" ].value = readBuffer.texture;
renderer.render( this.scene, this.camera );
}
},
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册