后处理类
在Cesium中,我们创建自定义的后处理效果,一般通过 PostProcessStage 类来完成。当然,如果是很复杂的后处理效果,可能需要由多个后处理程序构成,此时可能会用到 PostProcessStageComposite 类,这里我们先不考虑很复杂的后处理效果。
属性
PostProcessStage 类有两个重要属性:
1、fragmentShader 片元着色器
后处理中只有片元着色器,并没有顶点着色器,因为后处理是对场景渲染后的结果进行处理,此时相当于是处理一张图片,所以没有顶点的概念。
输入参数
一个后处理对象的片元着色器中默认会有一些输入参数,这些参数由Cesium提供,我们直接使用。
uniform sampler2D colorTexture;
uniform sampler2D depthTexture;
varying vec2 v_textureCoordinates;colorTexture: 颜色纹理,即场景渲染后的颜色缓冲区depthTexture: 深度纹理,即场景渲染后的深度缓冲区v_textureCoordinates: 纹理坐标,即当前像素的纹理坐标
入口函数
着色器的入口函数为main,函数的输出值即为后处理的输出结果
void main(void)
{
out_FragColor=vec4(1.);
}2、uniforms 着色器变量
用来传递数据到片元着色器,这些数据可以是一个对象,也可以是一个方法,比如要传递一个颜色值到片元着色器,可以如下
new Cesium.PostProcessStage({
fragmentShader: fs,
uniforms: {
// 对象
color: new Cesium.Cartesian3(0.1, 0.2, 0.3),
// 方法
color: function () {
return new Cesium.Cartesian3(0.1, 0.2, 0.3);
},
},
});当然您还得在片元着色器中声明变量接收这个数据
uniform vec3 color; // 需要注意的是,您定义的接收类型得和您传递的数据类型相匹配
void main() {
out_FragColor = vec4(color.rgb , 1.0);
}GLSL库
要实现理想的后处理效果,在后处理的片元着色器中,如果我们只能获取到上面说的默认输入参数是远远不够的,还需要借助Cesium的GLSL库获取更多的信息如相机位置、太阳位置等。
Cesium内置的GLSL库里面封装了与当前场景相关的一些GLSL内容,比如相机位置、相机方向等。可以参考GLSL。
这个GLSL库的所有内容以czm_开头,表示是Cesium特有的,其内容大概可以分为以下两类
方法:用于在
GLSL中进行各种计算,比如czm_unpackDepth用于将从深度纹理中读取到的深度值进行解压缩,以便在着色器中进行深度测试和深度值比较等操作。变量:封装了与当前场景相关的变量,比如当前相机的位置
czm_encodedCameraPositionMCHigh + czm_encodedCameraPositionMCLow,当前太阳的位置czm_sunPositionWC等。