threejs有很多种特效，但是原理是同一个原理就不分开写了，懒，也没必要混分。
这门手艺叫做“后处理”，外语叫“PostProcessing”，基本概念请大家多查一查，而对于threejs来说，本质上是利用一个EffectComposer和pass来实现的.
EffectComposer中会初始化两个WebGLRenderTarget，一个叫writebuffer，另一个叫readbuffer。在渲染执行的时候，composer会遍历内部所有的pass，然后执行每个pass的渲染，每个pass都会传入writeBuffer和readBuffer，一般每个pass渲染会读取readbuffer中的数据，并写入writebuffer。在每次pass的渲染后，可以根据pass的needsSwap属性来互换这两个buffer，从而形成一个读取写入的流式处理。当处理到最后一个pass的时候，一般会把当前的渲染的fbo设置为null，也就是渲染到屏幕。所以经过最后一次渲染后，我们的渲染结果最终会被输出到屏幕。
pass,在threejs中继承实现了许多种pass,一般分为2类
1、renderpass一般用来渲染场景，把scene中的场景渲染到某个buffer中，注意这个renderpass如果是最后一个的话，会将内容直接渲染到屏幕输出，所以如果想叠加之前的处理结果，是需要额外加一个copypass的。
2、shaderpass的作用是使用一个shader，处理平面图形。一般来说shaderpass的输入是一些之前的处理后rendertarget的texture，输出也是通过一个正交相机对着的平面输出到buffer中。
关于这2个玩意，一定要去仔细的看threejs的官方示例，比如
//假如以上已经初始化化完场景scene、相机camera、控制器control//核心代码var renderScene = new RenderPass( scene, camera );var bloomPass = new UnrealBloomPass( new THREE.Vector2( window.innerWidth, window.innerHeight ), 1.5, 0.4, 0.85 );bloomPass.threshold = params.bloomThreshold;bloomPass.strength = params.bloomStrength;bloomPass.radius = params.bloomRadius;var bloomComposer = new EffectComposer( renderer );bloomComposer.renderToScreen = false;bloomComposer.addPass( renderScene );bloomComposer.addPass( bloomPass );var finalPass = new ShaderPass(new THREE.ShaderMaterial( {uniforms: {baseTexture: { value: null },bloomTexture: { value: bloomComposer.renderTarget2.texture }},vertexShader: document.getElementById( 'vertexshader' ).textContent,fragmentShader: document.getElementById( 'fragmentshader' ).textContent,defines: {}} ), "baseTexture");finalPass.needsSwap = true;var finalComposer = new EffectComposer( renderer );finalComposer.addPass( renderScene );finalComposer.addPass( finalPass );
然后用下面这个render代替原本的render.如何去点亮局部，靠读者自己尝试，想办法。
camera.layers.set( BLOOM_SCENE );bloomComposer.render();camera.layers.set( ENTIRE_SCENE );finalComposer.render();
效果在BIM模型上的浅层应用，可以用来做些选中效果或者和照明效果。但是真正的视角高手，是做智慧运维的，笔者的BIM行业，暂时没有收到这方面的需求，等后续有需求了再补上。
自研引擎产品试用，demo下载：
QModel-BIM模型浏览器
