2 三角形

这个三角形难度不是一般的高!!!!



用OpenGL 3绘制复杂的物体很方便,绘制一个简单的三角形却十分麻烦。

别忘了不时地复制粘贴代码,动手调试。

如果程序启动时崩溃了,很可能是您的运行目录有误。请仔细阅读第一课中讲到的Visual Studio配置方法!原教程第一章中才有!!!!本人自己都要被乱七八糟库设置玩死了

顶点数组对象(VAO)



您得创建一个VAO,并将它设为当前对象(暂不详细展开):

GLuint VertexArrayID; //似乎是用来保存vao地址的无符号整数对象
glGenVertexArrays(1, &VertexArrayID);//请求一个一个VAO并赋值VertexArrayID
glBindVertexArray(VertexArrayID);//暂时不懂以后有机会补充

窗口创建成功后(即OpenGL上下文创建后)紧接着完成上述动作;这一步必须在其他OpenGL调用前完成。

若想进一步了解顶点数组对象(VAO)可以参考其他教程,不过VAO不是很重要。

ps:其实还有一个叫VBO的东西,根据其他资料VBO是负责储存数据用于从c++传递给opengl实现,而VAO则负责传递VBO中的数据结构和告知opengl到底VBO传递给何变量。两者共同完成数据的转移(根据下文语义,有可能是vertexbuffer所相关的变量)

屏幕坐标系



三点确定一个三角形。我们常常用“顶点”(Vertex,复数vertices)来指代3D图形学中的点。一个顶点有三个坐标:X,Y和Z。您可以这样想象这三根坐标轴:

  • X轴朝右
  • Y轴朝上
  • Z轴指向您后面(没错,是后面,不是前面)

还有更形象的方法:使用右手定则

  • 拇指代表X轴
  • 食指代表Y轴
  • 中指代表Z轴。如果您的拇指指向右边,食指指向天空,那么中指将指向您的后面。

为什么Z轴方向这么奇怪呢?简言之:因为基于右手定则的坐标系统被广泛使用了100多年,这一系统涵盖了许多实用工具,唯一的缺点就是Z方向比较别扭。

补充说明一下,您的手可以自由移动,X轴,Y轴和Z轴同样也能移动(详见后文)。

我们需要三个三维点来组成一个三角形;下面来定义一个三角形:

// An array of 3 vectors which represents 3 vertices
static const GLfloat g_vertex_buffer_data[] = {
-1.0f, -1.0f, 0.0f,
1.0f, -1.0f, 0.0f,
0.0f,? 1.0f, 0.0f,
};

第一个顶点是(-1, -1, 0)。 这意味着如果不变换该顶点,它就将显示在屏幕的(-1, -1)位置。这是什么意思呢?屏幕的原点在中间,X轴朝右,Y轴朝上。屏幕坐标如下图:

这是显卡内置的坐标系,无法改变。(-1, -1)是屏幕的左下角,(1, -1)是右下角,(0, 1)位于中上部。这个三角形占据了大部分屏幕。

绘制三角形



下一步,通过缓冲把三角形传给OpenGL:

// This will identify our vertex buffer
GLuint vertexbuffer;

// Generate 1 buffer, put the resulting identifier in vertexbuffer
glGenBuffers(1, &vertexbuffer);

// The following commands will talk about our ‘vertexbuffer‘ buffer
glBindBuffer(GL_ARRAY_BUFFER, vertexbuffer);

// Give our vertices to OpenGL.
glBufferData(GL_ARRAY_BUFFER, sizeof(g_vertex_buffer_data), g_vertex_buffer_data, GL_STATIC_DRAW);

这步操作仅需执行一次。

之前在主循环中我们什么也没绘制,现在终于可以绘制三角形了:

// 1rst attribute buffer : vertices
glEnableVertexAttribArray(0);
glBindBuffer(GL_ARRAY_BUFFER, vertexbuffer);
glVertexAttribPointer(
0,                  // attribute 0. No particular reason for 0, but must match the layout in the shader.
3,                  // size
GL_FLOAT,           // type
GL_FALSE,           // normalized?
0,                  // stride
(void*)0            // array buffer offset
);

// Draw the triangle !
glDrawArrays(GL_TRIANGLES, 0, 3); // Starting from vertex 0; 3 vertices total -> 1 triangle

glDisableVertexAttribArray(0);

结果如图(看不到也别慌哦):

白色太单调了。来看看怎么把它染成红色吧。这就要用到“着色器(Shader)”了。

