Loading [MathJax]/jax/output/CommonHTML/config.js
前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >专栏 >第3章-图形处理单元-3.8-像素着色器

第3章-图形处理单元-3.8-像素着色器

作者头像
charlee44
发布于 2022-05-07 11:36:52
发布于 2022-05-07 11:36:52
2.2K0
举报
文章被收录于专栏:代码编写世界代码编写世界

3.8 像素着色器

在顶点、曲面细分和几何着色器执行它们的操作后,图元被裁剪并设置为光栅化,如前一章所述。管线的这一部分在其处理步骤中相对固定,即不可编程但有些可配置。遍历每个三角形以确定它覆盖哪些像素。光栅化器还可以粗略计算三角形覆盖每个像素的单元格区域(第5.4.2节)。与三角形部分或完全重叠的像素区域称为片元。

三角形顶点处的值,包括z缓冲区中使用的z值,在三角形表面为每个像素进行插值。这些值被传递给像素着色器,然后像素着色器处理片元。在OpenGL中,像素着色器被称为片元着色器,这可能是一个更好的名称。我们在本书中使用“像素着色器”以保持一致性。沿管线发送的点和线图元也会为覆盖的像素创建片元。

跨三角形执行的插值类型由像素着色器程序指定。通常我们使用透视校正插值,这样像素表面位置之间的世界空间距离会随着物体距离的缩小而增加。一个例子是渲染延伸到地*线的铁轨。轨道距离越远,铁路枕木的间距就越*,因为每个接*地*线的连续像素都行进了更多的距离。其他插值选项可用,例如屏幕空间插值,其中不考虑透视投影。DirectX 11 进一步控制何时以及如何执行插值530。

在编程方面,顶点着色器程序的输出,在三角形(或线)上进行插值,有效地成为像素着色器程序的输入。随着GPU的发展,其他输入也暴露出来了。例如,片元的屏幕位置可用于着色器模型3.0及更高版本中的像素着色器。此外,三角形的哪一边可见是输入标志。这一点对于在单个通道中,三角形的正面和背面渲染不同的材质很重要。

有了输入,像素着色器通常会计算并输出片元的颜色。它还可能产生不透明度值并可选择修改其z深度。在合并阶段,这些值用于修改存储在像素中的内容。光栅化阶段生成的深度值也可以通过像素着色器进行修改。模板缓冲区值通常不可修改,而是传递到合并阶段。DirectX 11.3允许着色器更改此值。在SM 4.0175中,雾计算和alpha测试等操作已从合并操作转变为像素着色器计算。

像素着色器还具有丢弃传入片元的独特能力,即不生成输出。图3.14显示了如何使用片元丢弃的一个示例。裁剪*面功能曾经是固定功能管线中的可配置元素,后来在顶点着色器中指定。随着片元丢弃可用,此功能可以在像素着色器中以任何所需的方式实现,例如决定裁剪体的并和或操作。

图3.14. 用户定义的剪裁*面。在左侧,单个水*剪切*面对对象进行切片。在中间,嵌套的球体被三个*面裁剪。在右侧,球体的表面仅在它们位于所有三个剪裁*面之外时才会被剪裁。(来自Three.js示例webgl裁剪和webgl裁剪交集218。)

最初,像素着色器只能输出到合并阶段,以供最终显示。像素着色器可以执行的指令数量随着时间的推移而显着增加。这种增加产生了多渲染目标 (MRT) 的想法。不是将像素着色器程序的结果仅发送到颜色和z缓冲区,而是可以为每个片元生成多组值并将其保存到不同的缓冲区,每个缓冲区称为渲染目标。渲染目标通常具有相同的x和y维度;一些API允许不同的大小,但渲染区域将是其中最小的。某些架构要求渲染目标具有相同的位深度,甚至可能具有相同的数据格式。根据GPU的不同,可用的渲染目标数量为四个或八个。

即使有这些限制,多渲染目标 (MRT) 功能仍然是更有效地执行渲染算法的有力助手。单个渲染通道可以在一个目标中生成彩色图像,在另一个目标中生成对象标识符,在第三个中生成世界空间距离。这种能力还产生了一种不同类型的渲染管管线,称为延迟着色,其中可见性和着色在单独的通道中完成。第一个通道存储在每个像素处有关对象位置和材质的数据。接下来的通道可以有效地应用照明和其他效果。此类渲染方法在第20.1节中描述。

