前言

视差贴图技术是相对于传统的法线贴图技术所做的一项改进

视察贴图技术可以给场景里要渲染的游戏物体增加物体表面的凹凸细节,在过去为了表现物体的表面细节,通常会使用法线贴图,那么为什么又要使用视差贴图呢?它跟法线贴图有什么区别呢?下面来为大家讲解

版权声明

  • 本文为“优梦创客”原创文章,您可以自由转载,但必须加入完整的版权声明
  • 更多学习资源请加QQ:1517069595或WX:alice17173获取(企业级性能优化/热更新/Shader特效/服务器/商业项目实战/每周直播/一对一指导)
  • 点赞、关注、分享可免费获得配套学习资源
  • 点击观看完整视频

文章目录

  • 前言
  • 版权声明
  • 视差贴图与其他贴图
  • 视差映射算法的各种效果
  • 视差贴图究竟长什么样
  • 如何表现物体表面凹凸
  • 思考
  • 写在最后

视差贴图与其他贴图

  • 上图是本文的封面,封面上的三张图片是采用不同渲染方法渲染出的墙体

    • 最左边的图片是不采用任何增加表面细节的方法渲染出的墙体

      • 它虽然有一张基本的细节贴图,但这张贴图并不能够真实的反映物体表面的凹凸细节
    • 中间的图片贴了一张法线贴图
      • 法线贴图可以增加物体表面的凹凸感,所以可以明显看出中间的墙体比左边墙体有更多的凹凸细节
    • 第三个图片是在法线贴图的基础上增加了一张视差贴图,并通过视差映射渲染算法处理进一步增强了凹凸细节表现
      • 视差贴图只是一张图,视差映射是利用视差贴图的图形学算法

视差映射算法的各种效果

  • 视差映射算法除了可以用来增加物体表面细节以外,还能做出来很多有意思的效果
  • 上图就是利用视差贴图技术把2D图片3D化
    • 上图中的小猫是一张2D图片,不是模型,把这张图片导入到Unity后,利用视差贴图技术,就可以让小猫动起来

硬币会随着鼠标的摆动往不同的方向进行一定旋转,但旋转角度不能太大,因为其本身只是一张2D图片,并不包含一个3D物体的完整信息,旋转角度太大就会出现一些失真和穿帮

右图本身是一幅画,在经过处理后看上去就像是在3D场景里一样

  • 视差贴图技术在实际环境中也有广泛应用,大名鼎鼎的FaceBook网站就使用了视差映射技术来实现2D图片的3D化,在FaceBook网站里只要上传一张2D图片就能够把它做成一张3D效果图

    • FaceBook网站在你上传一张图片时会自动运用一些人工智能算法生成一张视差贴图,然后利用这张视差贴图来对图片进行视差运算以实现2D图片的3D化
  • 视差映射技术不仅仅可以用来操作图片,它也能用来操作一些视频
  • 上图是一个抖音短视频,可以看到场景里的人物面部突出来了,这也是利用了视差贴图技术,而且只需要两个步骤就能实现
    • 1,利用人工智能技术识别视频里的人眼和嘴巴的区域

      • 这和FaceBook里运用的识别图片是一个道理,但它做的更多一些,因为它不仅仅是做出人物的视差效果,还区分了人物的不同的区域
    • 2,利用视差贴图技术把识别出的两块区域抬高

视差贴图究竟长什么样

  • 左边的贴图没有任何的凹凸细节表现,只是贴了一张普通的漫反射贴图

    • 漫反射贴图只能用来表现物体表面细节,无法没有表现物体的受光,它的受光只是一块灰蒙蒙的平面,正常的物体受光应该是凸的地方受光多一点,凹的地方不怎么受光
  • 第二张贴图是漫反射加法线贴图,可以明显看出它的受光效果,物体表面凹进去的部分受光会比较暗,凸出的部分受光比较明显
    • 但漫反射加法线贴图只是在受光上有了一些明暗变化,物体的凹凸细节并没有表现出来,想要表现物体的凹凸细节需要再增加一张视差贴图
  • 右边的贴图就是在漫反射加法线贴图的基础增加了一张视差贴图,它不仅仅能够反映光照带来的变化,还能反映出物体表面的凹凸细节

