https://sdpyy1.github.io/tags/postprocess/ Recent content in PostProcess on wanfeng Hugo -- gohugo.io zh-cn 爱喝东方树叶 Mon, 10 Nov 2025 10:09:12 +0800 https://sdpyy1.github.io/p/%E6%B8%B8%E6%88%8F%E5%BC%95%E6%93%8E%E5%BC%80%E5%8F%91%E5%AE%9E%E8%B7%B5%E9%AB%98%E8%B4%A8%E9%87%8Fbloom/ Mon, 10 Nov 2025 10:09:12 +0800 https://sdpyy1.github.io/p/%E6%B8%B8%E6%88%8F%E5%BC%95%E6%93%8E%E5%BC%80%E5%8F%91%E5%AE%9E%E8%B7%B5%E9%AB%98%E8%B4%A8%E9%87%8Fbloom/ <h1 id="下采样">下采样 </h1><h2 id="为什么要下采样">为什么要下采样 </h2><ul> <li> <p>要想光晕扩的足够大，第一件事情就是扩大模糊的范围。一种非常简单的思路就是死命加大滤波盒的尺寸，使用一个巨大的 kernal 对纹理进行模糊。但是性能上肯定是吃不消，单 pass 的纹理采样次数是 N^2 而双 pass 是 N+N</p> <p>此外还有一个问题，在处理高分辨率纹理时你需要等比地增加滤波盒的尺寸，才能形成同等大小的模糊。比如在 1000x1000 分辨率下用 250 像素的 kernal，模糊的结果占 1/4 屏幕，当分辨率增加到 2000x2000 的时候，要使用 500 像素的 kernal 才能达到同样的效果</p> <p>回到模糊的问题，模糊滤波的本质是查询 kernal 范围内的所有像素并加权平均，即范围查询问题。在计算机图形学中实现快速范围查询，通常会请到老朋友 <a class="link" href="https://zhida.zhihu.com/search?content_id=204910516&amp;content_type=Article&amp;match_order=1&amp;q=Mipmap&amp;zhida_source=entity" target="_blank" rel="noopener" >Mipmap</a> 出场。Mipmap 将图像大小依次折半形成金字塔，mip[i] 中的单个像素代表了 mip[i-1] 中的 2x2 像素块均值，也代表 mip[i-2] 中的 4x4 像素块均值：</p> </li> </ul> <h2 id="为什么不直接平均而是用高斯模糊">为什么不直接平均，而是用高斯模糊 </h2><p>为什么不直接用平均，而是用高斯模糊。 下图为直接使用mipmap，进行下采样</p> <p><img src="https://sdpyy1.github.io/image-20251110101612859.png" loading="lazy" alt="image-20251110101612859" ></p> <p>下图为高斯模糊，明显更加圆滑，直接MipMap还是方形的</p> <p><img src="https://sdpyy1.github.io/v2-1f9ab3392905eaac3190e5e266a4a962_b.webp" loading="lazy" alt="动图" ></p> <p>所以进行下采样时，使用高斯模糊，而不是普通的平均。 这只是第一步</p> <p>直接将最高层级 mip 叠加到图像上虽然能够产生足够大的光晕扩散，但是发光物的中心区域不够明亮。此外，发光物和泛光之间没有过度而是直接跳变</p> <p><img src="https://sdpyy1.github.io/v2-fa67671c61425333587c6634c0be3036_1440w.jpg" loading="lazy" alt="img" ></p> <p>亮度跳变导致的</p> <p><img src="https://sdpyy1.github.io/v2-72e75496f88c9e8e446ba7c8b2f00eed_1440w.jpg" loading="lazy" alt="img" ></p> <p>为了实现发光物和最高层 mip 之间的过渡，我们需要叠加所有的 mip 层级到原图上。因为 mip[i] 是基于 mip[i-1] 进行计算的，相邻层级之间相对连续则不会产生跳变</p> <p><img src="https://sdpyy1.github.io/v2-502d2c8ff257cea0f674949dacae7529_1440w.jpg" loading="lazy" alt="img" ></p> <p><img src="https://sdpyy1.github.io/v2-bc52b48d43ef484eb09d79a89142ee3c_1440w.jpg" loading="lazy" alt="img" ></p> <h1 id="上采样">上采样 </h1><p><img src="https://sdpyy1.github.io/v2-6e542ad0733116b074164331a782b6f6_1440w.jpg" loading="lazy" alt="img" ></p> <p><img src="https://sdpyy1.github.io/v2-1be5032cc27dd55f156c4f6508f4f639_1440w.jpg" loading="lazy" alt="img" ></p> <h1 id="引擎实践">引擎实践 </h1>