OpenGL笔记十六之视图变换矩阵实验-lookAt函数

已于 2024-07-31 00:08:43 修改
阅读量1.9k 收藏 14
点赞数 13
CC 4.0 BY-SA版权
分类专栏： OpenGL笔记 文章标签： 笔记 矩阵 算法
于 2024-07-31 00:01:12 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_43297891/article/details/140809917

OpenGL笔记十六之视图变换矩阵实验-lookAt函数

—— 2024-07-30 晚上


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

code review!

文章目录

1.glm::lookAt 函数

glm::lookAt 函数是 OpenGL 数学库 GLM (OpenGL Mathematics) 中用于生成视图矩阵的函数。视图矩阵通常用于将世界坐标系转换为视图坐标系，从而模拟摄像机的视角。glm::lookAt 函数定义如下glm::lookAt 函数是 OpenGL 数学库 GLM (OpenGL Mathematics) 中用于生成视图矩阵的函数。视图矩阵通常用于将世界坐标系转换为视图坐标系，从而模拟摄像机的视角。glm::lookAt 函数定义如下：

glm::mat4 glm::lookAt(
    glm::vec3 const &eye,
    glm::vec3 const &center,
    glm::vec3 const &up
);

参数详解

  1. eye: 摄像机的位置，即视点 (View Position)。
  2. center: 摄像机观察的目标位置，即目标点 (Target Position)。
  3. up: 定义摄像机的上方向 (Up Vector)。

返回值

glm::lookAt 返回一个 glm::mat4 类型的 4x4 视图矩阵。

工作原理

glm::lookAt 函数通过以下几个步骤生成视图矩阵：

  1. 定义摄像机的坐标系：

    • Z 轴 (Forward Vector): 计算方向向量 f，即从 eye 指向 center 的向量，并归一化。
    • X 轴 (Right Vector): 计算右方向向量 s，即 f 与 up 的叉积，并归一化。
    • Y 轴 (True Up Vector): 计算新的上方向向量 u，即 s 与 f 的叉积。

  2. 构建旋转矩阵：
    通过 s、u 和 -f 生成旋转矩阵。

  3. 构建平移矩阵：
    通过 eye 的负值生成平移矩阵。

  4. 组合变换矩阵：
    将旋转矩阵和平移矩阵相乘，得到最终的视图矩阵。

视图矩阵计算的过程

glm::lookAt 函数生成的视图矩阵的输出依赖于传递的参数。假设摄像机的位置 (eye) 为 (0.0f, 0.0f, 5.0f)，目标位置 (center) 为 (0.0f, 0.0f, 0.0f)，上方向 (up) 为 (0.0f, 1.0f, 0.0f)。可以手动计算出视图矩阵，或者直接通过代码输出。这是手动计算的过程：

  1. 计算方向向量 (Forward Vector) f：

    glm::vec3 f = glm::normalize(center - eye);
// f = normalize((0, 0, 0) - (0, 0, 5)) = normalize((0, 0, -5)) = (0, 0, -1)

  2. 计算右方向向量 (Right Vector) s：

    glm::vec3 s = glm::normalize(glm::cross(f, up));
// s = normalize(cross((0, 0, -1), (0, 1, 0))) = normalize((1, 0, 0)) = (1, 0, 0)

  3. 计算新的上方向向量 (True Up Vector) u：

    glm::vec3 u = glm::cross(s, f);
// u = cross((1, 0, 0), (0, 0, -1)) = (0, 1, 0)

  4. 构建旋转矩阵：

    glm::mat4 rotation = glm::mat4(
    glm::vec4(s, 0.0f),
    glm::vec4(u, 0.0f),
    glm::vec4(-f, 0.0f),
    glm::vec4(0.0f, 0.0f, 0.0f, 1.0f)
);
// rotation = 
// [  1,  0,  0, 0 ]
// [  0,  1,  0, 0 ]
// [  0,  0,  1, 0 ]
// [  0,  0,  0, 1 ]

  5. 构建平移矩阵：

    glm::mat4 translation = glm::translate(glm::mat4(1.0f), -eye);