像素着色器的局限性在于它通常只能在交给它的片元位置写入渲染目标,而不能从相邻像素读取当前结果。也就是说,当像素着色器程序执行时,它不能将其输出直接发送到相邻像素,也不能访问其他人最*的更改。相反,它计算的结果只影响它自己的像素。然而,这种限制并不像听起来那么严重。在一个通道中创建的输出图像可以让像素着色器在以后的通道中访问其任何数据。可以使用第12.1节中描述的图像处理技术处理相邻像素。

像素着色器无法知道或影响相邻像素结果的规则也有例外。一是像素着色器可以在计算梯度或导数信息期间立即访问相邻片段的信息(尽管是间接的)。像素着色器提供了任何内插值沿x和y屏幕轴每个像素的变化量。这些值对于各种计算和纹理寻址很有用。这些梯度对于诸如纹理过滤(第6.2.2节)之类的操作特别重要,其过滤插值需要我们知道图像覆盖了多少像素。所有现代GPU通过以

2×2

为一组处理片元(称为四边形)来实现此功能。当像素着色器请求梯度值时,返回相邻片段之间的差异。参见图3.15。统一着色器核心具有访问相邻数据的能力——保存在同一warp的不同线程中——因此可以计算用于像素着色器的梯度。这种实现的一个结果是,在受动态流控制影响的着色器部分中无法访问梯度信息(动态流控制指的是具有可变迭代次数的“if”语句或循环)。一组中的所有片元必须使用相同的指令集进行处理,以便所有四个像素的结果对于计算梯度都有意义。这是一个基本限制,即使在离线渲染系统中也存在64。

图3.15. 在左侧,一个三角形被光栅化为四边形,一组2×2像素。用黑点标记的像素的梯度计算显示在右侧。对于四边形中的四个像素位置中的每一个,都显示了v的值。注意三个像素是如何没有被三角形覆盖的,但它们仍然由GPU处理,以便可以找到梯度。x和y屏幕方向的梯度是通过使用其两个四边形邻居为左下像素计算的。

DirectX 11引入了一种允许对任何位置进行写访问的缓冲区类型,即无序访问视图(UAV)。最初仅用于像素和计算着色器,对UAV的访问扩展到DirectX 11.1 146中的所有着色器。OpenGL 4.3将此称为着色器存储缓冲区对象 (SSBO)。这两个名称都以自己的方式描述。像素着色器以任意顺序并行运行,并且该存储缓冲区在它们之间共享。

通常需要某种机制来避免数据竞争条件(又名数据风险),其中两个着色器程序都在“竞争”以影响相同的值,可能导致任意结果。例如,如果像素着色器的两次调用试图在大约同时添加到相同的检索值,则可能会发生错误。两者都会检索原始值,都会在本地修改它,但是无论哪个调用最后写入其结果都会消除另一个调用的贡献——只会发生一个添加。GPU通过具有着色器可以访问的专用原子单元来避免这个问题530。然而,原子操作意味着一些着色器可能会因为等待访问而停止,此时另一个着色器在读取/修改/写入相同的内存位置。