如何表现物体表面凹凸

  • 方法1,给模型增加更多顶点

    • 如果想要做出右图这样的地平面,仅仅是用一些顶点去做的话,需要有非常非常多的顶点,也就是使用高模,但在游戏的实时渲染中,根本不可能用面数、三角形、顶点数量这么多的模型来进行实时渲染
    • 显卡能进行实时渲染的性能指标是有限的,所以我们一般会使用另外一种方式
  • 方法2,低模加上一张贴图

    • 用一张专门表示物体表面细节的贴图来绘制物体细节,物体表面只需要用一个平面模型就可以了,剩下的细节全部通过这张贴图来进行表现(如上方右图)
    • 但这种方式做出的细节非常有限,因为这张贴图只是把这些凹凸画上去了,光照在物体表面产生的反射比较粗糙,只是白花花的一片光亮
    • 一束灯光照射在贴图上产生不同方向、不同强度的反射,才能使渲染出的结果更加真实、细腻,只是贴一张贴图,没有基于每一个像素点来计算光照,只是基于整个大三角形进行计算,肯定无法得到细致的物体表面细节
  • 方法3,方法3仍然是使用低模,保留漫反射贴图,只是增加了一张法线贴图

    • 前面的方法只是贴一张图上去,因为物体表面的方向统一都是朝上的,自然表现不出细节,所以要增加一张法线贴图,法线贴图里存放的是物体的每一个像素点的方向信息
    • 比如上图贴图中的泥土的法线方向可能是朝着地面的,石块表面因为比较光滑,它的法线方向就可能是朝上的,有了所有物体的表面细节后再进行渲染就能得到更加精细的光照的效果
    • 灯光方向虽然是一致的,但它会根据物体表面的法线方向来计算反光,由于每个像素点的法线方向都不一样,计算出的反射方向自然也不一样,所以它能够表现出更细致的光照细节
  • 这就是法线贴图的原理,但不是法线贴图的全部,只是一些皮毛,法线贴图的知识点还有很多,比如

    • 法线贴图是怎么样生成出来的?
    • 法线贴图为什么是蓝色的?
    • 为什么法线贴图除了大部分都是蓝色以外,还会出现有红色、绿色,它们都代表什么?
  • 法线贴图有一个约定:如果一个物体表面的方向是垂直朝上的,那么它在法线贴图里就会用蓝色表示,为什么会用蓝色呢?

    • 这个规定是有一定原因的,因为法线贴图使用了切线坐标系,切线坐标系规定物体的平面是由切线坐标和负切线坐标构成的,垂直于这个平面的就叫做法线(如上方最右方图)
    • 法线的坐标刚好与平面垂直,它的坐标是(0,0,1),如果把它转换成一张图片里的颜色那么(0,0,1)就相当于RGB里的B,也就是Blue,因此使用蓝色来表示一个物体的表面法线方向
    • 比如左边的贴图中有些地方是石块,这些石块的表面方向是朝上的,但它的边缘方向要么朝左、要么朝前,要么就是朝右,因此它的颜色就可能是绿色或者红色,如果是绿色,就表示它的法线方向朝着负切线法线的方向,如果是红色,就表示物体表面的方向是朝着切线方向
  • 这仅仅只是理论上的了解,当你要落到实处写代码时就会发现:

    • 在Unity里直接导入一张图片,并对它进行纹理采样,所得到的采样结果又会是不正确的,这就跟Unity对法线贴图的编码和压缩有关系了
  • 使用法线贴图渲染出的结果就会更加贴近真实,但还不够,法线贴图只能模拟表面上不同的法线方向带来的明暗变化,并不能模拟凹凸

  • 假设上图中的眼睛图标是Unity里的摄像机,蓝色的箭头是摄像机观察的前方向,在现实世界中,我们用眼睛看这块砖块时,砖块有一些背面是不能被眼睛看见的,这部分就处于阴影区域

  • 如果用法线贴图的话,那么这部分就不处于被遮蔽的阴影区域,它仍然是可见的,为什么呢?

    • 因为法线贴图里不包含物体的高低信息,它只有每一个像素点的法线方向,所以只能计算出来物体表面的明暗信息,不能计算出这一块区域是否被遮挡,体现不出来凹凸感
    • 从之前的使用法线贴图的地面效果中也可以看出砖块后面的阴影区域只是比较暗,并没有被遮挡
  • 如果使用低模的话,那么物体表面的法线方向都是跟这个物体的表面垂直的,就是我们现在看到这个呃紫色或者蓝色的,因此一束光照射过来时产生的光线反射也是一样,并不能反映物体表面的明暗变化(如上方1号图)

  • 上面的第3号图是法线贴图,每一条物体表面的法线朝向都不一样,在计算物体光照的公式里会根据反光的夹角计算反光强度,由于每一个物体的表面的法线方向都不一样,那么夹角的大小也不一样,计算出的反射也不一样,物体每一个像素点的光照强度系数也都不一样

  • 但这并不是正确的结果,正确的结果是什么呢?

  • 由于物体表面是凹凸的,那么一束光照射在凹陷区域前方的平面上,那么凹陷区域应该是不受光的,这是真实的凹凸效果模拟

视差贴图的具体实现细节可以加文末联系方式领取

思考

什么时候要用到切线空间?
什么时候用物体的局部空间?
什么时候用世界空间?
切线空间的概念是什么样的?
如何通过书写算法调用Unity里的法线贴图资源?

写在最后

  • 更多学习资源请加QQ:1517069595或WX:alice17173获取(企业级性能优化/热更新/Shader特效/服务器/商业项目实战/每周直播/一对一指导)
  • 点赞、关注、分享可免费获得配套学习资源
  • 点击观看完整视频