// translation = 
// [  1,  0,  0,  0 ]
// [  0,  1,  0,  0 ]
// [  0,  0,  1, -5 ]
// [  0,  0,  0,  1 ]

  6. 组合变换矩阵：

    glm::mat4 viewMatrix = rotation * translation;
// viewMatrix = 
// [  1,  0,  0,  0 ]
// [  0,  1,  0,  0 ]
// [  0,  0,  1, -5 ]
// [  0,  0,  0,  1 ]

输出结果

运行示例代码将生成并打印视图矩阵：

#include <glm/glm.hpp>
#include <glm/gtc/matrix_transform.hpp>
#include <iostream>

int main() {
    glm::vec3 eye(0.0f, 0.0f, 5.0f);
    glm::vec3 center(0.0f, 0.0f, 0.0f);
    glm::vec3 up(0.0f, 1.0f, 0.0f);

    glm::mat4 viewMatrix = glm::lookAt(eye, center, up);

    for (int i = 0; i < 4; ++i) {
        for (int j = 0; j < 4; ++j) {
            std::cout << viewMatrix[i][j] << " ";
        }
        std::cout << std::endl;
    }

    return 0;
}

输出如下：

1 0 0 0 
0 1 0 0 
0 0 1 -5 
0 0 0 1

这个结果与手动计算的视图矩阵一致。该矩阵将摄像机从 (0, 0, 5) 平移到原点，并保持其方向不变。

2.课程代码运行

在这里插入图片描述

在这里插入图片描述

3.vs

#version 330 core
layout (location = 0) in vec3 aPos;
layout (location = 1) in vec3 aColor;
layout (location = 2) in vec2 aUV;

out vec3 color;
out vec2 uv;

uniform mat4 transform;
uniform mat4 viewMatrix;

//aPos作为attribute（属性）传入shader
//不允许更改的
void main()
{
	vec4 position = vec4(aPos, 1.0);
	position = viewMatrix * transform * position;
	gl_Position = position;
	color = aColor;
	uv = aUV;
}

4.fs

#version 330 core
out vec4 FragColor;

in vec3 color;
in vec2 uv;

uniform sampler2D sampler;

void main()
{
  FragColor = texture(sampler, uv);
}

5.main.cpp

#include <iostream>

#include "glframework/core.h"
#include "glframework/shader.h"
#include <string>
#include <assert.h>//断言
#include "wrapper/checkError.h"
#include "application/Application.h"
#include "glframework/texture.h"

/*
*┌────────────────────────────────────────────────┐
*│　目	   标： 学习初步使用ViewMatrix
*│　讲    师： 赵新政(Carma Zhao)
*│　拆分目标：
*					-1 学习初步使用lookAt函数
*					-2 将viewMatrix加入vertexShader
*					-3 测试viewMatrix
*└────────────────────────────────────────────────┘
*/

GLuint vao;
Shader* shader = nullptr;
Texture* texture = nullptr;
glm::mat4 transform(1.0f);
glm::mat4 viewMatrix(1.0f);

void OnResize(int width, int height) {
	GL_CALL(glViewport(0, 0, width, height));
	std::cout << "OnResize" << std::endl;
}

void OnKey(int key, int action, int mods) {
	std::cout << key << std::endl;
}