虽然原子可以避免数据风险,但许多算法需要特定的执行顺序。例如,你可能希望在用红色透明三角形覆盖之前绘制一个更远的透明蓝色三角形,将红色混合在蓝色之上。一个像素可能有两个像素着色器调用,每个三角形一个,以这样一种方式执行,即红色三角形的着色器在蓝色的着色器之前完成。在标准管线中,片元结果被处理之前,会在合并阶段进行排序。DirectX 11.3中引入了光栅化顺序视图(ROV)以强制执行顺序。这些就像UAV一样;它们可以由着色器以相同的方式读取和写入。关键区别在于ROV保证以正确的顺序访问数据。这大大增加了这些着色器可访问缓冲区的有用性327,328。例如,ROV使像素着色器可以编写自己的混合方法,因为它可以直接访问和写入ROV中的任何位置,因此不需要合并阶段176。代价是,如果检测到无序访问,像素着色器调用可能会停止,直到处理之前绘制的三角形。

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2022-01-26,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
暂无评论
推荐阅读
编辑精选文章
换一批
第3章-图形处理单元-3.2-GPU管线概览
GPU实现了第2章中描述的概念:几何处理、光栅化和像素处理流水线阶段。这些阶段被分为几个具有不同程度的可配置性或可编程性的硬件阶段。图3.2显示了根据可编程或可配置程度对各个阶段进行颜色标识。请注意,这些物理阶段的划分与第2章中介绍的功能阶段有些不同。
charlee44
2022/05/07
4970
第3章-图形处理单元-3.2-GPU管线概览
OpenGL 图形渲染流程入门
1、什么是 shader shader 中文名为着色器,全称为着色器程序,是专门用来渲染图形的一种技术。通过 shader,我们可以自定义显卡渲染画面的算法,使画面达到我们想要的效果。小到每一个像素点,大到整个屏幕。通常来说,程序是运行在 CPU 中的,但是着色器程序比较特殊,它是运行在 GPU 中的,所以当我们在编写 shader 程序的时候,实际上也是在编写 GPU 程序。在 OpenGL 中,对应的着色器语言是 GLSL(OpenGL Shading Language)。通过 shader 编程,我们
用户1097444
2022/06/29
2.3K0
OpenGL 图形渲染流程入门
第3章-图形处理单元-3.0
从历史上看,图形加速始于在重叠三角形的每个像素扫描线上插入颜色,然后显示这些值。包括访问图像数据的能力允许将纹理应用于表面。添加用于插值和测试z深度的硬件,可以提供内置的可见性检查。由于它们的频繁使用,这些工作被放到专门的硬件以提高性能。渲染管线的更多部分,以及每个部分的更多功能,在连续几代硬件产品中被添加。专用图形硬件相对于CPU的唯一计算优势是速度,但速度至关重要。
charlee44
2022/05/05
4740
透视矫正插值的秘密
传统的GPU渲染流水线(管线)是基于光栅化的一套流程,之所以要强调传统,是为了将之区别于基于光线追踪(ray trace)的流水线和基于体素化的流水线。在光栅管线中,最基本的2个着色器是顶点着色器和像素着色器,在下图中,除了2个着色器可编程,中间三个时钟节点都是固定的,只能配置不可编程。
Jean
2021/04/07
2K0
透视矫正插值的秘密
(实时)渲染管线(pipeline)
假设一个工具需要4个步骤才能够完成,那么一个人只能完成了全部的4个步骤后才能继续进行下一个工具的生产。但如果引入另外的3个人,每个人只负责一个步骤,那么一个人只需要完成一个步骤就可以进行下一个工具的生产。
Zero Two
2024/07/09
2970
(实时)渲染管线(pipeline)
Metal 框架之渲染管线渲染图元
在 《 Metal 框架之使用 Metal 来绘制视图内容 》中,介绍了如何设置 MTKView 对象并使用渲染通道更改视图的内容,实现了将背景色渲染为视图的内容。本示例将介绍如何配置渲染管道,作为渲染通道的一部分,在视图中绘制一个简单的 2D 彩色三角形。该示例为每个顶点提供位置和颜色,渲染管道使用该数据,在指定的顶点颜色之间插入颜色值来渲染三角形。
玖柒的小窝
2021/11/21
2.2K0
Metal 框架之渲染管线渲染图元
《Unity Shader入门精要》笔记(一)
渲染流水线的工作任务是:将三维场景里的物体投到屏幕上,生成一张二维图像。 可分为三个阶段:应用阶段、几何阶段、光栅化阶段。
代码咖啡
2021/12/06
1.1K0
《Unity Shader入门精要》笔记(一)
《Unity Shader入门精要》笔记:基础篇(1)
小插曲:看到具体数学冷汗直冒,细一看,嗷不是那本书呀。《具体数学》:别听《Unity Shader入门精要》里面说什么程序员的三大浪漫,真程序员就该手撕《具体数学》!
[Sugar]
2022/09/21
1.1K0
第3章-图形处理单元-3.3-可编程着色器阶段
现代着色器程序使用统一的着色器设计。这意味着顶点、像素、几何和曲面细分相关的着色器共享一个通用的编程模型。在内部,它们具有相同的指令集架构(ISA)。实现此模型的处理器在DirectX中称为通用着色器内核,具有此类内核的 GPU被称为具有统一着色器架构。这种架构背后的想法是着色器处理器可用于各种角色,GPU可以根据需要分配这些角色。例如,与由两个三角形组成的大正方形相比,具有小三角形的一组网格需要更多的顶点着色器处理。具有单独的顶点和像素着色器核心池的GPU意味着保持所有核心忙碌的理想工作分配是严格预先确定的。使用统一的着色器核心,GPU可以决定如何平衡此负载。
charlee44
2022/05/05
1K0
第3章-图形处理单元-3.3-可编程着色器阶段
深入GPU硬件架构及运行机制
对于大多数图形渲染开发者,GPU是既熟悉又陌生的部件,熟悉的是每天都需要跟它打交道,陌生的是GPU就如一个黑盒,不知道其内部硬件架构,更无从谈及其运行机制。
数字芯片社区
2021/04/19
4.9K1
深入GPU硬件架构及运行机制
1.图形管线
顶点缓存区 -> 顶点着色器 -> 图元 -> 光栅化 -> 纹理 -> 片段着色器 -> 逐片段操作 -> 上屏
大壮
2020/07/21
4050
OpenGL学习笔记(二)——渲染管线&着色语言
导语 :渲染管线(渲染流水线),一般由显示芯片(GPU)内部处理图形信号的并行处理单元组成。这些并行处理单元两两之间相互独立。不同的型号硬件上独立处理单元的数量有很大差异。 与CPU串行执行不同,渲染
MelonTeam
2018/01/04
2.1K0
OpenGL学习笔记(二)——渲染管线&着色语言
(一) 3D图形渲染管线
渲染简单的理解可能可以是这样:就是将三维物体或三维场景的描述转化为一幅二维图像,生成的二维图像能很好的反应三维物体或三维场景(如图1):
bering
2019/12/02
1.5K0
WebGL简易教程(四):颜色
在上一篇教程《WebGL简易教程(三):绘制一个三角形(缓冲区对象)》中,通过使用缓冲区对象(buffer object)来向顶点着色器传送数据。那么,如果这些数据(与顶点相关的数据,如法向量、颜色等)需要继续传送到片元着色器该怎么办呢?
charlee44
2019/09/29
9510
WebGL简易教程(四):颜色
【笔记】《计算机图形学》(8)——图形管线
这系列的笔记来自著名的图形学虎书《Fundamentals of Computer Graphics》,这里我为了保证与最新的技术接轨看的是英文第五版,而没有选择第二版的中文翻译版本。不过在记笔记时多少也会参考一下中文版本
ZifengHuang
2020/08/25
2.7K0
【笔记】《计算机图形学》(8)——图形管线
快速入门 WebGL
WebGL 是 Web 3D 渲染引擎的基础,它作为非常底层的 API,学习上手难度非常大,这是因为 WebGL 要求的背景知识比较多。而网上的教程一般没有过多介绍直接就介绍 API 开始渲染了,容易让人云里雾里,很容易被劝退,就算学到了 API 使用,也是只懂表面知识,没有了解背后的原理,很容易就忘记了。
羽月
2022/11/11
2.8K0
快速入门 WebGL
【GAMES101】Lecture 08 图形管线(实时渲染管线)与纹理映射
给我一个三维模型,给我一个光照条件,我就能够得出渲染的结果,这些东西合起来就是Graphics Pipeline,图形管线,闫神愿称之为实时渲染管线,那下面这个流程图就是这个渲染流水线
叶茂林
2024/01/20
2790
【GAMES101】Lecture 08 图形管线(实时渲染管线)与纹理映射
一看就懂的 OpenGL 基础概念丨音视频基础
这个公众号会路线图式的遍历分享音视频技术:音视频基础 → 音视频工具 → 音视频工程示例 → 音视频工业实战。关注一下成本不高,错过干货损失不小 ↓↓↓
关键帧
2022/11/29
2.6K0
一看就懂的 OpenGL 基础概念丨音视频基础
基础渲染系列(二)——着色器
这是渲染系列的第二篇文章,第一篇讲述的是矩阵,这次我们会写我们的第一个Shader并且导入一张纹理。
放牛的星星
2020/07/10
4.1K0
基础渲染系列(二)——着色器
几个简单的小例子手把手带你入门webgl
各位同学们大家好,又到了周末写文章的时间,之前群里有粉丝提问, 就是shader不是很理解。然后今天他就来了, 废话不多说,读完今天的这篇文章你可以学到以下几点:
coder_koala
2021/09/18
1.4K0
几个简单的小例子手把手带你入门webgl
相关推荐
第3章-图形处理单元-3.2-GPU管线概览
更多 >
领券
💥开发者 MCP广场重磅上线!
精选全网热门MCP server,让你的AI更好用 🚀
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档