我想给点击的模型构件加一个发光的边框,然后,按照下面的代码去执行后,没有报错,但是也没有效果。
// 传入长宽、场景、相机
const Pass = new OutlinePass(new THREE.Vector2(this.width, this.height), this.scene, this.camera)
// 将此通道结果渲染到屏幕
Pass.renderToScreen = true
// OutlinePass相关属性设置
Pass.visibleEdgeColor = new THREE.Color(76, 148, 156) // 可见边缘的颜色
Pass.hiddenEdgeColor = new THREE.Color(0, 1, 0) // 不可见边缘的颜色
Pass.edgeGlow = 1.0 // 发光强度
Pass.usePatternTexture = false // 是否使用纹理图案
Pass.edgeThickness = 2.0 // 边缘浓度
Pass.edgeStrength = 2.0 // 边缘的强度,值越高边框范围越大
Pass.pulsePeriod = 0 // 闪烁频率,值越大频率越低
// 一般生产环境中会配合鼠标事件,来改变selectedObjects,使选中的物体描边
Pass.selectedObjects = [需要添加外边框的网格模型]
// 将通道加入组合器
this.EffectComposer.addPass(Pass)
后来发现是Pass.renderToScreen = true
出了问题,把这个去掉或者改为false,效果就出来了。
挺好奇的,按照属性名,这应该是【渲染到屏幕】的意思,但是为什么是true,反而看不到效果呢?
后来查了一下,发现有更加深层的释义“true将处理的结果保存到帧缓冲区,false直接显示在canvas画布上面。” 这又如何理解?