In the Setting up the basic postprocessing pipeline recipe, we showed you how you can use THREE.EffectComposer
to add postprocessing effects to a rendered Three.js scene. In this recipe, we'll explain how you can create custom processing steps that you can use with THREE.EffectComposer
.
This recipe uses THREE.EffectComposer
, so we need to load some additional JavaScript files with the correct objects. For this, you need to add the following at the top of your HTML page:
<script src="../libs/postprocessing/CopyShader.js"></script> <script src="../libs/postprocessing/EffectComposer.js"></script> <script src="../libs/postprocessing/RenderPass.js"></script> <script src="../libs/postprocessing/ShaderPass.js"></script> <script src="../libs/postprocessing/MaskPass.js"></script>
In this recipe, we'll create a postprocessing effect that converts the output using a mosaic effect. You...