着色器(Shader)(准备好受苦没!)



###编译着色器### 在最简配置下,您得有两个着色器:一个叫顶点着色器(vertex shader),它将作用于每个顶点上;另一个叫片段着色器(fragment shader),它将作用于每一个采样点。我们采用4倍抗锯齿,因此每个像素有四个采样点。

着色器编程使用GLSL(GL Shading Language),属于OpenGL的一部分。与C、Java不同,GLSL必须在运行时编译,这意味着每次启动程序时,所有的着色器将重新编译。

这两个着色器通常单独存放在文件里。本例中有SimpleFragmentShader.fragmentshaderSimpleVertexShader.vertexshader两个着色器。

扩展名无关紧要,扩展名无关紧要,扩展名无关紧要,也可以是.txt或者.glsl。

以下是加载着色器的代码。没必要完全理解,因为在程序中这些操作一般只需执行一次,结合注释能看懂就够了。其他课程代码都用到了这个函数,因此将其放在一个单独的文件中:common/loadShader.cpp。注意,着色器和缓冲对象一样不能直接访问:我们仅拥有其ID,其真正的实现隐藏在驱动程序中。

GLuint LoadShaders(const char * vertex_file_path,const char * fragment_file_path) {

// Create the shaders
GLuint VertexShaderID = glCreateShader(GL_VERTEX_SHADER);
GLuint FragmentShaderID = glCreateShader(GL_FRAGMENT_SHADER);

// Read the Vertex Shader code from the file
std::string VertexShaderCode;
std::ifstream VertexShaderStream(vertex_file_path, std::ios::in);
if(VertexShaderStream.is_open())
{
std::string Line = "";
while(getline(VertexShaderStream, Line))
VertexShaderCode += "n" + Line;
VertexShaderStream.close();
}

// Read the Fragment Shader code from the file
std::string FragmentShaderCode;
std::ifstream FragmentShaderStream(fragment_file_path, std::ios::in);
if(FragmentShaderStream.is_open()){
std::string Line = "";
while(getline(FragmentShaderStream, Line))
FragmentShaderCode += "n" + Line;
FragmentShaderStream.close();
}

GLint Result = GL_FALSE;
int InfoLogLength;

// Compile Vertex Shader
printf("Compiling shader : %sn", vertex_file_path);
char const * VertexSourcePointer = VertexShaderCode.c_str();
glShaderSource(VertexShaderID, 1, &VertexSourcePointer , NULL);
glCompileShader(VertexShaderID);

// Check Vertex Shader
glGetShaderiv(VertexShaderID, GL_COMPILE_STATUS, &Result);
glGetShaderiv(VertexShaderID, GL_INFO_LOG_LENGTH, &InfoLogLength);
std::vector VertexShaderErrorMessage(InfoLogLength);
glGetShaderInfoLog(VertexShaderID, InfoLogLength, NULL, &VertexShaderErrorMessage[0]);
fprintf(stdout, "%sn", &VertexShaderErrorMessage[0]);

// Compile Fragment Shader
printf("Compiling shader : %sn", fragment_file_path);
char const * FragmentSourcePointer = FragmentShaderCode.c_str();
glShaderSource(FragmentShaderID, 1, &FragmentSourcePointer , NULL);
glCompileShader(FragmentShaderID);

// Check Fragment Shader
glGetShaderiv(FragmentShaderID, GL_COMPILE_STATUS, &Result);
glGetShaderiv(FragmentShaderID, GL_INFO_LOG_LENGTH, &InfoLogLength);
std::vector FragmentShaderErrorMessage(InfoLogLength);
glGetShaderInfoLog(FragmentShaderID, InfoLogLength, NULL, &FragmentShaderErrorMessage[0]);
fprintf(stdout, "%sn", &FragmentShaderErrorMessage[0]);

// Link the program
fprintf(stdout, "Linking programn");
GLuint ProgramID = glCreateProgram();
glAttachShader(ProgramID, VertexShaderID);
glAttachShader(ProgramID, FragmentShaderID);
glLinkProgram(ProgramID);

// Check the program
glGetProgramiv(ProgramID, GL_LINK_STATUS, &Result);
glGetProgramiv(ProgramID, GL_INFO_LOG_LENGTH, &InfoLogLength);
std::vector ProgramErrorMessage( max(InfoLogLength, int(1)) );
glGetProgramInfoLog(ProgramID, InfoLogLength, NULL, &ProgramErrorMessage[0]);
fprintf(stdout, "%sn", &ProgramErrorMessage[0]);

glDeleteShader(VertexShaderID);
glDeleteShader(FragmentShaderID);

return ProgramID;
}

