我们通过这张图可以看出来,使用了法线贴图的物体表面更有细节更逼真,其实这就是发现贴图的作用,没什么钻牛角尖的。

其实表面没有凹凸的情况是因为我们把表面一直按照平整来做的,要想突出这个表面的凹凸就要用到法线贴图

到这里,我们暂停想一下,前面说的几种贴图,漫反射贴图,镜面光贴图,然后再到这个法线贴图。明白了什么?其实很简单,就是我们法线虚拟的和现实的差距就会通过这种贴图的形式来着重表现某一方面的效果。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
#version 330 core
out vec4 FragColor; in VS_OUT {
vec3 FragPos;
vec2 TexCoords;
vec3 TangentLightPos;
vec3 TangentViewPos;
vec3 TangentFragPos;
} fs_in; uniform sampler2D diffuseMap;
uniform sampler2D normalMap; uniform vec3 lightPos;
uniform vec3 viewPos; void main()
{
// obtain normal from normal m 大专栏  Opengl-法线贴图(用来细化表面的表现表现的凹凸)ap in range [0,1]
vec3 normal = texture(normalMap, fs_in.TexCoords).rgb;
// transform normal vector to range [-1,1]
normal = normalize(normal * 2.0 - 1.0); // this normal is in tangent space // get diffuse color
vec3 color = texture(diffuseMap, fs_in.TexCoords).rgb;
// ambient
vec3 ambient = 0.1 * color;
// diffuse
vec3 lightDir = normalize(fs_in.TangentLightPos - fs_in.TangentFragPos);
float diff = max(dot(lightDir, normal), 0.0);
vec3 diffuse = diff * color;
// specular
vec3 viewDir = normalize(fs_in.TangentViewPos - fs_in.TangentFragPos);
vec3 reflectDir = reflect(-lightDir, normal);
vec3 halfwayDir = normalize(lightDir + viewDir);
float spec = pow(max(dot(normal, halfwayDir), 0.0), 32.0); vec3 specular = vec3(0.2) * spec;
FragColor = vec4(ambient + diffuse + specular, 1.0);
}

这是一个法线贴图的片段着色器,我们可以看到几个关键的部分。

  1. vec3 normal = texture(normalMap, fs_in.TexCoords).rgb; 我们从法线贴图的纹理中取样像素
  2. 我们从 diffuseMap 中取样 物体纹理图片的原本像素
  3. 然后我们把normal的普通的做了综合得出了最终的FragColor

这里面还有TagnetFragPos什么的不理解没关系,它们是切线空间的一些概念


###切线空间

法线贴图中的法线向量在切线空间中,法线永远指着正z方向。切线空间是位于三角形表面之上的空间:法线相对于单个三角形的本地参考框架。它就像法线贴图向量的本地空间;它们都被定义为指向正z方向,无论最终变换到什么方向。使用一个特定的矩阵我们就能将本地/切线空寂中的法线向量转成世界或视图坐标,使它们转向到最终的贴图表面的方向。
切线空间中的T(tangent),B(Bitangent)与贴图U,V方向一致。 保存方式(T,B,N)


Normal


T(tangent)


B(Bitangent) = N*T


最终效果

Opengl-法线贴图(用来细化表面的表现表现的凹凸)的更多相关文章

  1. shader复杂与深入:Normal Map(法线贴图)1

    转自:http://www.zwqxin.com/archives/shaderglsl/review-normal-map-bump-map.htmlNormal Map法线贴图,想必每个学习计算机 ...

  2. 【Unity Shaders】学习笔记——SurfaceShader(七)法线贴图

    [Unity Shaders]学习笔记——SurfaceShader(七)法线贴图 转载请注明出处:http://www.cnblogs.com/-867259206/p/5627565.html 写 ...

  3. 法线贴图——Normal Mapping

    对于不曾学过.用过法线贴图的人来说,提到法线贴图,经常会提到的问题是什么是法线贴图?法线贴图用于解决什么问题?法线贴图的原理是什么?本文将就这三个问题阐述本人的一些见解,各位不喜勿喷!!! 谈到法线贴 ...

  4. (转)Unity3D 游戏贴图(法线贴图,漫反射贴图,高光贴图)

    原帖网址http://www.u3dpro.com/read.php?tid=207  感谢jdk900网友的辛苦编写 我们都知道,一个三维场景的画面的好坏,百分之四十取决于模型,百分之六十取决于贴图 ...

  5. 【转载】法线贴图Nomal mapping 原理

    法线贴图多用在CG动画的渲染以及游戏画面的制作上,将具有高细节的模型通过映射烘焙出法线贴图,贴在低端模型的法线贴图通道上,使之拥有法线贴图的渲染效果,却可以大大降低渲染时需要的面数和计算内容,从而达到 ...

  6. Introduction to 3D Game Programming with DirectX 12 学习笔记之 --- 第十九章:法线贴图

    原文:Introduction to 3D Game Programming with DirectX 12 学习笔记之 --- 第十九章:法线贴图 学习目标 理解为什么需要法线贴图: 学习法线贴图如 ...

  7. 【Unity Shader】六、使用法线贴图(Normal Map)的Shader

    学习资料: http://www.sikiedu.com/course/37/task/456/show# http://www.sikiedu.com/course/37/task/458/show ...

  8. DirectX11 With Windows SDK--25 法线贴图

    前言 在很早之前的纹理映射中,纹理存放的元素是像素的颜色,通过纹理坐标映射到目标像素以获取其颜色.但是我们的法向量依然只是定义在顶点上,对于三角形面内一点的法向量,也只是通过比较简单的插值法计算出相应 ...

  9. WebGL学习之法线贴图

    实际效果请看demo:纹理贴图 为了增加额外细节,提升真实感,我们使用了漫反射贴图和高光贴图,它们都是向三角形进行附加纹理.但是从光的视角来看是表面法线向量使表面被视为平坦光滑的表面.以光照算法的视角 ...

随机推荐

  1. 简单总结------redis

    一.Redis 是一个基于内存的高性能key-value数据库. 二.端口 6379 三.特点: Redis本质上是一个Key-Value类型的内存数据库,很像memcached,整个数据库统统加载在 ...

  2. GCC与gcc,g++区别

    看的Linux公社的一篇文章,觉得不错,内容复制过来了. 其实在这之前,我一直以为gcc和g++是一个东西,只是有两个不同的名字而已,今天在linux下编译一个c代码时出现了错误才找了一下gcc和g+ ...

  3. jest 测试入门(一)

    说实话,作为前端来说,单元测试,并不是一种必须的技能,但是确实一种可以让你加法的技能 之前我一个库添加了单元测试,加完之后感悟颇深,所以写下这篇文章来记录 环境搭建 一般来说,普通的库,如果没有添加 ...

  4. doc文件转txt

    doc文件转txt # -*- coding:utf-8 -*- # 安装pywin32包 http://sourceforge.net/projects/pywin32/files/pywin32/ ...

  5. virtualbox Ubuntu拒绝root用户ssh远程登录

    http://www.bcty365.com/content-122-6241-1.html

  6. C++ malloc()函数的注意点及使用示例

    1.malloc()函数的头文件是stdlib.h,其函数声明如下: void* malloc(size_t size); 其中参数size_t size表示动态内存分配空间的大小,以字节为单位. s ...

  7. 搭建rocketmq

    安装maven和java环境,此处省略.如果没有安装,请先安装maven和java环境!或者安装openjdk 首先下载rockermq官方地址:http://rocketmq.apache.org/ ...

  8. Java分层架构的使用规则

    原文章引用地址:http://blog.csdn.net/ygzk123/article/details/7816511 三层结构的程序不是说把项目分成DAL, BLL, WebUI三个模块就叫三层了 ...

  9. [LC] 271. Encode and Decode Strings

    Design an algorithm to encode a list of strings to a string. The encoded string is then sent over th ...

  10. 透过F5获取服务器真实内网IP

    渗透测试过程中,经常会遇到目标服务器使用F5 LTM做负载均衡. 如果能获取到目标服务器的真实IP地址,会给后续渗透带来一定便利. 本文既是最近渗透遇到的一点点经验分享. F5修改cookie机制 F ...