OpenGL笔记十七之正交投影变更实行-glm::ortho函数

宝塔山  金牌会员 | 2024-9-22 06:20:25 | 显示全部楼层 | 阅读模式
打印 上一主题 下一主题
楼主

主题 862|帖子 862|积分 2586

OpenGL笔记十七之正交投影变更实行-glm:rtho函数


—— 2024-07-30 晚上

bilibili赵新政老师的教程看后笔记
code review!

  
1.glm:rtho函数

glm:rtho 函数是 OpenGL 数学库 GLM (OpenGL Mathematics) 中用于天生正交投影矩阵的函数。正交投影矩阵在渲染2D场景或需要保持对象真实尺寸的3D场景时非常有用。glm:rtho 函数的定义如下：
  1. glm::mat4 glm::ortho(
  2.     float left,
  3.     float right,
  4.     float bottom,
  5.     float top,
  6.     float zNear,
  7.     float zFar
  8. );
复制代码
参数详解


  • left: 视锥体的左边界。
  • right: 视锥体的右边界。
  • bottom: 视锥体的下边界。
  • top: 视锥体的上边界。
  • zNear: 视锥体的近剪裁面。
  • zFar: 视锥体的远剪裁面。
返回值

glm:rtho 返回一个 glm::mat4 类型的 4x4 正交投影矩阵。
工作原理

正交投影矩阵用于将3D坐标转换为2D屏幕坐标，它不会像透视投影矩阵那样产生间隔缩放效果。正交投影矩阵的天生通过以下步骤实现：

  • 缩放变更：

    • 将对象的坐标从视锥体的范围 [left, right] 映射到标准扮装备坐标的范围 [-1, 1]。
    • 同理，将对象的坐标从 [bottom, top] 和 [zNear, zFar] 映射到 [-1, 1]。

  • 平移变更：

    • 将对象的中央移到原点。

正交投影矩阵公式

正交投影矩阵的公式如下：

示例代码

以下是一个现实使用 glm:rtho 函数的示例：
  1. #include <glm/glm.hpp>
  2. #include <glm/gtc/matrix_transform.hpp>
  3. #include <iostream>
  5. int main() {
  6.     float left = -1.0f;
  7.     float right = 1.0f;
  8.     float bottom = -1.0f;
  9.     float top = 1.0f;
  10.     float zNear = 0.1f;
  11.     float zFar = 100.0f;
  13.     glm::mat4 orthoMatrix = glm::ortho(left, right, bottom, top, zNear, zFar);
  15.     // 打印正交投影矩阵
  16.     for (int i = 0; i < 4; ++i) {
  17.         for (int j = 0; j < 4; ++j) {
  18.             std::cout << orthoMatrix[i][j] << " ";
  19.         }
  20.         std::cout << std::endl;
  21.     }
  23.     return 0;
  24. }
复制代码
输出结果

运行上述代码将天生并打印正交投影矩阵，输出如下：
  1. 1 0 0 0
  2. 0 1 0 0
  3. 0 0 -0.0200202 -1.002
  4. 0 0 0 1
复制代码
解释



  • 第一行和第二行: 映射 x 和 y 坐标范围从 [-1, 1] 到 [-1, 1]，由于 left = -1, right = 1, bottom = -1, top = 1。
  • 第三行: 映射 z 坐标范围从 0.1 到 100 到 -1 到 1。
  • 第四行: 齐次坐标。
通过明确 glm:rtho 函数的原理和使用方法，可以方便地在 OpenGL 程序中实现正交投影，从而渲染出符合预期的2D或3D场景。
2.实行一：使用glm的ortho函数

NDC坐标
  1. viewMatrix = glm::lookAt(glm::vec3(0.0f,0.0f,1.0f),glm::vec3(0.0f,0.0f,0.0f),glm::vec3(0.0f,1.0f,0.0f));
  3. orthoMatrix = glm::ortho(-2.0f, 2.0f, -2.0f, 2.0f, 2.0f, -2.0f);
  5. float positions[] = {
  6.         -0.5f, -0.5f, 0.0f,
  7.         0.5f, -0.5f, 0.0f,
  8.         0.0f,  0.5f, 0.0f,
  9. };
复制代码
运行

