three.js - ThreeJS 预定义着色器属性/制服

Question

在做了一些没有额外库 + GLSL 着色器的“常规”WebGL 之后，我开始使用 ThreeJS 的 WebGL 渲染器。我现在正在尝试在我的 ThreeJS 程序中编写自定义着色器，我注意到 ThreeJS 处理了很多标准的东西，比如投影和模型/ View 矩阵。我的简单顶点着色器现在看起来像这样:

// All of these seem to be predefined:
// vec3 position;
// mat4 projectionMatrix;
// mat4 modelViewMatrix;
// mat3 normalMatrix;
// vec3 normal;

// I added this
varying vec3 vNormal;

void main() {
    vNormal = normalMatrix * vec3(normal);
    gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0);
}

我的问题是:哪些其他变量(我假设它们是统一的)是为我可以使用的顶点和片段着色器预定义的？例如，ThreeJS 是否可以帮助处理光向量/光颜色(当然，假设我已经在 ThreeJS 场景中添加了一个或多个灯光)？

更新 (2014 年 10 月 9 日):这个问题已经获得了相当多的意见，用户 Killah 提到现有的答案并没有导致使用当前版本的 Three.js 的解决方案。我添加并接受了我自己的答案，见下文。

Answer 1

对于制服，简短的回答如下:

在顶点着色器中

"uniform mat4 modelMatrix;",
"uniform mat4 modelViewMatrix;",
"uniform mat4 projectionMatrix;",
"uniform mat4 viewMatrix;",
"uniform mat3 normalMatrix;",
"uniform vec3 cameraPosition;",

并在片段着色器中

"uniform mat4 viewMatrix;",
"uniform vec3 cameraPosition;",

对于涉及制服和属性的完整答案，您的自定义着色器具有字符串变量 prefixVertex和 prefixFragment预先附加。

var vertexGlsl = prefixVertex + vertexShader;
var fragmentGlsl = prefixFragment + fragmentShader;

var glVertexShader = THREE.WebGLShader( gl, gl.VERTEX_SHADER, vertexGlsl );
var glFragmentShader = THREE.WebGLShader( gl, gl.FRAGMENT_SHADER, fragmentGlsl );

prefixVertex和 prefixFragment变量定义可以在 WebGLProgram.js 中找到或在 three.js 的非缩小版本中.

编辑:更新为three.js r.73