MipMap概念
滤波
采样
mipmap级别判定
问题：opengl如何判定应该使用下一级的mipmap呢？
通过glsl中的求偏导函数计算变化量决定
手动实现mipmap原理
1、生成mipmap的各个级别
2、修改vertexShader使得三角形随着时间变小
**** 需要更改Filter才能够在变小的时候使用mipmap *****
#include <glad/glad.h>//glad必须在glfw头文件之前包含
#include <GLFW/glfw3.h>
#include <iostream>
#define STB_IMAGE_IMPLEMENTATION
#include "stb_image.h"
void frameBufferSizeCallbakc(GLFWwindow* window, int width, int height)
{
glViewport(0, 0, width, height);
}
void glfwKeyCallback(GLFWwindow* window, int key, int scancode, int action, int mods)
{
}
GLuint program = 0;
GLuint vao = 0;
void prepareVAO()
{
//positions
float positions[] = {
-0.5f, -0.5f, 0.0f,
0.5f, -0.5f, 0.0f,
0.0f, 0.5f, 0.0f,
};
//颜色
float colors[] = {
1.0f, 0.0f,0.0f,
0.0f, 1.0f,0.0f,
0.0f, 0.0f,1.0f,
};
//索引
unsigned int indices[] = {
0, 1, 2,
};
//uv坐标
float uvs[] = {
0.0f, 0.0f,
1.0f, 0.0f,
0.5f, 1.0f,
};
//2 VBO创建
GLuint posVbo = 0;
GLuint colorVbo = 0;
GLuint uvVbo = 0;
glGenBuffers(1, &posVbo);
glBindBuffer(GL_ARRAY_BUFFER, posVbo);
glBufferData(GL_ARRAY_BUFFER, sizeof(positions), positions, GL_STATIC_DRAW);
glGenBuffers(1, &colorVbo);
glBindBuffer(GL_ARRAY_BUFFER, colorVbo);
glBufferData(GL_ARRAY_BUFFER, sizeof(colors), colors, GL_STATIC_DRAW);
glGenBuffers(1, &uvVbo);
glBindBuffer(GL_ARRAY_BUFFER, uvVbo);
glBufferData(GL_ARRAY_BUFFER, sizeof(uvs), uvs, GL_STATIC_DRAW);
//3 EBO创建
GLuint ebo = 0;
glGenBuffers(1, &ebo);
glBindBuffer(GL_ELEMENT_ARRAY_BUFFER, ebo);
glBufferData(GL_ELEMENT_ARRAY_BUFFER, sizeof(indices), indices, GL_STATIC_DRAW);
//4 VAO创建
vao = 0;
glGenVertexArrays(1, &vao);
glBindVertexArray(vao);
//5 绑定vbo ebo 加入属性描述信息
//5.1 加入位置属性描述信息
glBindBuffer(GL_ARRAY_BUFFER, posVbo);
glEnableVertexAttribArray(0);
glVertexAttribPointer(0, 3, GL_FLOAT, GL_FALSE, 3 * sizeof(float), (void*)0);
//5.2 加入颜色属性描述信息
glBindBuffer(GL_ARRAY_BUFFER, colorVbo);
glEnableVertexAttribArray(1);
glVertexAttribPointer(1, 3, GL_FLOAT, GL_FALSE, 3 * sizeof(float), (void*)0);
//5.3 加入uv属性描述数据
glBindBuffer(GL_ARRAY_BUFFER, uvVbo);
glEnableVertexAttribArray(2);
glVertexAttribPointer(2, 2, GL_FLOAT, GL_FALSE, 2 * sizeof(float), (void*)0);
//5.2 加入ebo到当前的vao
glBindBuffer(GL_ELEMENT_ARRAY_BUFFER, ebo);
glBindVertexArray(0);
}
void prepareShader() {
//1 完成vs与fs的源代码，并且装入字符串
const char* vertexShaderSource =
"#version 330 core\n"
"layout (location = 0) in vec3 aPos;\n"
"layout (location = 1) in vec3 aColor;\n"
"layout (location = 2) in vec2 aUV;\n"
"out vec3 color;\n"
"out vec2 uv;\n"
"uniform float time;\n"
"void main()\n"
"{\n"
" float scale = 1.0/time;\n"
" vec3 sPos = aPos * scale;\n"
" gl_Position = vec4(sPos, 1.0);\n"
" color = aColor;\n"
" uv = aUV;\n"
"}\0";
const char* fragmentShaderSource =
"#version 330 core\n"
"out vec4 FragColor;\n"
"in vec3 color;\n"
"in vec2 uv;\n"
"uniform sampler2D sampler;\n"
"void main()\n"
"{\n"
" FragColor = texture(sampler, uv);\n"
"}\n\0";
//2 创建Shader程序（vs、fs）
GLuint vertex, fragment;
vertex = glCreateShader(GL_VERTEX_SHADER);
fragment = glCreateShader(GL_FRAGMENT_SHADER);
//3 为shader程序输入shader代码
glShaderSource(vertex, 1, &vertexShaderSource, NULL);
glShaderSource(fragment, 1, &fragmentShaderSource, NULL);
int success = 0;
char infoLog[1024];
//4 执行shader代码编译
glCompileShader(vertex);
//检查vertex编译结果
glGetShaderiv(vertex, GL_COMPILE_STATUS, &success);
if (!success) {
glGetShaderInfoLog(vertex, 1024, NULL, infoLog);
std::cout << "Error: SHADER COMPILE ERROR --VERTEX" << "\n" << infoLog << std::endl;
}
glCompileShader(fragment);
//检查fragment编译结果
glGetShaderiv(fragment, GL_COMPILE_STATUS, &success);
if (!success) {
glGetShaderInfoLog(fragment, 1024, NULL, infoLog);
std::cout << "Error: SHADER COMPILE ERROR --FRAGMENT" << "\n" << infoLog << std::endl;
}
//5 创建一个Program壳子
program = glCreateProgram();
//6 将vs与fs编译好的结果放到program这个壳子里
glAttachShader(program, vertex);
glAttachShader(program, fragment);
//7 执行program的链接操作，形成最终可执行shader程序
glLinkProgram(program);
//检查链接错误
glGetProgramiv(program, GL_LINK_STATUS, &success);
if (!success) {
glGetProgramInfoLog(program, 1024, NULL, infoLog);
std::cout << "Error: SHADER LINK ERROR " << "\n" << infoLog << std::endl;
}
//清理
glDeleteShader(vertex);
glDeleteShader(fragment);
}
GLuint genTexture(const char* picPath, int unitTexturt)
{
//1 stbImage 读取图片
int width, height, channels;
//--反转y轴
stbi_set_flip_vertically_on_load(true);
unsigned char* data = stbi_load(picPath, &width, &height, &channels, STBI_rgb_alpha);
//2 生成纹理并且激活单元绑定
GLuint texture = 0;
glGenTextures(1, &texture);
//--激活纹理单元--
glActiveTexture(GL_TEXTURE0 + unitTexturt);
//--绑定纹理对象--
glBindTexture(GL_TEXTURE_2D, texture);
int tmepWidth = width, tempHeight = height;
//3 传输纹理数据,开辟显存
//glTexImage2D(GL_TEXTURE_2D, 0, GL_RGBA, width, height, 0, GL_RGBA, GL_UNSIGNED_BYTE, data);
//遍历每个mipmap的层级，为每个级别的mipmap填充图片数据
for (int level = 0; true; ++level)
{
//1 将当前级别的mipmap对应的数据发往gpu端
glTexImage2D(GL_TEXTURE_2D, level, GL_RGBA, tmepWidth, tempHeight, 0, GL_RGBA, GL_UNSIGNED_BYTE, data);
//2 判断是否退出循环
if (tmepWidth == 1 && tempHeight == 1)
break;
//3 计算下一次循环的宽度/高度，除以2
tmepWidth = tmepWidth > 1 ? tmepWidth / 2 : 1;
tempHeight = tempHeight > 1 ? tempHeight / 2 : 1;
}
//***释放数据
stbi_image_free(data);
//4 设置纹理的过滤方式
glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_LINEAR);
//*****重要*****//
//GL_NEAREST:在单个mipmap上采用最邻近采样
//GL_LINEAR
//MIPMAP_LINEAR：在两层mipmap之间采用线性插值
//MIPMAP_NEAREST
glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_NEAREST_MIPMAP_LINEAR);
//5 设置纹理的包裹方式
glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_S, GL_REPEAT);//u
glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_T, GL_REPEAT);//v
return texture;
}
void prepareTextrue()
{
//GLuint grassTexture = genTexture("grass.jpg", 0);
//GLuint landTexture = genTexture("land.jpg", 1);
//GLuint noiseTexture = genTexture("noise.jpg", 2);
GLuint wallTexture = genTexture("goku.jpg", 0);
}
void render()
{
//执行opengl画布清理操作
glClear(GL_COLOR_BUFFER_BIT);
//1.绑定当前的program
glUseProgram(program);
//2 更新Uniform的时候，一定要先UserProgram
//2.1 通过名称拿到Uniform变量的位置Location
//2.2 通过Location更新Uniform变量的值
GLint time = glGetUniformLocation(program, "time");
int i = glfwGetTime();
glUniform1f(time, glfwGetTime());
GLint sampler = glGetUniformLocation(program, "sampler");
glUniform1i(sampler, 0);
//3 绑定当前的vao
glBindVertexArray(vao);
//4 发出绘制指令
//glDrawArrays(GL_TRIANGLE_STRIP, 0, 6);
glDrawElements(GL_TRIANGLES, 3, GL_UNSIGNED_INT, 0);
}
int main()
{
//初始化glfw环境
glfwInit();
//设置opengl主版本号
glfwWindowHint(GLFW_CONTEXT_VERSION_MAJOR, 3);
//设置opengl次版本号
glfwWindowHint(GLFW_CONTEXT_VERSION_MINOR, 3);
//设置opengl启用核心模式
glfwWindowHint(GLFW_OPENGL_PROFILE, GLFW_OPENGL_CORE_PROFILE);
//创建窗体对象
GLFWwindow* window = glfwCreateWindow(800, 600, "lenarnOpenGL", nullptr, nullptr);
//设置当前窗体对象为opengl的绘制舞台
glfwMakeContextCurrent(window);
//窗体大小回调
glfwSetFramebufferSizeCallback(window, frameBufferSizeCallbakc);
//键盘相应回调
glfwSetKeyCallback(window, glfwKeyCallback);
//使用glad加载所有当前版本opengl的函数
if (!gladLoadGLLoader((GLADloadproc)glfwGetProcAddress))
{
std::cout << "初始化glad失败" << std::endl;
return -1;
}
;
//设置opengl视口大小和清理颜色
glViewport(0, 0, 800, 600);
glClearColor(0.2f, 0.3f, 0.3f, 1.0f);
//shader
prepareShader();
//vao
prepareVAO();
//texture
prepareTextrue();
//执行窗体循环
while (!glfwWindowShouldClose(window))
{
//接受并分发窗体消息
//检查消息队列是否有需要处理的鼠标、键盘等消息
//如果有的话就将消息批量处理，清空队列
glfwPollEvents();
//渲染操作
render();
//切换双缓存
glfwSwapBuffers(window);
}
//推出程序前做相关清理
glfwTerminate();
return 0;
}
上述代码即可实现随着时间的变化，不同层级的图片贴到三角形中的效果。
还可以不在代码中设置层级间的采样方式 即注释掉
glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_NEAREST_MIPMAP_LINEAR);
在fs中，实现根据像素对应图素的数量多少，决定采样哪个层级的mipmap
#version 330 core
out vec4 FragColor;
in vec3 color;
in vec2 uv;
uniform sampler2D sampler;
uniform float width;
uniform float height;
void main()
{
//FragColor = texture(sampler, uv);
//1 获取当前像素对应的纹理上的纹素具体位置
vec2 location = uv * vec2(width, height);
//2 计算当前像素对应纹素具体位置在xy方向上的变化量
vec2 dx = dFdx(location);
vec2 dy = dFdy(location);
//3 选择最大的delta，求log2（delta）
float maxDelta = sqrt(max(dot(dx, dx), dot(dy,dy)));
float L = log2(maxDelta);
//4 计算出mipmap的采样级别
int level = max(int(L + 0.5), 0);
FragColor = textureLod(sampler, uv, level);
}
fs的glsl设置以上字符串，渲染时设置图片的宽度和高度即可达到同样的效果。
opengl自动生成mipmap
#include <glad/glad.h>//glad必须在glfw头文件之前包含
#include <GLFW/glfw3.h>
#include <iostream>
#define STB_IMAGE_IMPLEMENTATION
#include "stb_image.h"
void frameBufferSizeCallbakc(GLFWwindow* window, int width, int height)
{
glViewport(0, 0, width, height);
}
void glfwKeyCallback(GLFWwindow* window, int key, int scancode, int action, int mods)
{
}
GLuint program = 0;
GLuint vao = 0;
void prepareVAO()
{
//positions
float positions[] = {
-0.5f, -0.5f, 0.0f,
0.5f, -0.5f, 0.0f,
0.0f, 0.5f, 0.0f,
};
//颜色
float colors[] = {
1.0f, 0.0f,0.0f,
0.0f, 1.0f,0.0f,
0.0f, 0.0f,1.0f,
};
//索引
unsigned int indices[] = {
0, 1, 2,
};
//uv坐标
float uvs[] = {
0.0f, 0.0f,
1.0f, 0.0f,
0.5f, 1.0f,
};
//2 VBO创建
GLuint posVbo = 0;
GLuint colorVbo = 0;
GLuint uvVbo = 0;
glGenBuffers(1, &posVbo);
glBindBuffer(GL_ARRAY_BUFFER, posVbo);
glBufferData(GL_ARRAY_BUFFER, sizeof(positions), positions, GL_STATIC_DRAW);
glGenBuffers(1, &colorVbo);
glBindBuffer(GL_ARRAY_BUFFER, colorVbo);
glBufferData(GL_ARRAY_BUFFER, sizeof(colors), colors, GL_STATIC_DRAW);
glGenBuffers(1, &uvVbo);
glBindBuffer(GL_ARRAY_BUFFER, uvVbo);
glBufferData(GL_ARRAY_BUFFER, sizeof(uvs), uvs, GL_STATIC_DRAW);
//3 EBO创建
GLuint ebo = 0;
glGenBuffers(1, &ebo);
glBindBuffer(GL_ELEMENT_ARRAY_BUFFER, ebo);
glBufferData(GL_ELEMENT_ARRAY_BUFFER, sizeof(indices), indices, GL_STATIC_DRAW);
//4 VAO创建
vao = 0;
glGenVertexArrays(1, &vao);
glBindVertexArray(vao);
//5 绑定vbo ebo 加入属性描述信息
//5.1 加入位置属性描述信息
glBindBuffer(GL_ARRAY_BUFFER, posVbo);
glEnableVertexAttribArray(0);
glVertexAttribPointer(0, 3, GL_FLOAT, GL_FALSE, 3 * sizeof(float), (void*)0);
//5.2 加入颜色属性描述信息
glBindBuffer(GL_ARRAY_BUFFER, colorVbo);
glEnableVertexAttribArray(1);
glVertexAttribPointer(1, 3, GL_FLOAT, GL_FALSE, 3 * sizeof(float), (void*)0);
//5.3 加入uv属性描述数据
glBindBuffer(GL_ARRAY_BUFFER, uvVbo);
glEnableVertexAttribArray(2);
glVertexAttribPointer(2, 2, GL_FLOAT, GL_FALSE, 2 * sizeof(float), (void*)0);
//5.2 加入ebo到当前的vao
glBindBuffer(GL_ELEMENT_ARRAY_BUFFER, ebo);
glBindVertexArray(0);
}
void prepareShader() {
//1 完成vs与fs的源代码，并且装入字符串
const char* vertexShaderSource =
"#version 330 core\n"
"layout (location = 0) in vec3 aPos;\n"
"layout (location = 1) in vec3 aColor;\n"
"layout (location = 2) in vec2 aUV;\n"
"out vec3 color;\n"
"out vec2 uv;\n"
"uniform float time;\n"
"void main()\n"
"{\n"
" float scale = 1.0/time;\n"
" vec3 sPos = aPos * scale;\n"
" gl_Position = vec4(sPos, 1.0);\n"
" color = aColor;\n"
" uv = aUV;\n"
"}\0";
const char* fragmentShaderSource =
"#version 330 core\n"
"out vec4 FragColor;\n"
"in vec3 color;\n"
"in vec2 uv;\n"
"uniform sampler2D sampler;\n"
"void main()\n"
"{\n"
" FragColor = texture(sampler, uv);\n"
"}\n\0";
//2 创建Shader程序（vs、fs）
GLuint vertex, fragment;
vertex = glCreateShader(GL_VERTEX_SHADER);
fragment = glCreateShader(GL_FRAGMENT_SHADER);
//3 为shader程序输入shader代码
glShaderSource(vertex, 1, &vertexShaderSource, NULL);
glShaderSource(fragment, 1, &fragmentShaderSource, NULL);
int success = 0;
char infoLog[1024];
//4 执行shader代码编译
glCompileShader(vertex);
//检查vertex编译结果
glGetShaderiv(vertex, GL_COMPILE_STATUS, &success);
if (!success) {
glGetShaderInfoLog(vertex, 1024, NULL, infoLog);
std::cout << "Error: SHADER COMPILE ERROR --VERTEX" << "\n" << infoLog << std::endl;
}
glCompileShader(fragment);
//检查fragment编译结果
glGetShaderiv(fragment, GL_COMPILE_STATUS, &success);
if (!success) {
glGetShaderInfoLog(fragment, 1024, NULL, infoLog);
std::cout << "Error: SHADER COMPILE ERROR --FRAGMENT" << "\n" << infoLog << std::endl;
}
//5 创建一个Program壳子
program = glCreateProgram();
//6 将vs与fs编译好的结果放到program这个壳子里
glAttachShader(program, vertex);
glAttachShader(program, fragment);
//7 执行program的链接操作，形成最终可执行shader程序
glLinkProgram(program);
//检查链接错误
glGetProgramiv(program, GL_LINK_STATUS, &success);
if (!success) {
glGetProgramInfoLog(program, 1024, NULL, infoLog);
std::cout << "Error: SHADER LINK ERROR " << "\n" << infoLog << std::endl;
}
//清理
glDeleteShader(vertex);
glDeleteShader(fragment);
}
GLuint genTexture(const char* picPath, int unitTexturt)
{
//1 stbImage 读取图片
int width, height, channels;
//--反转y轴
stbi_set_flip_vertically_on_load(true);
unsigned char* data = stbi_load(picPath, &width, &height, &channels, STBI_rgb_alpha);
//2 生成纹理并且激活单元绑定
GLuint texture = 0;
glGenTextures(1, &texture);
//--激活纹理单元--
glActiveTexture(GL_TEXTURE0 + unitTexturt);
//--绑定纹理对象--
glBindTexture(GL_TEXTURE_2D, texture);
//3 传输纹理数据,开辟显存
glTexImage2D(GL_TEXTURE_2D, 0, GL_RGBA, width, height, 0, GL_RGBA, GL_UNSIGNED_BYTE, data);
//为当前纹理对象生成mipmap
glGenerateMipmap(GL_TEXTURE_2D);
//***释放数据
stbi_image_free(data);
//4 设置纹理的过滤方式
glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_LINEAR);
//*****重要*****//
//GL_NEAREST:在单个mipmap上采用最邻近采样
//GL_LINEAR
//MIPMAP_LINEAR：在两层mipmap之间采用线性插值
//MIPMAP_NEAREST
glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_NEAREST_MIPMAP_LINEAR);
//5 设置纹理的包裹方式
glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_S, GL_REPEAT);//u
glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_T, GL_REPEAT);//v
return texture;
}
void prepareTextrue()
{
//GLuint grassTexture = genTexture("grass.jpg", 0);
//GLuint landTexture = genTexture("land.jpg", 1);
//GLuint noiseTexture = genTexture("noise.jpg", 2);
GLuint wallTexture = genTexture("goku.jpg", 0);
}
void render()
{
//执行opengl画布清理操作
glClear(GL_COLOR_BUFFER_BIT);
//1.绑定当前的program
glUseProgram(program);
//2 更新Uniform的时候，一定要先UserProgram
//2.1 通过名称拿到Uniform变量的位置Location
//2.2 通过Location更新Uniform变量的值
GLint time = glGetUniformLocation(program, "time");
int i = glfwGetTime();
glUniform1f(time, glfwGetTime());
GLint sampler = glGetUniformLocation(program, "sampler");
glUniform1i(sampler, 0);
//3 绑定当前的vao
glBindVertexArray(vao);
//4 发出绘制指令
//glDrawArrays(GL_TRIANGLE_STRIP, 0, 6);
glDrawElements(GL_TRIANGLES, 3, GL_UNSIGNED_INT, 0);
}
int main()
{
//初始化glfw环境
glfwInit();
//设置opengl主版本号
glfwWindowHint(GLFW_CONTEXT_VERSION_MAJOR, 3);
//设置opengl次版本号
glfwWindowHint(GLFW_CONTEXT_VERSION_MINOR, 3);
//设置opengl启用核心模式
glfwWindowHint(GLFW_OPENGL_PROFILE, GLFW_OPENGL_CORE_PROFILE);
//创建窗体对象
GLFWwindow* window = glfwCreateWindow(800, 600, "lenarnOpenGL", nullptr, nullptr);
//设置当前窗体对象为opengl的绘制舞台
glfwMakeContextCurrent(window);
//窗体大小回调
glfwSetFramebufferSizeCallback(window, frameBufferSizeCallbakc);
//键盘相应回调
glfwSetKeyCallback(window, glfwKeyCallback);
//使用glad加载所有当前版本opengl的函数
if (!gladLoadGLLoader((GLADloadproc)glfwGetProcAddress))
{
std::cout << "初始化glad失败" << std::endl;
return -1;
}
;
//设置opengl视口大小和清理颜色
glViewport(0, 0, 800, 600);
glClearColor(0.2f, 0.3f, 0.3f, 1.0f);
//shader
prepareShader();
//vao
prepareVAO();
//texture
prepareTextrue();
//执行窗体循环
while (!glfwWindowShouldClose(window))
{
//接受并分发窗体消息
//检查消息队列是否有需要处理的鼠标、键盘等消息
//如果有的话就将消息批量处理，清空队列
glfwPollEvents();
//渲染操作
render();
//切换双缓存
glfwSwapBuffers(window);
}
//推出程序前做相关清理
glfwTerminate();
return 0;
}
587
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
