Question

首先我是glsl和Three.js的初学者：）。

这是shader1的顶点和片段着色器（非常简单）：

 void main() {

    gl_Position = projectionMatrix * modelViewMatrix * vec4( position,1.0);             
}       

void main() {
gl_FragColor = vec4(1.0,0.0,0.0,1.0);
}

在我的init（）函数中有：

var geometry = new THREE.CubeGeometry(2, 2, 2);
var material = new THREE.MeshLambertMaterial({color: 0xffaaff});
cube = new THREE.Mesh(geometry, material);
scene.add(cube);

var effect1 = new THREE.ShaderPass(THREE.ShaderExtras[ "shader1" ]);
effect1.renderToScreen=true;
composer = new THREE.EffectComposer( renderer);
composer.addPass(renderScene);
composer.addPass(effect1);

在我的函数render（）中：

Renderer.clear() ;
composer.render();

但最后我的所有屏幕都是红色的，而不仅仅是我的立方体。怎么了？

谢谢。

Answer 1

我不知道Three.js，但是你安装着色器的方式看起来像是用作全屏幕后处理效果，不适用于你的几何体 - 而且因为你无条件地使输出像素成为红色，整个屏幕都是红色的。您需要使用其他一些操作来告诉Three.js您希望着色器用于渲染多维数据集（或场景中的所有几何体）。

Answer 2

要将后处理着色器应用于某些屏幕区域或对象，您需要使用模板（OpenGL术语）。

这是一个有点复杂的话题，所以我建议你在通用的OpenGL教程中阅读它们，或者研究现有的Three.js做模板的例子。

我认为这个例子做了一些相关的事情：

http://mrdoob.github.com/three.js/examples/webgl_postprocessing.html

仅对某些3D对象应用后处理效果

2 个答案: