(转)简述47种Shader Map的渲染原理与制作方法

在Shader中会使用各种不同图参与渲染,所以简单地总结下各种图的渲染原理、制作方法,最后面几种是程序生成图。

1. Albedo

2. Diffuse(Photographic)

从上图可以看出来,Albedo是去掉Diffuse的光照和阴影生成的,而在pbr工作流下必须要用Albedo。

转换方法:How to Make an Albedo Texture from a Diffuse Texture

3. Alpha Map

注意:jpg没有alpha通道,png也没有alpha通道,显示的alpha是根据rgb计算的灰度作为alpha使用。

另外安卓平台ETC1也没有alpha通道。

4. Bump Map

5. Height Map

基于高度的潮湿地面

6. Normal Map

Bump Map是凹凸贴图,常用的有两种:一种是Emboss Bump Map(浮雕凹凸贴图,使用的Height Map),

另一种是Dot3 Bump Map(点乘凹凸贴图,使用的是Normal Map)

7. Mask Map

Mask用途比较多,常用来标识不同物体,比如标识建筑上反光的窗户、地面的积水、皮肤上汗水等。

8. Light Map(图来源)

9. Lut

Lut(查找表lookup table)可以用于优化复杂光照的渲染,比如lambert blinn-phong可以把(NL,NH)作为uv坐标,

将光照计算存储在一张贴图中,这样渲染时复杂的计算过程就优化为纹理采样了。另外皮肤、毛发之类复杂计算都可以用此方法优化。

10. Emission Map

如果要表现更好的效果,自发光还要配合HDR/ToneMap/Bloom。

11. Metallic Map/Roughness

12. Specular Map/ Smoothness

图来源

高光工作流可以不受限于PBR,能做非真实渲染,而金属工作流则对入门者更友好,限制在物理渲染的框架中,不

至于渲染的太糟,当然金属工作流也可以做风格化的渲染。如果是用Substance Painter或者Marmoset Toolbag制

作,这两种方式都支持导出的。

13. Gloss Map

14. Smothness Map

15. Roughness Map

光泽贴图和高光贴图是不同的,它类似平滑贴图/粗糙贴图,表示物体表面的平滑粗糙程度,而高光贴图存储的是高

光的强度,金属贴图存储的是金属度。

16. pbr(sbsar)

17. Ramp Map

Ramp Map常用于卡通渲染,可以用于手工调节漫反、高光、阴影等,但是这比较依赖美术画图的功力,道理简单,渲

染的好看却不容易。

图来自米哈游的技术解说米哈游极乐净土的卡通渲染

18. Detail Map(Albedo Emission Specular Normal 等)

Detail Map主要解决相机靠近模型时贴图精度不足的问题,比如地面、皮肤、树木等等靠近看会很模糊,用一张尺度更

小的坑坑洼洼的图来增加细节。左上是模糊的地面,右上是细节图,最下面是增加细节后的地面。

19. Gradient Map(用于Color Gradient颜色分级、颜色校正等)

?

20. Jitter Map/Sparke Map/Glitter Map

这种闪烁的噪点主要用于沙子、雪等渲染,主要用于表现颗粒感。这可以用噪声图来用于渲染,也可以用函数生成,一般

类似frac(a*sin+b)这样形式,可以搭配WorldPos、ViewPos、Time来组合成函数。

?

21. Noise Map

Noise有很多种:白噪声、蓝噪声、perlin噪声、simplex噪声、Voronoi噪声。

另外推荐个噪声图编辑器:numberflow

?

?

22. Splatting Map

最常用于地形渲染,单独一张control texture作为多层贴图的混合系数,既可以用于颜色混合,也可以用于法线混合。

?

23. Lens Map(Rain/Snow/Freeze/Glare/Flare/Flash/Gleam/starburst)

做镜头效果会需要很多类似雨滴、雪花、脏迹、冰冻、炫光、星星等贴图。比如下面镜头雨滴。

?

?

24. CubeMap

Arm公司做的Ice Cave把CubeMap用在反射、折射、阴影,效果很赞(ice cave)

?

?

25. MatCap Map

Matcap的原理将法线转换view坐标系,取XY作为UV采样一张贴图,原理如下图

?

?

对于场景色调比较统一、不要求精准光照的情况,这是种运行效率非常高的渲染方式。

?

?

26. 3D Texture

3d纹理最常用于体渲染,比如云、高度雾等。Unity不支持3d纹理的文件格式,但是支持动态创建Texture3D,

这样可以自己保存为asset格式或者自定义格式,在运行时转换为Texture3D。因为体渲染比较常用的方式是raymatching,

步进次数少效果很难表现出来,在移动端效率比较低。图来HorizonZeroDawn

?

?

27. Translucency Map(Thickness Map、反向AO、单散射)

