Blog.csdn.net/A873054267/…
Post-processing sequence
- EffectComposer(Renderer) initializes the post-processing entry, the base package for post-processing, which is used to render scenes, apply channels, and output results.
- RenderPass(scene, camera) This pass will render a new scene based on the current scene and camera, which can be seen as saving the current scene
- Three.shaderpass (three.copyshader) This channel takes custom shaders as parameters to generate an advanced, custom post-processing channel that produces various blur effects and advanced filters. FXAAShader and LuminosityShader are all packages based on this
var renderPass = new THREE.RenderPass(scene, camera);
var customGrayScale = new THREE.ShaderPass(SweepingLightShader);
customGrayScale.needsUpdate=true
var effectCopy = new THREE.ShaderPass(THREE.CopyShader);
effectCopy.renderToScreen = true;
var composer = new THREE.EffectComposer(renderer);
composer.addPass(renderPass);
composer.addPass(customGrayScale);
composer.addPass(effectCopy);
composer.render()
Copy the code
Three has its own post-processing
- DotScreenShader: output grayscale point set
- Three. MirrorShader: Create a mirror effect
- THREE. HueSaturationShader: change the color hue and saturation
- VignetteShader: Added halo effect
- THREE. ColorCorrectionShader: adjust the distribution of color
- RGBShiftShader: Separate the red, green and blue colors
- THREE. BrightnessContrastShader: change the brightness and contrast
- ColorifyShader: Covers the entire screen with a color
- THREE.SepiaShader: Creates an effect similar to squid ink
- THREE.KaleidoShader: Similar to a kaleidoscope effect
- THREE.LuminosityShader: Increase the brightness
- THREE.TechnicolorShader: Simulates two color effects similar to those in old movies
- THREE. HorizontalBlurShader and THREE. VerticalBlurShader: you can create a blur in the direction of the horizontal and vertical
- THREE. HorizontalTiltShiftShader and THREE. VerticalTileShiftShader: can be created in the horizontal and vertical direction tilt the effect of translation
- THREE.TriangleBlurShader: The triangle-based approach creates a blurring effect
- BleachBypassShader: Create a silver-plated effect
- THREE.EdgeShader: Find the boundary of the image and display it
- THREE.FXAAShader: Adds anti-aliasing effect
- THREE.FocusShader: Creates a sharper center and blurry edges.