如何利用着色器精准读取OES纹理中的指定像素？

核心思路 #

通过绘制1x1的点图元，让每个片元着色器实例精准对应一个目标纹理像素，直接采样该像素的原始值，完全避免光栅化插值。具体步骤如下：

1. 准备顶点数据与顶点缓冲区 #

创建包含目标像素坐标的顶点数据，每个顶点对应一个要读取的纹理像素的归一化中心坐标（纹理采样默认以像素中心为采样点），同时给每个顶点分配唯一的屏幕位置，确保每个点在帧缓冲区中占据1x1像素空间。

比如要读取纹理第0行的0-99号像素，假设OES纹理宽度为texWidth、高度为texHeight，顶点数据构造示例：

// 每个顶点包含：屏幕位置(x,y)、纹理坐标(u,v)
struct Vertex {
    float screenX;
    float screenY;
    float texU;
    float texV;
};

Vertex vertices[100];
for (int i = 0; i < 100; i++) {
    // 屏幕位置：让点依次排列在帧缓冲区第0行，x从0到99
    vertices[i].screenX = i;
    vertices[i].screenY = 0;
    // 纹理坐标：计算第i个像素的中心归一化坐标
    vertices[i].texU = (i + 0.5f) / texWidth;
    vertices[i].texV = (0 + 0.5f) / texHeight;
}

// 创建并绑定VBO，上传顶点数据
GLuint vbo;
glGenBuffers(1, &vbo);
glBindBuffer(GL_ARRAY_BUFFER, vbo);
glBufferData(GL_ARRAY_BUFFER, sizeof(vertices), vertices, GL_STATIC_DRAW);

2. 配置着色器程序 #

顶点着色器

传递屏幕位置与纹理坐标到片元着色器，强制点大小为1像素：

attribute vec2 a_screenPos;
attribute vec2 a_texCoord;
varying vec2 v_texCoord;

void main() {
    // 将屏幕位置转换为NDC坐标（适配100x1的帧缓冲区）
    vec2 ndc = (a_screenPos / vec2(100.0, 1.0)) * 2.0 - 1.0;
    gl_Position = vec4(ndc, 0.0, 1.0);
    gl_PointSize = 1.0;
    v_texCoord = a_texCoord;
}

片元着色器

直接采样OES纹理的指定坐标，输出原始像素值：

#extension GL_OES_EGL_image_external : require
precision mediump float;
uniform samplerExternalOES u_oesTexture;
varying vec2 v_texCoord;

void main() {
    // 无插值采样目标像素
    gl_FragColor = texture2D(u_oesTexture, v_texCoord);
}

3. 关键渲染设置 #

• 关闭纹理过滤：确保采样时直接取原始像素值，避免插值

glBindTexture(GL_TEXTURE_EXTERNAL_OES, oesTextureId);
glTexParameteri(GL_TEXTURE_EXTERNAL_OES, GL_TEXTURE_MIN_FILTER, GL_NEAREST);
glTexParameteri(GL_TEXTURE_EXTERNAL_OES, GL_TEXTURE_MAG_FILTER, GL_NEAREST);
glTexParameteri(GL_TEXTURE_EXTERNAL_OES, GL_TEXTURE_WRAP_S, GL_CLAMP_TO_EDGE);
glTexParameteri(GL_TEXTURE_EXTERNAL_OES, GL_TEXTURE_WRAP_T, GL_CLAMP_TO_EDGE);

• 匹配视口尺寸：设置视口为100x1，确保每个点对应一个帧缓冲区像素

glViewport(0, 0, 100, 1);

4. 执行绘制与读取像素 #

• 绑定着色器、启用顶点属性，绘制100个点：

glUseProgram(shaderProgram);
glBindBuffer(GL_ARRAY_BUFFER, vbo);
// 设置顶点属性指针
glVertexAttribPointer(0, 2, GL_FLOAT, GL_FALSE, sizeof(Vertex), (void*)0); // a_screenPos
glVertexAttribPointer(1, 2, GL_FLOAT, GL_FALSE, sizeof(Vertex), (void*)(sizeof(float)*2)); // a_texCoord
glEnableVertexAttribArray(0);
glEnableVertexAttribArray(1);

// 绘制点图元
glDrawArrays(GL_POINTS, 0, 100);

• 从帧缓冲区读取原始像素数据：

unsigned char pixelData[400]; // 100个RGBA像素，共400字节
glReadPixels(0, 0, 100, 1, GL_RGBA, GL_UNSIGNED_BYTE, pixelData);

优化建议 #

频繁读取像素时，使用像素缓冲区对象(PBO) 异步读取，避免CPU阻塞：

// 创建PBO
GLuint pbo;
glGenBuffers(1, &pbo);
glBindBuffer(GL_PIXEL_PACK_BUFFER, pbo);
glBufferData(GL_PIXEL_PACK_BUFFER, 400, NULL, GL_STREAM_READ);

// 绘制后绑定PBO读取
glReadPixels(0, 0, 100, 1, GL_RGBA, GL_UNSIGNED_BYTE, 0);
// 映射PBO到内存获取数据
unsigned char* data = (unsigned char*)glMapBuffer(GL_PIXEL_PACK_BUFFER, GL_READ_ONLY);
memcpy(pixelData, data, 400);
glUnmapBuffer(GL_PIXEL_PACK_BUFFER);

内容的提问来源于stack exchange，提问作者fluke