2.实行二：使用非NDC数据


  1. viewMatrix = glm::lookAt(glm::vec3(0.0f,0.0f,1.0f),glm::vec3(0.0f,0.0f,0.0f),glm::vec3(0.0f,1.0f,0.0f));
  3. orthoMatrix = glm::ortho(-2.0f, 2.0f, -2.0f, 2.0f, 2.0f, -2.0f);
  5. float positions[] = {
  6.         -1.0f, 0.0f, 0.0f,
  7.         1.0f, 0.0f, 0.0f,
  8.         0.0f,  1.0f, 0.0f,
  9. };
复制代码
运行

3.实行三：将顶点向世界坐标系的-z方向推进较大范围（-5）(剪裁）

  1. float positions[] = {
  2.         -1.0f, 0.0f, -5.0f,
  3.         1.0f, 0.0f, -5.0f,
  4.         0.0f,  1.0f, -5.0f,
  5. };
复制代码
运行

4.实行四：将可视范围盒子向相机坐标系的+x方向推进1个单元

  1. orthoMatrix = glm::ortho(-1.0f, 3.0f, -2.0f, 2.0f, 2.0f, -2.0f);float positions[] = {
  2.         -1.0f, 0.0f, -5.0f,
  3.         1.0f, 0.0f, -5.0f,
  4.         0.0f,  1.0f, -5.0f,
  5. };
复制代码
运行

5.实行五：保持可视范围盒子不动，动相机(1.0,0.0,0.1)

  1. viewMatrix = glm::lookAt(glm::vec3(1.0f,0.0f,0.1f),glm::vec3(0.0f,0.0f,0.0f),glm::vec3(0.0f,1.0f,0.0f));
  3. orthoMatrix = glm::ortho(-2.0f, 2.0f, -2.0f, 2.0f, 2.0f, -2.0f);
  5. float positions[] = {
  6.         -1.0f, 0.0f, 0.0f,
  7.         1.0f, 0.0f, 0.0f,
  8.         0.0f,  1.0f, 0.0f,
  9. };
复制代码
运行

5.实行六：保持可视范围盒子不动，动相机(1.0,0.0,1.0-剪裁)

  1. viewMatrix = glm::lookAt(glm::vec3(1.0f,0.0f,1.0f),glm::vec3(0.0f,0.0f,0.0f),glm::vec3(0.0f,1.0f,0.0f));
  3. orthoMatrix = glm::ortho(-2.0f, 2.0f, -2.0f, 2.0f, 2.0f, -2.0f);
  5. float positions[] = {
  6.         -1.0f, 0.0f, 0.0f,
  7.         1.0f, 0.0f, 0.0f,
  8.         0.0f,  1.0f, 0.0f,
  9. };
复制代码
运行

6.vs

  1. #version 330 core
  2. layout (location = 0) in vec3 aPos;
  3. layout (location = 1) in vec3 aColor;
  4. layout (location = 2) in vec2 aUV;
  6. out vec3 color;
  7. out vec2 uv;
  9. uniform mat4 transform;
  10. uniform mat4 viewMatrix;
  11. uniform mat4 projectionMatrix;
  13. //aPos作为attribute（属性）传入shader
  14. //不允许更改的
  15. void main()
  16. {
  17.         vec4 position = vec4(aPos, 1.0);
  18.         position = projectionMatrix * viewMatrix * transform * position;
  19.         gl_Position = position;
  20.         color = aColor;
  21.         uv = aUV;
  22. }
复制代码
7.fs

  1. #version 330 core
  2. out vec4 FragColor;
  4. in vec3 color;
  5. in vec2 uv;
  7. uniform sampler2D sampler;
  9. void main()
  10. {
  11.   FragColor = texture(sampler, uv);
  12. }
复制代码
8.main.cpp

  1. #include <iostream>
  3. #include "glframework/core.h"
  4. #include "glframework/shader.h"
  5. #include <string>
  6. #include <assert.h>//断言
  7. #include "wrapper/checkError.h"
  8. #include "application/Application.h"
  9. #include "glframework/texture.h"
  11. /*
  12. *┌────────────────────────────────────────────────┐
  13. *│　目           标： 学习使用正交投影矩阵
  14. *│　讲    师： 赵新政(Carma Zhao)
  15. *│　拆分目标：
  16. *                                -1 学会使用glm的ortho函数 （orthographic）
  17.                                         ***ortho的数据是摄像机坐标系下***
  18.                                         1.1 使用glm的ortho函数，生成了一个正交投影矩阵       
  19.                                                 此矩阵的作用是：生成一个投影盒子，将内部顶点转化到NDC坐标系
  20.                                         1.2 在vertexShader当中，添加了projectionMatrix的uniform变量       
  21.                                         1.3 在每一帧渲染之前，更新projectionMatrix这个uniform
  22.                                        
  23. *                                -2 学习使用非NDC数据
  24. *                                        1 按照标准案例进行构建（ppt上）
  25. *                                        2 将顶点向世界坐标系的-z方向推进较大范围（-5）(剪裁）
  26. *                                        3 将可视范围盒子向相机坐标系的+x方向推进1个单位
  27. *                                        4 保持可视范围盒子不动，动相机(1.0,0.0,0.1)(1.0,0.0,1.0-剪裁)
  28. *
  29. *                                -3 理解剪裁
  30. *└────────────────────────────────────────────────┘
  31. */
  33. GLuint vao;
  34. Shader* shader = nullptr;
  35. Texture* texture = nullptr;
  36. glm::mat4 transform(1.0f);
  37. glm::mat4 viewMatrix(1.0f);
  38. glm::mat4 orthoMatrix(1.0f);
  40. void OnResize(int width, int height) {
  41.         GL_CALL(glViewport(0, 0, width, height));
  42.         std::cout << "OnResize" << std::endl;
  43. }
  45. void OnKey(int key, int action, int mods) {
  46.         std::cout << key << std::endl;
  47. }
  49. void prepareVAO() {
  50.         //1 准备positions colors
  51.         // float positions[] = {
  52.         //         -0.5f, -0.5f, 0.0f,
  53.         //         0.5f, -0.5f, 0.0f,
  54.         //         0.0f,  0.5f, 0.0f,
  55.         // };
  56.         float positions[] = {
  57.                 -1.0f, 0.0f, 0.0f,
  58.                 1.0f, 0.0f, 0.0f,
  59.                 0.0f,  1.0f, 0.0f,
  60.         };
  63.         float colors[] = {
  64.                 1.0f, 0.0f,0.0f,
  65.                 0.0f, 1.0f,0.0f,
  66.                 0.0f, 0.0f,1.0f,
  67.         };
  69.         float uvs[] = {
  70.                 0.0f, 0.0f,
  71.                 1.0f, 0.0f,
  72.                 0.5f, 1.0f,
  73.         };
  75.         unsigned int indices[] = {
  76.                 0, 1, 2,
  77.         };
  79.         //2 VBO创建
  80.         GLuint posVbo, colorVbo, uvVbo;
  81.         glGenBuffers(1, &posVbo);
  82.         glBindBuffer(GL_ARRAY_BUFFER, posVbo);
  83.         glBufferData(GL_ARRAY_BUFFER, sizeof(positions), positions, GL_STATIC_DRAW);
  85.         glGenBuffers(1, &colorVbo);
  86.         glBindBuffer(GL_ARRAY_BUFFER, colorVbo);
  87.         glBufferData(GL_ARRAY_BUFFER, sizeof(colors), colors, GL_STATIC_DRAW);
  89.         glGenBuffers(1, &uvVbo);
  90.         glBindBuffer(GL_ARRAY_BUFFER, uvVbo);
  91.         glBufferData(GL_ARRAY_BUFFER, sizeof(uvs), uvs, GL_STATIC_DRAW);
  93.         //3 EBO创建
  94.         GLuint ebo;
  95.         glGenBuffers(1, &ebo);
  96.         glBindBuffer(GL_ELEMENT_ARRAY_BUFFER, ebo);
  97.         glBufferData(GL_ELEMENT_ARRAY_BUFFER, sizeof(indices), indices, GL_STATIC_DRAW);
  99.         //4 VAO创建
  100.         glGenVertexArrays(1, &vao);
  101.         glBindVertexArray(vao);
  103.         //5 绑定vbo ebo 加入属性描述信息
  104.         //5.1 加入位置属性描述信息
  105.         glBindBuffer(GL_ARRAY_BUFFER, posVbo);
  106.         glEnableVertexAttribArray(0);
  107.         glVertexAttribPointer(0, 3, GL_FLOAT, GL_FALSE, sizeof(float) * 3, (void*)0);
  109.         //5.2 加入颜色属性描述数据
  110.         glBindBuffer(GL_ARRAY_BUFFER, colorVbo);
  111.         glEnableVertexAttribArray(1);
  112.         glVertexAttribPointer(1, 3, GL_FLOAT, GL_FALSE, sizeof(float) * 3, (void*)0);
  114.         //5.3 加入uv属性描述数据
  115.         glBindBuffer(GL_ARRAY_BUFFER, uvVbo);
  116.         glEnableVertexAttribArray(2);
  117.         glVertexAttribPointer(2, 2, GL_FLOAT, GL_FALSE, sizeof(float) * 2, (void*)0);
  119.         //5.4 加入ebo到当前的vao
  120.         glBindBuffer(GL_ELEMENT_ARRAY_BUFFER, ebo);
  122.         glBindVertexArray(0);
  123. }
  125. void prepareShader() {
  126.         shader = new Shader("assets/shaders/vertex.glsl","assets/shaders/fragment.glsl");
  127. }
  129. void prepareTexture() {
  130.         texture = new Texture("assets/textures/goku.jpg", 0);
  131. }
  133. void prepareCamera() {
  134.         //lookat:生成一个viewMatrix
  135.         //eye:当前摄像机所在的位置
  136.         //center:当前摄像机看向的那个点
  137.         //up:穹顶向量
  138.         viewMatrix = glm::lookAt(glm::vec3(1.0f,0.0f,1.0f),glm::vec3(0.0f,0.0f,0.0f),glm::vec3(0.0f,1.0f,0.0f));
  139.         // viewMatrix = glm::lookAt(glm::vec3(1.0f,0.0f,0.1f),glm::vec3(0.0f,0.0f,0.0f),glm::vec3(0.0f,1.0f,0.0f));
  140.         // viewMatrix = glm::lookAt(glm::vec3(0.0f,0.0f,1.0f),glm::vec3(0.0f,0.0f,0.0f),glm::vec3(0.0f,1.0f,0.0f));
  141. }
  143. void prepareOrtho() {
  144.         orthoMatrix = glm::ortho(-2.0f, 2.0f, -2.0f, 2.0f, 2.0f, -2.0f);
  145. }
  147. void render() {
  148.         //执行opengl画布清理操作
  149.         GL_CALL(glClear(GL_COLOR_BUFFER_BIT));
  151.         //绑定当前的program
  152.         shader->begin();
  153.         shader->setInt("sampler", 0);
  154.         shader->setMatrix4x4("transform", transform);
  155.         shader->setMatrix4x4("viewMatrix", viewMatrix);
  156.         shader->setMatrix4x4("projectionMatrix", orthoMatrix);
  158.         //绑定当前的vao
  159.         GL_CALL(glBindVertexArray(vao));
  161.         //发出绘制指令
  162.         GL_CALL(glDrawElements(GL_TRIANGLES, 3, GL_UNSIGNED_INT, 0));
  163.         GL_CALL(glBindVertexArray(0));
  165.         shader->end();
  166. }
  169. int main() {
  170.         if (!app->init(800, 600)) {
  171.                 return -1;
  172.         }
  174.         app->setResizeCallback(OnResize);
  175.         app->setKeyBoardCallback(OnKey);
  177.         //设置opengl视口以及清理颜色
  178.         GL_CALL(glViewport(0, 0, 800, 600));
  179.         GL_CALL(glClearColor(0.2f, 0.3f, 0.3f, 1.0f));
  181.         prepareShader();
  182.         prepareVAO();
  183.         prepareTexture();
  184.         prepareCamera();
  185.         prepareOrtho();
  187.         while (app->update()) {
  188.                 render();
  189.         }
  191.         app->destroy();
  193.         return 0;
  194. }
复制代码
免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。

本帖子中包含更多资源

您需要 登录 才可以下载或查看，没有账号？立即注册

x
回复

使用道具 举报

0 个回复

正序浏览
返回列表

快速回复

高级模式
B Color Image Link Quote Code Smilies
您需要登录后才可以回帖 登录 or 立即注册

本版积分规则

宝塔山

金牌会员
这个人很懒什么都没写!

楼主热帖

标签云

挺好的 服务器
微信订阅号
微信服务号
微信客服
小程序
H5
关于我们 商务合作 网站地图
©Copyright 2022-2024 杭州祥升科技有限公司 版权所有 浙ICP备20004199号
快速回复 返回顶部 返回列表