我有一台带有以下着色器的飞机:
<script type="x-shader/x-vertex" id="vertexshader">
varying vec3 col;
void main()
{
col = vec3( position.z, position.z, 1 );
gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );
}
</script>
<script type="x-shader/x-fragment" id="fragmentshader">
varying vec3 col;
void main()
{
// set color for the current vertex
gl_FragColor = vec4(col, 1);
}
</script>
我正在将飞机从相机上移开:
function renderFrame()
{
cube.position.z -= 1;
requestAnimationFrame( renderFrame );
renderer.render(scene, camera);
};
问题是我会假设,因为立方体正在移动,片段着色器位置值会改变,但事实并非如此。 'position'变量不是在3D空间中传递对象的当前位置吗?如果没有,我如何检测它的位置和旋转,或者我必须使用统一变量手动将此信息传递给着色器?
工作示例:http://webgl.demised.net/experiments/003_Shaders.php
另外,着色器是在初始化时还是在每帧上执行一次?
答案 0 :(得分:2)
顶点着色器中的position
变量是顶点属性。顶点属性通常从顶点缓冲区读取,顶层缓冲区驻留在GPU内存中。因此,应尽可能少地更改顶点数据,以避免将可能代价高昂的数据传输到GPU内存。这就是为什么不通过改变顶点缓冲数据来执行对象的平移和旋转的原因。相反,使用统一modelViewMatrix
。对于更复杂的对象,传输单个矩阵比传输整个模型更便宜。
模型视图矩阵是与视图矩阵(在场景中排列摄像机)相结合的模型矩阵(基本上是平面的平移)。无法从此矩阵中获取平面位置。但是,您可以沿着相机的查看方向获取相机的距离。这将是第三行第四列的条目。尝试根据此值计算颜色。
着色器被执行多次。渲染的每个顶点都会发出顶点着色器的调用。每个填充的片段都会发出片段着色器的调用。每次渲染图像时(即每一帧)都会发生这种情况。