void prepareVAO() {
	//1 准备positions colors
	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,
	};

	float uvs[] = {
		0.0f, 0.0f,
		1.0f, 0.0f,
		0.5f, 1.0f,
	};

	unsigned int indices[] = {
		0, 1, 2,
	};

	//2 VBO创建
	GLuint posVbo, colorVbo, uvVbo;
	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;
	glGenBuffers(1, &ebo);
	glBindBuffer(GL_ELEMENT_ARRAY_BUFFER, ebo);
	glBufferData(GL_ELEMENT_ARRAY_BUFFER, sizeof(indices), indices, GL_STATIC_DRAW);

	//4 VAO创建
	glGenVertexArrays(1, &vao);
	glBindVertexArray(vao);

	//5 绑定vbo ebo 加入属性描述信息
	//5.1 加入位置属性描述信息
	glBindBuffer(GL_ARRAY_BUFFER, posVbo);
	glEnableVertexAttribArray(0);
	glVertexAttribPointer(0, 3, GL_FLOAT, GL_FALSE, sizeof(float) * 3, (void*)0);

	//5.2 加入颜色属性描述数据
	glBindBuffer(GL_ARRAY_BUFFER, colorVbo);
	glEnableVertexAttribArray(1);
	glVertexAttribPointer(1, 3, GL_FLOAT, GL_FALSE, sizeof(float) * 3, (void*)0);

	//5.3 加入uv属性描述数据
	glBindBuffer(GL_ARRAY_BUFFER, uvVbo);
	glEnableVertexAttribArray(2);
	glVertexAttribPointer(2, 2, GL_FLOAT, GL_FALSE, sizeof(float) * 2, (void*)0);

	//5.4 加入ebo到当前的vao
	glBindBuffer(GL_ELEMENT_ARRAY_BUFFER, ebo);

	glBindVertexArray(0);
}

void prepareShader() {
	shader = new Shader("assets/shaders/vertex.glsl","assets/shaders/fragment.glsl");
}

void prepareTexture() {
	texture = new Texture("assets/textures/goku.jpg", 0);
}

void prepareCamera() {
	//lookat:生成一个viewMatrix
	//eye:当前摄像机所在的位置
	//center:当前摄像机看向的那个点
	//up:穹顶向量
	viewMatrix = glm::lookAt(glm::vec3(0.5f,0.0f,0.5f),glm::vec3(0.5f,0.0f,0.0f),glm::vec3(0.0f,1.0f,0.0f));
}

void render() {
	//执行opengl画布清理操作
	GL_CALL(glClear(GL_COLOR_BUFFER_BIT));

	//绑定当前的program
	shader->begin();
	shader->setInt("sampler", 0);
	shader->setMatrix4x4("transform", transform);
	shader->setMatrix4x4("viewMatrix", viewMatrix);

	//绑定当前的vao
	GL_CALL(glBindVertexArray(vao));

	//发出绘制指令
	GL_CALL(glDrawElements(GL_TRIANGLES, 3, GL_UNSIGNED_INT, 0));
	GL_CALL(glBindVertexArray(0));

	shader->end();
}


