wingstone/wingstone.github.io

wingtone's blog

wingstone.github.io's Issues

GPU底层运行机制 | wingstone's blog

https://wingstone.github.io/posts/2022-08-29-gpu%E5%BA%95%E5%B1%82%E8%BF%90%E8%A1%8C%E6%9C%BA%E5%88%B6/

fbx sdk使用总结 | wingstone's blog

https://wingstone.github.io/posts/2022-01-19-fbx-sdk-usage/

Unity程序化生成插件合集 | wingstone's blog

https://wingstone.github.io/posts/2022-01-30-unity-procedual-generation-plugins/

Real Shading in Unreal Engine 4 | wingstone's blog

https://wingstone.github.io/posts/2022-01-01-real-shading-in-unreal-engine-4/

渲染时关于相机的问题

针孔相机（Pin Hole）

针孔相机就是传统的透视相机，由于针孔无限小，这样从针孔投射的光线是唯一的，针对投影平面来说；投射光线的唯一也就导致无法多采样产生景深效果；

薄透镜相机（Thin Lens）

薄透镜相机是对传统透镜的模拟，只不过忽略了透镜的实际厚度影响；为了模拟真实的相机，需要加入光圈、焦距、焦平面距透镜距离（像距）；整个相机的示意图，光圈所在位置实际就是透镜所在位置；关键的问题是如何根据相机模型，以及屏幕（像平面）上坐标获取所发射出来的射线；过程如下：

• 在透镜（光圈）上均匀采样，作为光线的起点，来获取所有经过光圈的光线；
• 为了模拟对焦，像平面上坐标点与透镜中心的连线，相交于焦平面一点；此点即为所有采样射线必须经过的焦点；
• 前面两个步骤所获取的光圈采样点、焦平面焦点即可决定采样的光线；

猫眼效应（Cat's Eye Effect）与暗角（vignette）

猫眼效应与暗角形成的原因，要从实际的相机模型来思考；实际的相机镜头是圆筒状的，这就导致光圈中心的光通量比较充足，而沿着光圈边缘的光线有很大概率会被镜筒遮挡住；从而导致屏幕边缘的亮度较弱，且会产生轻微畸变；

知道原理后，模拟方法就比较简单了：

1. 我们先设定镜筒的长度（镜头头部距光圈的距离）、以及镜筒的半径，实际相机的长度不会很长，但可以设置很长来产生明显的效果；
2. 计算投射光线与镜头头部平面的交点，然后判断该交点是否在镜筒半径范围内，如果大于该范围，则舍弃该光线；

任意形状的虚化光斑

实际的相机是放置相应的透光图案至于镜头前产生该效果（及镜筒的头部）

模拟方法一：我们只需要在光圈采样时，能在相应图案的范围内进行采样即可；
模拟方法二：根据实际产生的原理，去计算采样光线与镜头头部平面的交点，然后判断该交点是否在相应图案内，舍弃图案外的光线即可；

鱼眼镜头（Fisheye Lens）

一般的投射相机在广角很大时，会产生很大的透视畸变；采用鱼眼镜头可以处理超过后180度广角的情况，和一般的镜头不一样，鱼眼镜头拍摄的相片允许很重的Barrel Distortion，也就是说现实中的一条直线在相片中允许被扭曲成弯曲的形状。

鱼眼镜头类似于环境相机，只不过同样是将像素坐标映射到球坐标系，两者的映射方法不同；环境相机是将像素坐标x、y作为球坐标系下的两个夹角维度；而鱼眼镜头的映射要看具体的模拟方法；

鱼眼镜头的一种模拟方法叫做等立体角投影（Equisolid Angle Projection）；等立体角投影的定义是，图像上每个像素位置到图像中心位置的距离与此像素出射光线方向和相机方向间的夹角大小成正比。也就是说，每个像素所覆盖的立体角大小是相等的。

模拟方法为：

1. 先根据与相机方向夹角随着到图像中心距离线性变换的定义，由像素到图像中心的距离计算出出射光线在球坐标系中的theta（0-pi）。
2. 接着再根据像素位置距离图像中心的水平距离和垂直距离求出出射光线在极坐标系中的phi（0-2pi）；

参考，

Pipeline——GPU Graphic Pipeline（图形管线） | wingstone's blog

https://wingstone.github.io/posts/2020-09-13-gpu-graphic-pipeline/

article record

https://zhuanlan.zhihu.com/p/112120206

volumetric fog | wingstone's blog

https://wingstone.github.io/posts/2022-08-22-volumetric-fog/

nori path tracing | wingstone's blog

https://wingstone.github.io/posts/2022-12-05-nori-path-tracing/

Preintegrated Subsurface Scattering | wingstone's blog

https://wingstone.github.io/posts/2020-09-28-preintegrated-subsurface-scattering/

irradiance volumes for games | wingstone's blog

https://wingstone.github.io/posts/2022-06-23-irradiance-volumes-for-games/

Terrain To Mesh | wingstone's blog

https://wingstone.github.io/posts/2022-01-22-terrain-to-mesh/

Integrate acl to game engine thinking | wingstone's blog

https://wingstone.github.io/posts/2022-05-14-integrate-acl-to-game-engine-thinking/

common file operation in python | wingstone's blog

https://wingstone.github.io/posts/2022-06-02-common-file-operation-in-python/

Mesh Normal Smooth | wingstone's blog

https://wingstone.github.io/posts/2022-01-22-mesh-normal-smooth/

physical based sun | wingstone's blog

