
OpenGL案例
案例
两水先木示
有时候,你不知不觉就完成了一个BUG!
展开
-
GAMES202 作业4 笔记
Emu_ISEavg_ISEmu_MCEavg和Emu都是计算BRDF项fms所需的参数,上面四幅图则是输出。其中_MC和_IS区别是噪声程度,注意IS是反转过后的图像,IS会经历一个重要性采样使得噪声变少。上面的一排是Kulla-Conty BRDF近似模型的,下面是Microfacet BRDF模型的。可见近似解决了因BRDF忽略微表面反射多次的能量,导致能量损失变暗的问题。...原创 2022-01-24 19:13:07 · 749 阅读 · 0 评论 -
GAMES202 作业3 笔记
直接光+间接光,基于SSR原创 2022-01-24 18:27:25 · 595 阅读 · 1 评论 -
GAMES202 作业2笔记
环境贴图原创 2022-01-24 18:25:58 · 803 阅读 · 0 评论 -
GAMES202-作业1 笔记案例
Shadow MappingPCFPCSSPCSS是在PCF基础上进行的改进,它将采样范围根据采样点深度和Blocker平均深度的相对距离进行控制缩放采样窗口,越远的可能是更小的采样范围进行PCF计算局部可见程度[0,1]数值shadow。截图没呈现出细节效果 可自己调整LIGHT_WEIGTH即PCSS的penumbra size权重。(LIGHT_WEIGHT是自定义的参数数据)PCF是针对一个采样点 进行多次比较深度和周围的像素,采样周围像素是随机的 而且要确定...原创 2022-01-22 11:37:02 · 2194 阅读 · 0 评论 -
GAMES202-作业0 笔记案例
较为坑爹的地方在修改js后,可能会没有生效,这时候只要变更端口地址8000变成其他的,比如8001即可。浏览器选择的是Microsoft官方原创 2022-01-22 10:00:38 · 866 阅读 · 0 评论 -
【OpenGL】实例渲染示例——草地渲染
Git过大无法发正确帧数的原图原理:使用glDrawArraysInstancedARB函数进行渲染1024*1024个6个顶点的三角形带,即glDrawArraysInstancedARB(GL_TRIANGLE_STRIP, 0, 6, 1024 * 1024); ,在进行这一步之前要准备好所有所需的数据,它们都被捆绑到了VAO中,有如下几个数据:1、grass_blade 草的顶点数组 总共6个组成一个由4个三角形构成的三角形带,将其存储在一个GL_ARRAY_BUFFER绑定点的缓冲区v..原创 2021-05-02 12:09:52 · 1486 阅读 · 0 评论 -
【OpenGL】实例数组的应用示例
下放代码中我们为顶点输入属性instance_color和instance_position分别用glVertexAttribDivisor(1,1)和glVertexAttribDivisor(2,1)设置为了实例数组,即它们的值会每1次实例更新一次,这2个属性对应的数组是instance_colors和instance_positions,它们都存储在square_vbo顶点缓冲区上,用glVertexAttribPointer函数指定了这3个顶点输入属性的数据长度、步长、开始索引。glVert..原创 2021-05-01 20:25:04 · 373 阅读 · 0 评论 -
【OpenGL】高级片段着色器——discard舍弃片段
在这篇文章基础上进行改进片段着色器代码,效果一样。https://blog.csdn.net/qq_39574690/article/details/116278915// Julia set renderer// Fragment Shader// Graham Sellers// OpenGL SuperBible#version 150precision highp float;out vec4 color;in vec2 initial_z;uniform sampl原创 2021-04-29 23:47:55 · 1693 阅读 · 0 评论 -
【OpenGL】高级片段着色器——在片段着色器中生成图像数据茹利亚集Julia set
茹利亚集:z(n) = z(n-1)^2 + c , z是顶点纹理坐标,c是统一值,片段着色器会迭代最大max_iterations次,其中若z值大于阈值threshold_squared则跳出,其迭代次数作为一维纹理坐标。// Perspective correction demonstration// Vertex Shader// Graham Sellers// OpenGL SuperBible#version 150precision highp float;// In..原创 2021-04-29 23:24:49 · 772 阅读 · 0 评论 -
【OpenGL】高级片段着色器——高斯模糊和索贝尔边缘检测
顶点着色器convolve.vs#version 150precision highp float;in vec2 position;out Fragment{ vec2 tex_coord;} fragment;void main(void){ gl_Position = vec4(position, 0.5, 1.0); // This produces a texture coordinate that ranges from (0.0, 0....原创 2021-04-29 00:42:19 · 1004 阅读 · 0 评论 -
【OpenGL】几何着色器——改变图元类型Normals案例
原理:为输入的三角形沿着顶点法线方向形成新的顶点,与原顶点形成线并输出,并且三角形中心点会沿着三角形法线形成线并输出,总共一个三角面会输出8个顶点,即4条线。FlatShader.fs// Normal visualizer// Fragment Shader// Graham Sellers// OpenGL SuperBible#version 150precision highp float;in Fragment{ vec4 color;} fragment..原创 2021-04-28 00:00:38 · 599 阅读 · 0 评论 -
【OpenGL】几何着色器——生成几何图形Tessellate案例
原理:从正方体的表面对角线生成一个新顶点,表面的2个三角形顶点(a,b,c)与d构成新的三角形带,并且它们顶点与原点的距离是相等的。使用归一化来达到相同距离。FlatShader.fs// Normal visualizer// Fragment Shader// Graham Sellers// OpenGL SuperBible#version 150precision highp float;in Fragment{ vec4 color;} fragment..原创 2021-04-27 23:43:58 · 459 阅读 · 0 评论 -
【OpenGL】几何着色器——Explode爆炸案例
原理:计算出法线,将顶点沿着法线方向移动自定义距离,其他不变。// Normal visualizer// Fragment Shader// Graham Sellers// OpenGL SuperBible#version 150precision highp float;in Fragment{ vec4 color;} fragment;out vec4 output_color;void main(void){ output_color =..原创 2021-04-27 23:18:20 · 727 阅读 · 0 评论 -
【OpenGL】几何着色器——Culling裁剪背面片元案例
原理:在几何着色器区分出当前输入三角面是否朝向正面,只有朝向正面的才进行EmitVertex和EndPrimitive,判断方法是求出法线和视角的点积大于0则正面否则反面。// Normal visualizer// Fragment Shader// Graham Sellers// OpenGL SuperBible#version 150precision highp float;in Fragment{ vec4 color;} fragment;out v..原创 2021-04-27 23:07:45 · 549 阅读 · 0 评论 -
【OpenGL】混合操作示例
示例完整:https://blog.csdn.net/qq_39574690/article/details/116070326演示效果:1~7的效果图如下:原创 2021-04-24 21:47:44 · 186 阅读 · 0 评论 -
【OpenGL】样本遮罩OIT示例——解决透明物体之间的渲染顺序问题
不开启OIT 仅做多重采样混合处理可见,蓝色本应在紫色后面的,但却显示在了紫色前面。(产生半透明物体顺序错乱问题,OpenGL没有Unity一样对半透明物体进行远到近渲染的,但OIT就是从GPU上对物体进行远到近渲染)开启OITOIT个人看法:将场景整个渲染到一个自定义FBO缓冲区对应的2个绑定点贴图 即 多重采样颜色图 和 多重采样深度图 (多重采样是指创建贴图时 采用了GL_TEXTURE_2D_MULTISAMPLE 参数),接着在同一个片段着色器里进行对这2个图采样多次,拿到..原创 2021-04-23 22:38:27 · 2793 阅读 · 0 评论 -
【OpenGL】多重采样案例MSAA
示例图暂缺(目前运行exe失败,后期补充)本文比较难,个人来说还不是完全弄懂。#version 150 // hdr_bloom.vs// outputs MVP transformed position // passes texture coordinates through// color is * by normal and passed on.in vec3 vVertex;in vec3 vNormal;in vec2 vTexCoord0;uniform mat.原创 2021-04-19 22:54:21 · 817 阅读 · 0 评论 -
【OpenGL】hdr_bloom 泛光示例程序
①HDRFBO分别有2个浮点纹理,其中一个纹理捆绑到第一个颜色缓冲区绑定点,第二个纹理绑定到第二个颜色缓冲区绑定点,它们的内容都交给texReplaceProg着色器(basic.vs、tex_replace.fs)渲染,着色器主要内容就是照常渲染场景输出给第一个颜色缓冲区,而第二个颜色缓冲区内容是视野中明亮区域。具体代码如下:#version 150 // tex_replace.fs// outputs 1 color using texture replace// in vec...原创 2021-04-18 23:11:32 · 449 阅读 · 0 评论 -
【OpenGL】HDR相关——hdr_imaging示例程序
第一张图是hdr_simple.fs、第二张图是hdr_exposure.fs、第三章图是hdr_adaptive.fs渲染的示例程序从一个浮点纹理读取并写入到一个帧缓冲区对象,在这个缓冲区对象中一个8位纹理被绑定到了第一个渲染目标。这样就允许从HDR到LDR的变换在逐个像素的基础上进行,减少了当一个纹理单元在明亮部分和阴暗部分之间进行插值时出现的修饰痕迹。一旦LDR图像生成,它就会作为一个纹理直接绘制到屏幕上。#version 150 // hdr.fs// Simple tex...原创 2021-04-18 22:05:26 · 689 阅读 · 0 评论 -
【OpenGL】第九章案例——控制像素着色器表现,映射片段输出
基础案例:https://blog.csdn.net/qq_39574690/article/details/115605165#version 150 // multibuffer_frag_location.fs// outputs to 3 buffers: normal color, greyscale, // and luminance adjusted colorin vec4 vFragColor; in vec2 vTexCoord; uniform int bUs..原创 2021-04-17 19:37:31 · 370 阅读 · 0 评论 -
【OpenGL】FBO渲染到纹理案例
1、使用用户FBO通过一系列操作从相对于镜面的反向照相机开始渲染场景地形和旋转中的甜甜圈以及代表反向照相机的蓝色圆筒,将其渲染结果存储到mirrorTexture(FBO映射目标就是GL_COLOR_ATTACHMENT0 这个纹理捆绑点)2、重置FBO后,再次从真正的照相机视角来绘制场景地形和旋转的甜甜圈以及绘制镜面,并镜面会判断照相机是否能看到镜面来决定是否渲染出镜面画面(即mirrorTexture),若无法看到则渲染黑色镜面。需要注意的是,虽然在第一步也渲染了场景,但此时的场景是输出..原创 2021-04-11 21:43:47 · 801 阅读 · 0 评论 -
【OpenGL】FBO案例
// Multibuffer vs// Vertex Shader// Richard S. Wright Jr.// OpenGL SuperBible#version 330in vec4 vVertex;in vec3 vNormal;in vec4 texCoord0;uniform mat4 mvpMatrix;uniform mat4 mvMatrix;uniform mat4 pMatrix;uniform vec3 vLightPos;uniform vec...原创 2021-04-11 20:05:03 · 522 阅读 · 0 评论 -
【OpenGL】PBO像素缓冲区对象案例——运动模糊
原理:用PBO进行缓存最后5帧图像并与当前图像混合。关于这篇顶点着色器代码是我自己写的,因为案例不全,bmp图片也没有 故直接用之前的stone.tga加载了。试验结果发现PBO和传统方式的fps差不多一样。。// MoonShader// Vertex Shader// Richard S. Wright Jr.// OpenGL SuperBible#version 150in vec4 vVertex;in vec4 texCoord0;uniform mat4 mvp原创 2021-04-11 14:00:37 · 610 阅读 · 0 评论 -
【OpenGL】纹理数组案例
在第三章节Smoother示例程序基础上,加多了一个月亮的渲染,它会用29个纹理图经过一定时间切换图片,进行循环播放动画一样。属于第七章内容——高级纹理// TextureArrays.cpp// OpenGL SuperBible// Demonstrates Passing a TextureArray to a shader// Program by Richard S. Wright Jr.#pragma comment(lib, "gltools.lib")#include ...原创 2021-04-10 22:05:30 · 512 阅读 · 0 评论 -
【OpenGL】点精灵案例——模拟宇宙星光(外加点旋转)
在上一个版本基础上,进行了点的旋转,与书籍说的不同我传入的是一个uniform 统一值作为angle。并且去掉了const,因为我在GLSL代码做了一个对angle实时更新操作,故不再是常量,我想矩阵可能会插值 但影响好像没有,除此之外其他地方没啥变化。// SpaceFlight Shader// Vertex Shader// Richard S. Wright Jr.// OpenGL SuperBible#version 330// Incoming per vertex.....原创 2021-04-09 23:34:02 · 484 阅读 · 3 评论 -
【OpenGL】点精灵案例——模拟宇宙星光
glEnable(GL_POINT_SPRITE); //开启点精灵 在书籍上没有提及但代码里写有,可能旧版需要这样做,新版不需要。// SpaceFlight Shader// Vertex Shader// Richard S. Wright Jr.// OpenGL SuperBible#version 130// Incoming per vertex... position and normalin vec4 vVertex;in vec4 vColor;unifo...原创 2021-04-09 22:06:39 · 869 阅读 · 0 评论 -
【OpenGL】多重纹理案例
代码在立方体案例基础上,使用了第二个纹理进行混合反射球体颜色。主要代码: // Set textures to their texture units glActiveTexture(GL_TEXTURE1); glBindTexture(GL_TEXTURE_2D, tarnishTexture); glActiveTexture(GL_TEXTURE0); glBindTexture(GL_TEXTURE_CUBE_MAP, cubeTexture);当前纹理单元切到第二个纹理单..原创 2021-04-08 23:48:25 · 437 阅读 · 0 评论 -
【OpenGL】立方体贴图——Cubemap天空盒案例
核心内容:gltMakeCube(cubeBatch, 20.0); //创建一个半径为20个单位长度的立方体批次数据填充到cubeBatch (GLBatch对象)该函数会将2D纹理坐标分配到GLT_ATTRIBUTE_TEXTURE0属性槽,但我们需要的并不是2D纹理坐标,而是3D纹理坐标。3D纹理坐标获取方法是在顶点着色器里直接将归一化的顶点坐标作为输出到片段着色器,此时片段着色器插值得到的顶点坐标就是三维纹理坐标了,接着在片段着色器使用texture(samplerCube纹理对象, 三..原创 2021-04-08 00:04:54 · 1242 阅读 · 1 评论 -
【OpenGL】7-1矩形纹理案例
// Rectangle Texture (replace) Shader// Vertex Shader// Richard S. Wright Jr.// OpenGL SuperBible#version 140// Incoming per vertex... position and texture coordinatein vec4 vVertex;in vec2 vTexCoord;uniform mat4 mvpMatrix;// Texture Coor...原创 2021-04-06 23:38:59 · 367 阅读 · 0 评论 -
【OpenGL】卡通着色(Cell Shading)——将纹理单元作为光线
原理就是一维渐变纹理,将漫反射系数作为纹理坐标(x,y)从一维纹理采样得到拥有漫反射因子的光线强度颜色(即颜色带上了漫反射的影响)// Cell lighting Shader// Vertex Shader// Richard S. Wright Jr.// OpenGL SuperBible#version 130// Incoming per vertex... position and normalin vec4 vVertex;in vec3 vNormal;smo...原创 2021-04-05 14:51:21 · 681 阅读 · 0 评论 -
【OpenGL】丢弃片段——消融案例
// ADS Point lighting Shader// Vertex Shader// Richard S. Wright Jr.// OpenGL SuperBible#version 130// Incoming per vertex... position and normalin vec4 vVertex;in vec3 vNormal;in vec2 vTexCoords0;uniform mat4 mvpMatrix;uniform mat4 mv...原创 2021-04-05 14:40:50 · 247 阅读 · 0 评论 -
【OpenGL】照亮纹理单元
在ADSPhong着色器基础上进行增加纹理采样,用纹理颜色值乘以光线强度// ADS Point lighting Shader// Vertex Shader// Richard S. Wright Jr.// OpenGL SuperBible#version 130// Incoming per vertex... position and normalin vec4 vVertex;in vec3 vNormal;in vec4 vTexture0;uniform ...原创 2021-04-05 13:57:26 · 171 阅读 · 0 评论 -
【OpenGL】只有纹理单元TexturedTriangle测试案例
需准备一张.tga纹理// The TexturedIdentity Shader// Vertex Shader// Richard S. Wright Jr.// OpenGL SuperBible#version 130in vec4 vVertex;in vec2 vTexCoords;smooth out vec2 vVaryingTexCoords;void main(void) { vVaryingTexCoords = vTexCoords..原创 2021-04-05 13:45:45 · 193 阅读 · 0 评论 -
【OpenGL】Phone着色案例
案例在前一个基础上将计算过程放到了片段着色器,来增强细节处理。// ADS Point lighting Shader// Vertex Shader// Richard S. Wright Jr.// OpenGL SuperBible#version 130// Incoming per vertex... position and normalin vec4 vVertex;in vec3 vNormal;uniform mat4 mvpMatrix;unifor..原创 2021-04-05 13:31:53 · 398 阅读 · 0 评论 -
【OpenGL】ADS光照模型
ADS是Ambient、Diffuse、Specular意思,用环境光、漫反射、高光反射进行渲染物体。uniform vec3 vAmbientMaterial;uniform vec3 vAmbientLight;vec3 vAmbientColor = vAmbientMaterial * vAmbientLight; //即环境光颜色 * 环境光亮度 得到环境光颜色uniform vec3 vDiffuseMaterial;uniform vec3 vDiffuseLight;f...原创 2021-04-05 13:25:09 · 581 阅读 · 0 评论 -
【OpenGL】点光源漫反射着色器
顶点着色器代码:// Simple Diffuse lighting Shader// Vertex Shader// Richard S. Wright Jr.// OpenGL SuperBible#version 130// Incoming per vertex... position and normalin vec4 vVertex;in vec3 vNormal;// Set per batchuniform vec4 diffuseColor; unifo...原创 2021-04-05 11:42:51 · 396 阅读 · 0 评论 -
【OpenGL】平面着色器实例代码
// FlatShader.cpp// OpenGL SuperBible// Demonstrates a simple flat shader with transformations// Program by Richard S. Wright Jr.#pragma comment(lib, "gltools.lib")#include <GLTools.h> // OpenGL toolkit#include <GLMatrixStack.h>#incl...原创 2021-04-02 00:11:31 · 299 阅读 · 0 评论 -
【OpenGL】纹理压缩案例
球体世界:地面效果是先渲染了反转的场景,然后再上面渲染大理石地板,并用一个Alpha值与背景进行混合,然后再渲染正常的场景达到了这种效果。新的内容在LoadTGA函数,内部格式参数用了通用压缩纹理格式GL_COMPRESSED_RGB 即glTexImage2D(GL_TEXTURE_2D, 0, GL_COMPRESSED_RGB, nWidth, nHeight, 0, eFormat, GL_UNSIGNED_BYTE, pBits); 其他代码都是我们已经学过的内容。// Sphere原创 2021-03-28 15:46:01 · 555 阅读 · 0 评论 -
【OpenGL】各向异性过滤案例
// Tunnel.cpp// Demonstrates mipmapping and using texture objects// OpenGL SuperBible// Richard S. Wright Jr.#pragma comment(lib,"gltools.lib")#include <GLTools.h>#include <GLShaderManager.h>#include <GLFrustum.h>#include <...原创 2021-03-28 15:39:22 · 2394 阅读 · 0 评论 -
【OpenGL】活动的Mip贴图 Tunnel实例
GL_NEAREST ,可右键出现菜单选中不同的过滤方式观察案例有3个纹理对象,分别渲染天花板、地面和墙体,在SetupRC函数有进行分配纹理对象3个,并进行循环3次执行不同纹理对象的捆绑到2D纹理状态且加载纹理设置过滤器和环绕模式,生成Mip贴图。注意:每一次循环进行的加载纹理和设置纹理参数都是应用于它对应的纹理对象,而纹理对象会捆绑到2D纹理状态。即一种纹理状态(2D纹理状态)对应了三个纹理对象,循环结束后是最后一个纹理对象捆绑2D纹理状态,即TEXTURE_CEILING标识的纹理对象。在之后进.原创 2021-03-27 23:28:00 · 283 阅读 · 0 评论