int main() {
	if (!app->init(800, 600)) {
		return -1;
	}

	app->setResizeCallback(OnResize);
	app->setKeyBoardCallback(OnKey);

	//设置opengl视口以及清理颜色
	GL_CALL(glViewport(0, 0, 800, 600));
	GL_CALL(glClearColor(0.2f, 0.3f, 0.3f, 1.0f));

	prepareShader();
	prepareVAO();
	prepareTexture();
	prepareCamera();

	while (app->update()) {
		render();
	}

	app->destroy();

	return 0;
}
OpenGL学习笔记 阴影映射 阴影学习（一）
linsang233的博客
07-21 763
阴影映射 阴影看了好多遍了，着实是个难以下手的东西，这次好好整理下。 Shadow Mapping 官方资料笔记 视频游戏中较多使用的一种技术是阴影贴图（shadow mapping），效果不错，而且相对容易实现。阴影贴图并不难以理解，性能也不会太低，而且非常容易扩展成更高级的算法（比如 Omnidirectional Shadow Maps和 Cascaded Shadow Maps）。 首先看看效果图 阴影映射(Shadow Mapping)背后的思路非常简单：我们以光的位置为视角进行渲染，我们能
OpenGL lookat 函数 c++
chrisfxs的专栏
07-24 3994
参考原文：http://games.greggman.com/game/webgl-3d-cameras/
OpenGL: 摄像机 (十四)
最新发布
青春有梦，且行且学习！
07-14 800
OpenGL: 摄像机 (十四)
OpenGL中LookAt矩阵的推导过程
weixin_43323610的博客
01-26 1404
这里写自定义目录标题欢迎使用Markdown编辑器新的改变功能快捷键合理的创建标题，有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能，丰富你的文章UML 图表FLowchart流程图导出与导入导出导入 欢迎使用Markdown编辑器 你好！ 这是你第一次使用 Markdown编辑器 所展示的欢迎页。如果你想学习如何使用Mar
OpenGL LookAt、Camera摄像机
可爱的猪窝
06-22 7156
摄像机/观察空间 程序执行效果 摄像机代码 // 摄像机 view = glm::lookAt(cameraPos, cameraPos + cameraFront, cameraUp); ourShader.setMat4("view", view); 实际上就是得到一个View Matrix，这样就可以传送给shader program用于计算从本地坐标系向投影坐标系、剪裁坐标系进行转换。...
OpenGL模型变换，视图变换矩阵推导过程与glm::LookAt源码解析
SakuraMashiro的博客
12-05 6385
本文将详细介绍OpenGL中的几个坐标系的概念，常见的几种变换，以及视图变换矩阵的推导过程，最后会分析下glm库视图变换矩阵的源码 首先，模型变换（Model），视图变换（View），投影变换（Projection）就是我们常说的三个特殊的矩阵，也经常被统一称为MVP矩阵，要理解他们，我们首先要理解几个坐标系的概念。 右手坐标系 右手坐标系与左手坐标系都是三维笛卡尔坐标系，他们唯一的不同在于z轴的方向，如下图，左边是左手坐标系，右边是右手坐标系 OpenGL中一般用的是右手坐标系 下面的几个坐标系则是在图形
OpenGL取景变换(视图变换)矩阵推导
登高而望远
02-13 2909
OpenGL取景变换(视图变换)矩阵推导标签（空格分隔）： OpenGL VR 游戏开发前言关于取景变换(视图变换)矩阵的推导本人查过许多资料, 包过关于openGL的和数学方面, 数学方面的资料很严谨, 推导过程环环相扣, 但是数书知识毕竟是理论, 怎么将理论变成实现的代码, 数学知识是不涉及的. 代码原理方面的知识只能查找openGL或图形学相关的资料, 但是这些资料有个缺点就是涉及数学原理的地
OpenGL学习笔记（七）：Camera 摄像机（视图变换、LookAt矩阵、Camera类的实现）
qq_39281631的博客
02-03 1903
渲染流程中，视图变换实际上是在对摄像机做变换。OpenGL本身没有摄像机Camera的概念，我们通过把场景中的所有物体向相反的方向移动来模拟出摄像机，并抽象出Camera类。
计算机图形学学习笔记.zip
11-20
首先，`LookAtTriangle.html`可能是一个示例程序，用于展示如何在WebGL中设置相机视图，通常通过`THREE.Matrix4.lookAt()`函数实现。该函数模拟了相机的位置和观察方向，让立方体可以从不同角度呈现。在3D图形中，...
golang游戏开发学习笔记-创建一个能自由探索的3D世界
qq_35488769的博客
07-02 4618
此文写作golang游戏开发学习笔记-用golang画一个随时间变化颜色的正方形之后，感兴趣可以先去那篇文章了解一些基础知识，在这篇文章里，我们将创建一个非常简单（只有三个方块）但能自由探索的的3D世界 1.参考资料 learnOpenGl 的中文翻译，使用C++实现的。 go-gl example go-gl的示例代码 2.基础概念 相关数学概念如矩阵，向量等，有兴趣的可以在网上找相关资料 纹...
OpenGL(8)之摄像机
kk君的博客
07-13 637
title: OpenGL(8)之摄像机 date: 2020-07-12 16:37 category: 图形学 tags: opengl link：OpenGL(8)之摄像机 0.前言 OpenGL本身没有摄像机概念，但是可以通过场景中的所有物体往相反方向移动的方式来模拟摄像机，产生一种我们在移动的感觉，而不是场景在移动。 1.摄像机/观察空间 摄像机/观察空间(Camera/View Space)的概念是观察的以摄像机的视角作为场景原点时，场景中所有的顶点坐标，视图矩阵把所有的世界坐标变换为相对于.
OpenGL视角LooAt及Perspective理解
09-13
OpenGL视角LooAt及Perspective理解 glm::mat4 projection = glm::perspective(fovyInRadians, aspect, zNear, zFar); void gluLookAt(GLdouble eyeX, GLdouble eyeY, GLdouble eyeZ, GLdouble centerX, GLdouble centerY, GLdouble centerZ, GLdouble upX, GLdouble upY, GLdouble upZ);
Transform.LookAt解析
热门推荐
小柯的博客
02-14 5万+
LookAt函数的定义如下 void LookAt(Transform target, Vector3 worldUp = Vector3.up); Parameters target Object to point towards worldUp Vector specifying the upward direc
模型视图变换矩阵的推导
AKGWSB 's blog
10-24 2215
图形学上课的时候，????坐在第一排划拉瑟图 ，老师突然布置了个作业：推导mv变换的矩阵。常言道上山容易下山难之用轮一时爽，造轮火葬场 ，这可把????急坏了，周末就嗯搁这埋头一顿推。推了挺久的 今天记录一下过程。 mv矩阵的目的是将世界坐标系下的坐标转到相机坐标系下，即通过世界坐标表示相机坐标。其实就是一些平移和旋转变换，然后将坐标系转换即可。所以我们要求得两个变换的矩阵： 旋转变换矩阵 平移变换矩阵 然后把两个矩阵相乘，得到最终的变换矩阵 M，这个 M 矩阵左乘世界坐标系下的齐次坐标，能够帮助我们将
第五章 opengl之摄像机
Re_view的博客
03-06 2244
第五章 opengl之摄像机
关于Opengl各种矩阵变换(MVPW)的自我理解
maskerman的专栏
07-04 2088
关于Opengl各种矩阵变换的理解 OpenGL的矩阵变换一直比较迷糊，貌似懂了又貌似不懂，今天貌似懂了过几天又貌似忘记怎么回事了，还是没有理解透彻，因此痛下决心，一定要把这个事情弄懂。经过几天的反复思考查看资料，我自己理解的结果就是：mv用来调整相机位置组成一个新坐标系，p用来在这个坐标系里面切出一块来变成-1，1之间的立方体显示，w用来把这个-1，1的立方体转到指定的视口上。如果这个不够
OpenGL入门之LookAt函数
jackyzoufeng的专栏
12-10 485
即在glm::vec3(0.0, 0.0, 3.0)这一点，观察世界坐标系原点glm::vec3(0.0, 0.0, 0.0)，摄像机上方是Y轴正方向。最近看OpenGL入门教程，在摄像机这一章，glm::lookAt函数这里卡了一下，记录一下。教程的做法是使用键盘输入更新摄像机位置，同时要保持摄像机的观察方向不变。教程中给出的解释是 摄像机位置，目标位置，世界空间中的上向量。即观察cameraPos + cameraFront这个点，2.给摄像机加入自由移动功能。
第七课，OpenGL之LookAt函数
Elsa的迷弟
08-18 1978
glm::lookAt(cameraPos, cameraPos + cameraFront, cameraUp);
理解OpenGL中的模型视图矩阵变换
dizuo的专栏
04-17 1万+
对于学习OpenGL，或者其他的API，基础的矩阵变换是最重要的。矩阵变换是重中之重。下面就拿红皮书上的最简单的demo：cube.c来说。调用函数 glMatrixMode (GL_MODELVIEW);指定修改模型视图矩阵，以后调用glLoadIdentity ();  将当前的矩阵置为单位矩阵，有利于后面的运算。下面我们假设将对创建的模型glutWireCube (1.0); 进
三维模型的OpenGL矩阵变换与视图控制
在OpenGL编程中，开发者通常需要使用OpenGL提供的矩阵操作函数和矩阵栈（Matrix Stack）来管理矩阵变换。矩阵栈用于存储和操作多个矩阵，使得变换操作更加灵活和方便。 使用OpenGL进行矩阵变换的一般步骤如下： 1....
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

一只野生的善逸

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值