顶点着色器



先写顶点着色器。 第一行告诉编译器我们将用OpenGL 3语法。

#version 330 core

第二行声明输入数据:

layout(location = 0) in vec3 vertexPosition_modelspace;

下面详细解释这一行:

  • 在GLSL中“vec3”代表一个三维向量。类似但不等同于之前声明三角形的glm::vec3。最重要的是,如果我们在C++中使用三维向量,那么在GLSL中也要相应地使用三维向量。
  • "layout(location = 0)"指向存储vertexPosition_modelspace属性(attribute)的缓冲。每个顶点有多种属性:位置,一种或多种颜色,一个或多个纹理坐标等等。OpenGL并不清楚什么是颜色,它只能识别vec3这样的数据类型。因此我们必须将glvertexAttribPointer函数的第一个参数值赋给layout,以此告知OpenGL每个缓冲对应的是哪种属性数据。第二个参数“0”并不重要,也可以换成12(但是不能超过glGetIntegerv(GL_MAX_VERTEX_ATTRIBS, &v)),关键是C++和GLSL两边数值必须保持一致。
  • vertexPosition_modelspace”这个变量名可以任取,其中保存的是顶点位置,顶点着色器每次运行时都会用到。
  • in”表明是这是输入数据。不久我们将会看到“out”关键字。

每个顶点都会调用main函数(和C语言一样):

这里的main函数只是简单地将缓冲里的值作为顶点位置。因此如果位置是(1,1),那么三角形有一个顶点位于屏幕的右上角。 在下一课中我们将看到怎样对输入位置做一些更有趣的计算。

void main()
{
    gl_Position.xyz = vertexPosition_modelspace;
    gl_Position.w = 1.0;
}

gl_Position是仅有的几个内置变量之一:您必须对其赋值。其他操作都是可选的,我们将在第四课中看到究竟有哪些“其他操作”。

顶点着色器全代码如下

#version 330 core
layout(location = 0) in vec3 vertexPosition_modelspace;
void main()
{
    gl_Position.xyz = vertexPosition_modelspace;
    gl_Position.w = 1.0;
}

片段着色器



这就是我们的第一个片段着色器,它仅仅简单将每个片段的颜色设为红色。(记住,我们采用了4倍抗锯齿,因此每个像素有4个片段)

#version 330 core
out vec3 color;

void main()
{
    color = vec3(1,0,0);
}

vec3(1,0,0)代表红色。因为在计算机屏幕上,颜色由红、绿、蓝三元组表示。因此(1,0,0)代表纯红色,无绿、蓝分量。

汇总

在主循环之前调用LoadShaders函数:

// Create and compile our GLSL program from the shaders
GLuint programID = LoadShaders( "SimpleVertexShader.vertexshader", "SimpleFragmentShader.fragmentshader" );

首先在主循环中清屏。在进入主循环之前调用了glClearColor(0.0f, 0.0f, 0.4f, 0.0f) ,把背景色设为深蓝色。

glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);

然后让OpenGL使用您的着色器:

// Use our shader
glUseProgram(programID);

// Draw triangle...

...然后,哒哒,就看到您亲手绘制的红色三角形啦!

时间: 2024-08-21 21:47:58

2 三角形的相关文章

BZOJ2458 [BeiJing2011]最小三角形

Description Xaviera现在遇到了一个有趣的问题. 平面上有N个点,Xaviera想找出周长最小的三角形. 由于点非常多,分布也非常乱,所以Xaviera想请你来解决这个问题. 为了减小问题的难度,这里的三角形也包括共线的三点. Input 第一行包含一个整数N表示点的个数. 接下来N行每行有两个整数,表示这个点的坐标. Output 输出只有一行,包含一个6位小数,为周长最短的三角形的周长(四舍五入). Sample Input 4 1 1 2 3 3 3 3 4 Sample

Directx11学习笔记【十】 画一个简单的三角形

本篇笔记要实现的是在屏幕上渲染出一个三角形,重点要学习的是渲染一个几何体的流程方式. 为了渲染几何图形,需要一个顶点缓存和一个描述顶点布局的输入层,还有着色器(主要是顶点着色器和像素着色器),下面来看看具体Demo的实现. 新建一个Win32项目 ,新建一个类我们叫做TriangleDemo,继承自前面教程我们实现的基类Dx11DemoBase. TriangleDemo.h头文件 #pragma once #include "Dx11DemoBase.h" class Triangl

