OSG编程指南＜十六＞：OSG渲染到纹理RTT及三维纹理体渲染技术简介
1、渲染到纹理（RTT）
1.1 RTT介绍
RTT（Render to Texture）即渲染到纹理。在普通的图形渲染流程中，最终结果是渲染到帧缓存中，然后才会显示到屏幕上。而RTT则是将场景渲染到一张纹理上，并且在之后进行使用。
1）创建纹理对象
要进行RTT，首先要创建一个纹理对象，需要注意的是，这里只是创建了一个纹理对象，并没有提供数据，因此data设置成了null。
// 创建渲染对象
const targetTextureWidth = 256; // 纹理的长度与宽度
const targetTextureHeight = 256;
const targetTexture = gl.createTexture(); // 创建纹理对象
gl.bindTexture(gl.TEXTURE_2D, targetTexture); // 进行bind，以下操作针对的是当前bind对象
{
// 定义 0 级的大小和格式，不需要mipmap只需定义level 0即可
const level = 0;
const internalFormat = gl.RGBA; // 每个像素使用RGBA表示
const border = 0; // 纹理的border，必须为0
const format = gl.RGBA;
const type = gl.UNSIGNED_BYTE; // 像素每个通道的存储格式
const data = null; // 设置成null
gl.texImage2D(gl.TEXTURE_2D, level, internalFormat,
targetTextureWidth, targetTextureHeight, border,
format, type, data);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
}
2）创建帧缓冲
接下来，需要创建一个帧缓冲（framebuffer），帧缓冲是一个附件集，附件是纹理或renderbuffer。Renderbuffer与纹理很像，但支持一些纹理不支持的格式和可选项。不过，不能像纹理那样直接将renderbuffer提供给着色器。
// 创建并绑定帧缓冲
const fb = gl.createFramebuffer();
gl.bindFramebuffer(gl.FRAMEBUFFER, fb);
// 附加纹理为第一个颜色附件
const attachmentPoint = gl.COLOR_ATTACHMENT0;
gl.framebufferTexture2D(
gl.FRAMEBUFFER, attachmentPoint, gl.TEXTURE_2D, targetTexture, level);
gl.bindFramebuffer(gl.FRAMEBUFFER, fb);
3） 创建深度附件
在渲染到纹理时，可以选择不创建深度附件，这样就没有深度检测，渲染出来的纹理遮挡关系可能不正确。如果需要创建深度附件，则可以按照以下步骤进行：
// 创建一个深度纹理
const depthTexture = gl.createTexture();
gl.bindTexture(gl.TEXTURE_2D, depthTexture);
// 设置深度缓冲的大小和targetTexture相同
{
// 定义 0 级的大小和格式
const level = 0;
const internalFormat = gl.DEPTH_COMPONENT24;
const border = 0;
const format = gl.DEPTH_COMPONENT;
const type = gl.UNSIGNED_INT;
const data = null;
gl.texImage2D(gl.TEXTURE_2D, level, internalFormat,
targetTextureWidth, targetTextureHeight, border,
format, type, data);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
// 将深度纹理附加到缓冲帧
gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.DEPTH_ATTACHMENT, gl.TEXTURE_2D, depthTexture, level);
}
4)进行渲染，生成纹理
在渲染之前需要先绑定帧缓冲以及设置视口。以下是进行渲染的代码：
// 绑定帧缓冲
gl.bindFramebuffer(gl.FRAMEBUFFER, fb);
// 设置视口大小
gl.viewport(0, 0, targetTextureWidth, targetTextureHeight);
// 清空画布颜色缓冲区和深度缓冲区
gl.clearColor(0, 0, 0, 1);
gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
// 设置相机
// ...
// 设置光源
// ...
// 绘制场景
// …
1.2 RTT应用场景
渲染到纹理，目前我知道的使用场景有以下几种：
1）直接交给着色器使用
生成的纹理可以直接传递给着色器，在着色器中使用它进行渲染。在进行渲染之前，需要将Framebuffer的绑定解除，并使用纹理对象进行绘制：
// 将帧缓冲的绑定解除
gl.bindFramebuffer(gl.FRAMEBUFFER, null);
// 使用生成的纹理进行绘制
gl.bindTexture(gl.TEXTURE_2D, targetTexture);
gl.viewport(0, 0, gl.canvas.width, gl.canvas.height);
gl.useProgram(program);
gl.drawArrays(gl.TRIANGLES, 0, 6);
2)读取纹理到数组，然后进一步使用, 可用于拾取对象、生成纹理、调试Shader等
// 读取纹理到数组
const pixels = new Uint8Array(targetTextureWidth * targetTextureHeight * 4);
gl.readPixels(0, 0, targetTextureWidth, targetTextureHeight, gl.RGBA, gl.UNSIGNED_BYTE, pixels);
在这里，我们使用gl.readPixels()函数将帧缓冲区中的像素数据读取到一个数组中。这个数组就是我们最终生成的纹理数据，可以用来在之后的渲染中使用。如果想用这个数组重新生成纹理，可按以下代码：
// 创建纹理对象
const texture = gl.createTexture();
gl.bindTexture(gl.TEXTURE_2D, texture);
// 设置纹理参数
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
// 将像素数据绑定到纹理对象上
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, targetTextureWidth, targetTextureHeight, 0, gl.RGBA, gl.UNSIGNED_BYTE, pixels);
有些开发者将Shader的中间值渲染到纹理用于调试。有些软件将场景物体的ID渲染到纹理，用于物体的拾取。
3)Shadowmap
在 Shadow Mapping 中，首先需要渲染一次场景，生成深度贴图（Depth Map），这个深度贴图实际上就是一张纹理，存储了从光源视角看到的场景的深度信息。然后，再将深度贴图应用到场景中进行阴影计算。渲染到纹理是实现 Shadow Mapping 的一种基础技术。
1.3 OSG中的RTT
在 OSG 中主要有以下 4 种 buffer：
FrameBuffer。相当于一个本地缓存集合，包括颜色缓存、深度缓存、模板缓存和累积缓存，用于存放每帧的渲染数据。
Frame Buffer Object。是 OpenGL 的一个高级扩展，提供了一种渲染到目标对象的新的机制。
Pixel Buffer Objects。是窗口系统的一个扩展，实现离屏渲染，与一个不可见的窗口图形环境相似。
Vertex Buffer Object。是 OpenGL 的一个高级扩展，用于将顶点数据提交给显卡的高速缓存区，使显卡能够快速存取，以提高渲染速度。
渲染到纹理就是将当前的渲染结果（framebuffer）通过纹理的方式直接读取，这样可以在很大程度上提高渲染的性能，避免从 framebuffer 里面拷贝纹理对象，从而节省很大的内存。渲染到纹理主要用于生成动态纹理、反射效果和图像模糊等。下面通过示例程序向读者演示如何渲染到纹理。
1.4 OSG中的RTT示例
1.5 源码
#include 2、三维纹理映射
2.1 三维纹理映射介绍
三维纹理（3D texture），即体纹理（volume texture），是传统二维纹理（2D texture）在逻辑上的扩展。二维纹理是一张简单的位图图片，用于为三维模型提供表面点的颜色值；而一个三维纹理，可以被认为由很多张 2D 纹理组成，用于描述三维空间数据的图片。三维纹理通过三维纹理坐标进行访问 。
优势：使用体纹理，可以跳过为三维网格确定良好二维参数的复杂过程，因为三维位置可以直接用作纹理坐标，从而避免了二维参数化中通常会发生的变形和接缝问题。体纹理也可用于表示诸如木材或大理石的材料的体积结构。使用三维纹理实现出的这些模型，看起来会很逼真，浑然天成。
劣势：更高的储存要求，并且滤波成本更高。使用体纹理作为表面纹理会非常低效，因为三维纹理中的绝大多数样本都没起到作用。
三维纹理映射（osg::Texture3D）是一大类应用范畴的一部分，称为体纹理。三维纹理主要应用于医学领域和科学领域，笔者也未对其做深入研究，只限于简单的了解，这里也只简单介绍一下。在OsgChina 中国官方成员中，hesicong 目前主要研究这个方向。在医学领域应用程序中，三维纹理主要应用于断层计算成像（CT）和核磁共振（MRT）图像，在网上有很多相关的演示视频。当然，这里也不会向读者演示一个精妙的虚拟手术，只是作一些简单的介绍。
在实际的虚拟现实项目中，三维纹理的应用不多，它虽然能达到很好的效果，但当面对一个很大的场景时，渲染的负担是非常大的，三维纹理可能也会非常之大，它占用的内存资源也会非常多，有时即使是一个非常粗糙的三维纹理，它占用的内存也可能是普通二维纹理的 16 倍或 32 倍。如果渲染一个大的场景，就需要一个高配置的机器。
osg::Texture3D 类继承自 osg::Texture 类，封装了 OpenGL 的二维纹理函数的一些功能，但它不支持立方图纹理。在它的父类中同样有 osg::StateAttribute。因此，它同样可以通过设置渲染属性来启用三维纹理属性。到目前为止，我们已经讲解了基本的几种纹理映射，从它们的类的继承关系可以看出，它们都继承自 osg::Texture。
2.2 示例
2.3 源码
#include