https://wingstone.github.io/posts/2023-6-10-physical-based-sun/

移动GPU架构 | wingstone's blog

https://wingstone.github.io/posts/2020-09-17-mobile-gpu-architecture/

头发渲染——Kajiya model | wingstone's blog

https://wingstone.github.io/posts/2020-09-16-kajiya-model/

Some Idea To Collection

由于github blog暂时还没有安装成功，所以这些想法想写到这里，之后再移至博客

• bloom类似效果的实现，在已知距离场的情况下，使用距离的倒数能渲染出接近bloom的效果
• 使用worlay noise的**，可以更好的渲染大量粒子的实现，只需要保证每个粒子运动范围在局部栅格空间即可；当然局部空间越接近全屏，粒子模拟效果越好~
  局部空间为全屏即为最原始的再屏幕空间遍历所有的粒子；

FXAA(Fast approximate anti-aliasing) | wingstone's blog

https://wingstone.github.io/posts/2021-03-01-fxaa/

why sdf is better | wingstone's blog

https://wingstone.github.io/posts/2022-09-12-why-sdf-is-better/

Monte Carlo Integration | wingstone's blog

https://wingstone.github.io/posts/2020-09-06-monte-carlo-integration/

tone mapping thinking | wingstone's blog

https://wingstone.github.io/posts/2022-08-12-tone_mapping_thinking/

个人blog构建总结 | wingstone's blog

https://wingstone.github.io/posts/2022-01-12-summary-of-blog-build/

渲染管线

管线介绍

所谓管线就是一个流程，针对硬件来说，处理一个图元有一个硬件渲染流程（Graphic Pipeline）；针对实际应用来说，渲染一帧画面也需要一个渲染流程（Render Path）；

GPU Graphic Pipeline

具体的管线流程要看实际的硬件驱动，Direct3D每一个版本都有很大的改动，这里以Direct3D11为例进行介绍；具体的文章参考可以看这里：Direct3D 11 Graphics Pipeline，Direct3D 12 Graphics Pipeline；

Input-Assembler Stage（图元装配阶段）

这一阶段主要进行图元的装配，先从用户填充的缓冲中读取数据，然后将数据装配成图元；此阶段可装配成不同的图元类型（如 line lists, triangle strips, or primitives with adjacency）

Vertex Shader Stage（顶点着色阶段）

一个可编程shader阶段，此阶段主要处理IA阶段输入的顶点，执行每顶点的处理（如变换、蒙皮、变形，顶点光照等）；VS阶段总是处理单一顶点，并输出单一顶点；VS阶段必须处于激活状态，VS必须提供；

Tessellation Stages（细分阶段）

该阶段实际上有三个小阶段来完成图元的细分；通过硬件实现细分，GPU Graphic Pipeline能将低细节的模型转换为高细节模型进行渲染；

Hull-Shader Stage（壳着色阶段）

一个可编程shader阶段，用来生成一个patch（和patch constants），每个patch对应一个输入的patch（quad, triangle, or line）；

有点像一个基本的图元类型；

Tessellator Stage

一个固定处理阶段，用来生成简单格式的域，一个域代表一个geometry patch并用来生成更小物体的集合（triangles, points, or lines），通过连接domain sample来实现；

Domain-Shader Stage（域着色阶段）

一个可编程shader阶段，用来计算每个domain sample的顶点的位置，

Geometry Shader Stage（几何着色阶段）

一个可编程shader阶段，该阶段同样以顶点作为输入，以顶点作为输出；但与VS有很大不同；

1. 输入顶点数不一定为一，输入顶点数刚好可以可组成一完整图元（two vertices for lines, three vertices for triangles, or single vertex for point）；并且可以携带邻接的图元顶点数据（an additional two vertices for a line, an additional three for a triangle）；
2. 输出顶点数不一定为一，输出的顶点数目可以形成特定的拓扑结构即可，输出的拓扑结构可选（GS stage output topologies available are: tristrip, linestrip, and pointlist）；

Stream-Output Stage（流输出阶段）

该阶段的目的在于能够从不断的GS阶段输出顶点数据，至一个或多个缓存中；

Rasterizer Stage（光栅化阶段）

此阶段，将每个图元光栅化为像素，通过顶点差值来计算像素信息；光栅化过程总是运行顶点裁剪，透视除法，将顶点转换为齐次裁剪空间，然后将顶点映射到视口上；

Pixel Shader Stage（像素着色器阶段）

一个可编程shader阶段，该阶段能够使用更加丰富的着色技术（每像素光照，后处理效果）；该阶段能够将常量，纹理数据，顶点差值数据以及其他数据进行计算，从而产生像素的输出；

Output-Merger Stage（输出合并阶段）

该阶段生成最终的像素颜色，通过管线状态的整合，即：PS阶段生成的数据，如render target、depth/stencil buffer；OM阶段是用来决定可见颜色的最后一步，并且会Blend最终的像素颜色；

physically based atmosphere scattering | wingstone's blog

https://wingstone.github.io/posts/2022-08-12-physically_based_atmosphere_scattering/

gamma | wingstone's blog

https://wingstone.github.io/posts/2021-06-26-light-and-color-gamma/

Fine Pruned Tiled Light | wingstone's blog

https://wingstone.github.io/posts/2022-01-04-fine-pruned-tiled-light/

About | wingstone's blog

https://wingstone.github.io/about/

center or centroid interpolation | wingstone's blog

https://wingstone.github.io/posts/2022-07-20-center-or-centroid-interpolation/