数字三角形

数字三角形必须经过某一个点,使之走的路程和最大 输入格式: 第1行n,表示n行 (n<=25), 第2到n+1行为每个的权值,第n+2行为两个数x,y表示必须经过的点 输出格式: 输出最大值 样例1 输入: 2 1 1 1 1 1 输出: 2 //11 月 23 日 2015 #include <stdio.h> int num[26][26];//存储数字三角形的权值 int route[26][2];//记录临时最优路径 int n; int s1,s2;//以特殊点分为上半段和下半

!HDU 4380 三角屋内有奇数个宝藏的三角形有多少个-计算几何-(向量叉乘&amp;线段与点的关系&amp;暴力枚举)

题意:小明要买三座房子,这三个房子构成一个三角形,已知n个房子的坐标,任何三个房子都不在一条直线上,又已知有m个宝藏的坐标,问房子构成的三角形内有奇数个宝藏的三角形有多少个.数据范围:n(3~100),m(1~1000) 分析: 简单的计算几何.记住这题的做法. 三角形内的点的个数=上面的线段下面的点的个数 -- 下面两条线段下面的点的个数(或者下面一条线段减上面两条线段,看具体位置情况,所以直接取绝对值就好) n个点有n(n-1)/2条线段,不超过1W,枚举每条线段,再枚举每个宝藏的坐标(10

三角形测试用例

某函数规定:"输入三个整数 a . b . c 分别作为三边的边长构成三角形.通过程序判定所构成的三角形的类型 ".写出该函数,并为该函数进行测试用例设计. 正常的输入 三角形有: 直角三角形 钝角三角形 锐角三角形 等腰三角形 等边三角形 等腰直角三角形 #include "my_typedef.h" INT32 triangle_function( INT32 i32l, INT32 i32m, INT32 i32n ) { INT32 temp = 0; /*

叉乘、快速排斥与跨立实验及求取三角形面积

<pre name="code" class="cpp">叉乘 (一)判断方向 (二)判断线段相交 (三)求三角形面积 (一)判断方向 叉乘的性质如下: (1). P x Q > 0; 表示P在Q的顺时针方向; (2). p x Q < 0; 表示P在Q的逆时针方向; (3). P x Q = 0; 表示P和Q是共线的 P(x1,y1),Q(x2,y2), P*Q=x1y2-x2y1 判断结果三种状态 模版为: struct point {

NYOJ 815 三角形【海伦公式】

/* 关键点:海伦公式 解题人:lingnichong 解题时间:2014-10-04 21:48:47 解题体会:海伦公式的使用 */ 三角形 时间限制:1000 ms  |  内存限制:65535 KB 难度:1 描述 在数学中,如果知道了三个点的坐标,我们就可以判断这三个点能否组成一个三角形:如果可以组成三角形,那么我们还可以求出这个三角形的面积.作为一个大学生,如果给你三个点的坐标,你能快速判断出这三个点能组成一个三角形吗?如果可以组成三角形,你能快速求出三角形的面积吗? 输入 第一行输

随机三角形平铺布局算法(iOS实现)

你是否已经看够iOS里默认给出的那些方方正正的块状和规规矩矩的陈列? 本篇给出一种随机三角形平铺布局的算法设计和实现.这种布局在规矩与随机之间做了折中,使其看上去有新鲜感又不会很乱. 本次实现重点在于布局算法的设计和实现,可以改变颜色或者添加图片. 最新源代码下载地址:https://github.com/duzixi/Varied-Layouts(持续维护,欢迎互粉) 博文首发地址:http://blog.csdn.net/duzixi 布局生成效果如下:         核心算法设计以及代码

css伪元素before/after和画三角形的搭配应用

想要实现的效果如下: 第一步:如何用css画出三角形? 1 /* css画三角形 */ 2 .sanjiao{ 3 width:0; 4 border-top:40px solid red; 5 border-bottom:40px solid green; 6 border-left:40px solid blue; 7 border-right:40px solid yellow; 8 } 9 10 <div class="sanjiao"> 11 </div&g

hdu 1249 三角形 (递推)

三角形 Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others) Total Submission(s): 4390    Accepted Submission(s): 2957 Problem Description 用N个三角形最多可以把平面分成几个区域? Input 输入数据的第一行是一个正整数T(1<=T<=10000),表示测试数据的数量.然后是T组测试数据,每组测试数据只