视差映射:更逼真的纹理细节表现(上):为什么要使用视差映射相关推荐

  1. Real-Time Rendering 4th 译文《六 纹理(上)》

    "所需要做的仅是为了使渲染图像看起来正确." -- 吉姆·布林 表面的质感就是外观和感觉 -- 只要想一想油画的质感就知道了.在计算机图形学中,纹理化是获取表面并使用某些图片.函数 ...

  2. java 提交的内存_Java使用内存映射实现大文件的上传

    在处理大文件时,如果利用普通的FileInputStream 或者FileOutputStream 抑或RandomAccessFile 来进行频繁的读写操作,都将导致进程因频繁读写外存而降低速度.如 ...

  3. Ceph分布式存储实战:从0搭建一个存储集群,并把块设备镜像映射到CentOS 7系统上的步骤

    本文配套视频和笔记: Ceph分布式存储实战(Ceph快速上手) B站视频在线观看链接:[千锋教育]Ceph分布式存储技术教程(进阶到实战) 百度网盘链接:2020全新_Ceph分布式存储技术-进阶到 ...

  4. 解决 java.io.FileNotFoundException:请求的操作无法在使用用户映射区域打开的文件上执行。

    最近写Web项目时遇到了一个问题,对服务器上某个文件进行了读写操作后.再次执行该操作时,struts2报错,引发异常:C:\Program Files\Apache Software Foundati ...

  5. 【多传感融合】优达学城多传感融合学习笔记(三)——将激光雷达3D点云映射到相机图像(上)

    将激光雷达3D点云映射到相机图像(上)--原理分析 目录 将激光雷达3D点云映射到相机图像(上)--原理分析 齐次坐标系 内参(Intrinsic Parameters) 外参(Extrinsic P ...

  6. elasticsearch映射相关字段定义,属性定义,及动态映射(marvel插件方式)mapping

    1.什么是Mapping映射? 映射:创建索引的时候,可以预先定义字段的类型及相关属性 作用:这样会让索引建立的更加的细致和完善 分类:静态映射和动态映射 Type ES type Descripti ...

  7. qpsk的映射过程_FPGA数字信号处理(28)QPSK星座映射与解映射

    QPSK星座映射 星座图映射是指按一定规则(PSK或QAM)将输入比特对应到I/Q坐标系中的复数点.复数点越多,则频谱效率越高,抗噪声能力越强. 我们都知道QPSK调制每个符号有2-bits,用4种不 ...

  8. Java学习day096 并发(六)(线程安全的集合:高效的映射、集和队列、映射条目的原子更新、对并发散列映射的批操作、并发集视图、写数组的拷贝、并行数组算法、较早的线程安全集合)

    使用的教材是java核心技术卷1,我将跟着这本书的章节同时配合视频资源来进行学习基础java知识. day096   并发(六)(线程安全的集合:高效的映射.集和队列.映射条目的原子更新.对并发散列映 ...

  9. 映射到外网华为云_Windows 如何使用端口映射

    端口映射,就是将内网主机的端口映射到外网主机的端口. 外部用户访问外网主机的端口时,对该端口的所有请求都会转发到指定内部主机端口上. 例如,你有一台计算机 A,想访问计算机 D 上的服务.但是在这个网 ...

最新文章

  1. 成贤学院计算机组成原理,东南大学成贤学院计算机硬件课程设计报告解读.doc...
  2. eclipse:快捷键(补充。。。)
  3. 貌似长沙有个用膳吧外卖网
  4. 前端 CSS层叠性 CSS选择器优先级
  5. concurrent 底层_万字长文!从底层开始带你了解并发编程,彻底帮你搞懂Java锁!
  6. 二叉树展开为链表Python解法
  7. ubuntu启动php-fpm_ubuntu安装php-fpm+xdebug
  8. escilpse 连接mysql,浅谈docker-compose网络设置之networks
  9. xul界面编程语法_探索XUL中的多线程编程
  10. mc杀人Linux指令,杀人雪球指令详解 教你怎么做杀人雪球
  11. int转long Long型
  12. 《JUC并发编程 - 高级篇》03 - 共享对象之管程 下篇(Monitor | waitnotify | ParkUnpark | 线程状态转换 | 活跃性 | ReentrantLock)
  13. 极速office(Word)文字如何竖向
  14. 1688 代购电商 API 接口
  15. 小米网关接入Homekit完整教程
  16. 技术大咖云集 GIAC 2017全球互联网架构大会圆满落幕
  17. iOS 音频播放 —— AVAudioSession
  18. ns3安装Windows系统
  19. servlet验证码
  20. flash与字符串:字符串与属性

热门文章

  1. 苹果自带录屏在哪_苹果如何录屏?Mac录屏的专业方法
  2. 成都市绿色建筑创建行动实施计划通知
  3. 过于自信,面试普通Java岗被面试官吊打了。。。
  4. Python模块之Pandas模块学习笔记
  5. 平面设计自学能学会吗?学习平面设需要学多久?
  6. untiy实现文本滚动
  7. 嵌入式中串口、COM口、TTL、RS232、RS485的区别详解
  8. vue父子传值,slot插槽的使用
  9. 罗素说理想与历程—幸福心灵的获取
  10. Kafka 的消息异常情况~追日