主要用于半透明物体,比如阔叶植被、玉等

?

?

28. Ambient Occlusion Map

AO的计算方法是从顶点的半球发出射线,检测射线是否与网格相交,下图的遮挡值是5/7。图来源

因为AO图噪点较多,即使增加射线的数量效果也不是很好,而体遮挡法能很好解决这个问题。AO如果作为后

处理的话,SSVO、SSDO是比较流行的方法。

?

29. DUDV Map

DuDv图看上去像蚯蚓爬过的法线图,一般用RG两个通道存储数据,是根据法线求导后再模糊处理存储的数据,类似与

Parallax Map的用途,它也用于扭曲,比如下图用于扭曲水面倒影。图来源

?

?

30. Flow Map

Flow map存储的是向量场数据,可以用于控制水面UV,比如下图石头周围一圈一圈水纹,制作工具有很多,

比如flowmap制作工具

?

?

31. Ripple Map

常用于雨滴水纹、物体落入水中的水纹等,可以算是flowmap的一种。

?

?

32. Distort Map

扭曲图比较常用于半透物体,用于扭曲背景。比如下图冰块。

?

?

33. Displacement Map

34. Vector Displacement Map

这两种图常用镶嵌,不过Displacement Map相当于高度图,而Vector Displacement Map

存储的是三维向量,可以更好地细分模型。比如用地面蘑菇、地衣、耳朵等。

35. Radiosity Normal Map

半条命首先引入的光照贴图方式,具体参考:Radiosity Normal Map,另外抵抗:人类陨落也有使用这种方法:抵抗中的光照

36. Cavity Map

缝隙图存储的是比普通AO更小的AO信息,主要用于表现裂缝。制作方法参考:缝隙图笔记

?

?

37. Curvature Map

曲率图和缝隙图不同的是它主要用于表现边缘、凹凸等效果,用于耳朵、眉骨、鼻子渲染效果会很好,利用DDX/DDY或fwidth也可以动态计算曲率。

?

?

38. Anisotropic Map

有些物体的光照会呈现各向异性,比如头发、金属等,下图是三种头发渲染的方式(环形、kajiya、Scheuermann)都用

到各向异性的贴图用于高光偏移。

?

?

39. Derivative Map

这是由顽皮狗大神Morten Mikkelsen首先提出法线图的衍生方式(Bump Mapping Unparametrized Surfaces on the GPU),

因为用法线图一般在切线空间用于光照计算,而这种方法则不需要切线空间的参与,效率和效果都会更好,不用法线图,

而是表面梯度图,和高度梯度图是不同的。不过这文章读起来挺心累的,最好参考Jim Blinn大神的凹凸贴图原理

?

40. Foam Map

泡沫贴图、浪花贴图用于水面超过一定值时泡沫会和水面颜色混合,水面顶点越高泡沫透明度越大。

图来源

?

?

41. Caustics Map

水纹贴图:因为水面起伏、焦散导致水底某些地方会比周围更亮,可以用Projector渲染水纹,也可以参考GPU Gems

的反向计算折射光线来采样太阳环境图的方法Rendering Water Caustics),还有一个制作水纹的工具(水纹生成器+Unity Demo)

?

?

42.Bent Normal Map (经大神王滕昊提醒补充加上)

Bent Normal 常用于离线AO渲染中,是对原始法线修改后的向量,考虑周围遮挡情况使其指向光线传入的主方向,

如下图Bend Normal 比原始法线偏右。用于光照计算或者环境光采样用Bend Normal在模型边缘处会得到更好的AO和光照效果。

43. Depth Map

44. Camera Depth Map

45. Camera Depth Normal Map

相机深度图可以用于渲染水、雾、扫描、半透物体等,这里有个不错文章有关深度法线图的:深度与法线图

?

?

46. Grab Pass Texture

GrabPass可以用于热浪扭曲、半透冰块、冲击波等需要背景用于渲染的情况,在移动端效率不高,不要求动

态背景时可以用Cubemap来代替。

?

?

47. Vertex Texture Fetch

在Vertex Shader中读取上一帧水面高度纹理,在当前帧继续波动,这可以用于交互式水渲染,不过顶点

纹理拾取是比较耗费资源的操作,不需要交互的水面是用不到的,对于海战类型的游戏会比较有用。

?
?

来自 <https://zhuanlan.zhihu.com/p/27339998>

?
?

原文地址:https://www.cnblogs.com/BaiPao-XD/p/10527515.html

时间: 2024-11-08 21:46:09

(转)简述47种Shader Map的渲染原理与制作方法的相关文章

简述23种软件设计模式

简述23种软件设计模式 一.设计模式分类 总体来说设计模式分为三大类: 五种创建型模式:工厂方法模式.抽象工厂模式.单例模式.建造者模式.原型模式. 七种结构型模式:适配器模式.装饰器模式.代理模式.外观模式.桥接模式.组合模式.享元模式. 十一种行为型模式:策略模式.模板方法模式.观察者模式.迭代子模式.责任链模式.命令模式.备忘录模式.状态模式.访问者模式.中介者模式.解释器模式. 二.设计模式概述 创建型模式 1.工厂方法模式 工厂方法模式的创建是因为简单工厂模式有一个问题,在简单工厂模式

JAVA四种遍历Map的方法

import java.util.HashMap;import java.util.Iterator;import java.util.Map;import java.util.Set; /** Created by song on 2019/1/17.*/public class MapT {public static void main(String[] args) {Map<Integer,String> map=new HashMap<>();map.put(1,"

【转】浏览器的渲染原理简介

How Browsers Work 这篇文章把浏览器的很多细节讲的很细,也有中文的翻译版本,现在转载的这篇是陈皓写的,目的的为了能在上班途中,或是坐马桶时就能读完,并能从中学会一些能用在工作上的东西. 浏览器工作大流程 先看个图 从图中,可以看到: 1) 浏览器会解析三个东西 * 一个 HTML/SVG/XHTML,事实上,Webkit 有三个C++的类对应这三类文档.解析这三种文件会产生一个DOM Tree * CSS,解析CSS会产生CSS规则树 * JavaScript 脚本,主要是通过

网页渲染原理

网址:http://blog.jobbole.com/72692/ 浏览器是怎样渲染一个页面的? 我们从浏览器渲染页面的大概过程开始说起: 由从服务器接收到的 HTML 形成 DOM(文档对象模型). 样式被加载和解析,形成 CSSOM(CSS 对象模型). 紧接着 DOM 和 CSSOM 创建了一个渲染树,这个渲染树是一些被渲染对象的集合( Webkit 分别叫它们”renderer”和”render object”,而在Gecko 引擎中叫”frame”).除了不可见的元素(比如 head

不同内核的浏览器,以及渲染原理

一. "Rendering Engine"渲染引擎,也可以叫做浏览器内核(这个部分要扩展一下,原本的浏览器内核分为渲染引擎和Js引擎,后来Js引擎越来越独立,内核就倾向于只指渲染引擎了),是浏览器最核心的部分,浏览器内核的不同对于网页的语法解释会有不同,所以渲染出来的效果也不同,简单说就是不同的内核决定了浏览器如何显示页面,也是因为这个原因导致了浏览器兼容性问题的出现. 下面是5种浏览器分别采用的不同引擎: - IE内核 Trident- 谷歌内核 WebKit / Blink(由we

递归--一种直接或者间接引用自身的定义方法

引言:“盗梦空间”的电影.梦中梦,梦中梦,然后有时候循环. 我们在程序设计当中常常会遇到重复性的计算,我们最常用的方法是组织迭代循环,而我们除此之外还可以采用递归计算的方法. 递归的定义:递归是一种直接或者间接引用自身的定义方法.一个合法的递归一般包含俩个部分:基础部分和递归部分. 一些平时我们遇到的经典算法. 1.欧几里得递归,迭代算法 2.斐波那契数列 3.连续整数检测算法 4.逆序输出正整数的各位数 5.汉诺塔问题 6.排列产生算法 1.欧几里得递归,迭代算法 1 package com.

浏览器渲染原理及流程

我们可能都知道浏览器含有一个渲染引擎,用来渲染窗口所展示的内容.默认情况下,渲染引擎可以显示html.xml文档及图片,它也可以借助插件(一种浏览器扩展)显示其他类型数据,例如使用PDF阅读器插件,用于显示PDF格式.但是其具体的渲染原理和流程估计也有很多人都不知道或者不清楚吧.这些天研究了一下浏览器的渲染原理,有了些心得,在这里跟大家分享一下,这里只讨论渲染引擎最主要的用途--显示应用了CSS之后的html及图片. 渲染引擎简介 本文所讨论的浏览器--Firefox.Chrome和Safari

三种简单的html网页自动跳转方法

三种简单的html网页自动跳转方法,可以让你在打开一个html网页时自动跳转到其它的页面. 方法/步骤 <html> <head> <title>正在跳转</title> <meta http-equiv="Content-Language" content="zh-CN"> <meta HTTP-EQUIV="Content-Type" CONTENT="text/ht

对map的value进行排序的方法

对map的value进行排序的方法,注意思路,以及CMPBYVALUE的用法 <h1 class="title" style="margin: 10px 0px; font-family: 'lucida grande', 'lucida sans unicode', lucida, helvetica, 'Hiragino Sans GB', 'Microsoft YaHei', 'WenQuanYi Micro Hei', sans-serif; line-heig