Projects on wanfeng

游戏引擎开发实践（降噪算法 SVGF）

Fri, 26 Dec 2025 15:26:32 +0800

降噪算法

高斯滤波器

很简单就是拿一个高斯滤波核遍历一遍像素

高斯公式回顾一下

双边滤波

这张图是高斯滤波的结果，它任何地方都会被均等的糊掉

下面是双边滤波器的公式 (i,j)(k,l)两个点的之间的权重计算，前半部分就是高斯分布，后半部分（也是一个高斯分布，颜色越相近，越接近最高点）表示：如果两个点颜色差距越大，权重越小

这个式子可以拆成两个指数函数的乘积，第二项如果颜色一致就=1，颜色不一致程度越大，越小，这样就达到了根据颜色差异调整权重的能力

这个算法的问题是分不清是边界还是噪声

联合双边滤波

高斯滤波的标准：距离

双边滤波的标准：距离+颜色差异

联合双边滤波思想就是用更多的指标，比如GBuffer那些信息

比如量化深度差异，法线差异来指导权重，这里并没有说具体公式

大滤波器优化

如果滤波核很大，如何进行优化

拆分2个Pass

水平一遍，竖直一遍，经典

再配合groupshared，减少ComputeShader的采样次数

原理上来讲二维高斯就可以拆成两个一维高斯的乘积，卷积写成二重积分后，对于高斯滤波核来说可以拆成内部x积分完成后，再y积分

但是复杂的滤波核不适用

小波变换卷积\空洞卷积 À-Trous wavelet

思路也是多个Pass进行卷积，比如5x5的核，每次都是5x5但是采样点的间距变了，变成$2^i$

复杂度从n2变成卷积核的平方 * 卷积次数

处理过亮像素

噪声中很亮的点如果做滤波，会变成一片亮

亮点探测:

处理亮点

SVGF （Spatiotemporal Variance-Guided Filter）时空方差引导滤波

SVGF就是融合了上边介绍的这些技术点，从时间和空间上都进行了滤波

3个因素引导的联合双边滤波

深度

它的深度指数衰减不仅仅是考虑空间深度，还会考虑法线投影上的深度大小（分母），这样建模是为了表达虽然空间上深度差异较大，但是xxxx(TODO:其实没懂为什么这样)

法线

两个法线的点乘来控制，并用指数控制衰减速度

另外一点不要用法线贴图的数据，直接用模型原始法线

Luminance

颜色差异会被噪声干扰，比如一个点在阴影里，但是因为噪声，它变得特别亮，解决办法就是利用方差来指导，方差信息会先计算一次空间上的方差，再时域累积，再空间滤波

SVGF解决不掉的问题是，场景没有变化也就是MotionVector没有数据，但是阴影一直在移动，这时候的阴影就会有噪声

再后来出现了A-SVGF,处理场景突变的延迟问题

RAE

利用神经网络来滤波，目前没兴趣

SVGF实践

参考文刀秋二大佬的https://zhuanlan.zhihu.com/p/28288053，与https://zhuanlan.zhihu.com/p/699706592

Demodulate Albedo

第一步要存储SPP=1的情况下，直接光照和间接光照的结果，并且在存储时要/albedo来保存，过滤过后再乘回来，文刀秋二的解释是（纹理的细节并不会因为Filter的强度过于大而丢失掉）目前不太理解，先做出来再说。另外这样做的前提应该是当前场景是Diffuse的

这张（右侧）表示直接光照/albedo

这张（右侧）表示间接光照/albedo

Reconstruction Filter

先实现空洞滤波

#version 450 core
#include "../common/common.glsl"
#include "../common/math.glsl"
#ifdef COMPUTE_SHADER
layout(set = 1, binding = 0, rgba32f) uniform image2D OUT_COLOR;
layout(set = 1, binding = 1, rgba32f) uniform image2D IN_COLOR;
layout(set = 1,binding = 2, rgba32f) uniform image2D velocityTexture;
layout(push_constant) uniform Uniforms
{
    int curPassIndex; // 当前 Atrous pass 索引
};

layout(local_size_x = 16, local_size_y = 16, local_size_z = 1) in;

void main(){
    ivec2 invocID = ivec2(gl_GlobalInvocationID.xy);
    ivec2 imgSize = ivec2(imageSize(OUT_COLOR));
    if (invocID.x >= imgSize.x || invocID.y >= imgSize.y) 
        return;

    vec3 colorSum = vec3(0.0);
    float weightSum = 0.0;


    // 5x5 Atrous 核心 做了空洞滤波，相当于64*64的卷积核
    int curStep = 1 << curPassIndex;
    for (int dy = -2; dy <= 2; ++dy) {
        for (int dx = -2; dx <= 2; ++dx) {
            ivec2 samplePos = invocID + ivec2(dx, dy) * curStep;

            // 边界检查
            samplePos = clamp(samplePos, ivec2(0), imgSize - 1);

            vec3 sampleColor = imageLoad(IN_COLOR, samplePos).xyz;

            // Atrous 权重，这里先用 1.0，之后可以换成高斯或 bilateral 权重
            float weight = 1.0;

            colorSum += sampleColor * weight;
            weightSum += weight;
        }
    }

    vec3 result = colorSum / weightSum;
    imageStore(OUT_COLOR, invocID, vec4(result, 1.0));
}
#endif

#include "hzpch.h"
#include "SVGFPass.h"
#include "Hazel/Core/Application.h"
#include "Hazel/Scene/SceneManager.h"
#include "Hazel/Renderer/RenderResource/RenderResourceManager.h"
#include "Hazel/Renderer/RenderResource/PipelineCache.h"
#include <Hazel/Renderer/RenderResource/Shader.h>
namespace GameEngine {
	void SVGFPass::Init()
	{
		m_Shader = std::make_shared<Shader>("postprocess/SVGF", SHADER_FREQUENCY_COMPUTE)->GetRHIShader();
		RHIRootSignatureInfo info = {};
		info.AddEntryFromReflect(m_Shader);
		info.AddEntry(RENDER_RESOURCEMANAGER->GetGlobalResourcePreFrameRootSignature()->GetInfo())
			.AddPushConstant({4,SHADER_FREQUENCY_COMPUTE });
		m_RootSignature = APP_DYNAMICRHI->CreateRootSignature(info);
		RHIComputePipelineInfo pipelineInfo = {};
		pipelineInfo.computeShader = m_Shader;
		pipelineInfo.rootSignature = m_RootSignature;
		m_Pipeline = APP_DYNAMICRHI->CreateComputePipeline(pipelineInfo);
	}

	void SVGFPass::Build(RDGBuilder& builder)
	{
		auto& [w, h] = APP_WINDOWSIZE;
		RDGTextureHandle pathTracingDirectRes = builder.GetTexture("PathTracingdirectRes");
		if (pathTracingDirectRes.ID() == UINT32_MAX) { return; }
		RDGTextureHandle pathTracingIndirectRes = builder.GetTexture("PathTracingIndirectRes");
		RDGTextureHandle velocity = builder.GetTexture("GBufferVelocity");
		RDGBufferHandle exposureData = builder.GetBuffer("ExposureData");

		RDGTextureHandle directFilterRes = builder.CreateTexture("PathTracing_SVGF_directFilterRes")
			.Exetent({ w, h ,1 })
			.Format(FORMAT_R32G32B32A32_SFLOAT)
			.AllowRenderTarget()
			.AllowReadWrite()
			.Finish();

		RDGTextureHandle forPinpongTexture = builder.CreateTexture("PathTracing_SVGF_forPinpongTexture")
			.Exetent({ w, h ,1 })
			.Format(FORMAT_R32G32B32A32_SFLOAT)
			.AllowRenderTarget()
			.AllowReadWrite()
			.Finish();


		RDGTextureHandle inDirectFilterRes = builder.CreateTexture("PathTracing_SVGF_inDirectFilterRes")
			.Exetent({ w, h ,1 })
			.Format(FORMAT_R32G32B32A32_SFLOAT)
			.AllowRenderTarget()
			.AllowReadWrite()
			.Finish();



		// 直接光
		for (int i = 0; i < 5; i++) {
			builder.CreateComputePass(GetName() + "_DirectRes" + std::to_string(i))
				.RootSignature(m_RootSignature)
				.PassIndex(i)
				.ReadWrite(1, 0, 0, i == 0 ? directFilterRes : i % 2 == 1 ? forPinpongTexture : directFilterRes)
				.ReadWrite(1, 1, 0, i == 0 ? pathTracingDirectRes : i % 2 == 1 ? directFilterRes : forPinpongTexture)
				.ReadWrite(1, 2, 0, velocity)
				.Execute([&](RDGPassContext context) {
				auto& [w, h] = APP_WINDOWSIZE;
				RHICommandListRef command = context.command;
				command->SetComputePipeline(m_Pipeline);
				command->BindDescriptorSet(context.descriptors[1], 1);
				uint32_t curIndex = context.passIndex[0];
				command->PushConstants(&curIndex, sizeof(uint32_t), SHADER_FREQUENCY_COMPUTE);
				command->BindDescriptorSet(RENDER_RESOURCEMANAGER->GetGlobalResourcePerFrameDescriptorSet(), 0);
				command->Dispatch((w + 15) / 16, (h + 15) / 16, 1);
					})
				.Finish();
		}



		// 间接光
		for (int i = 0; i < 5; i++) {
			builder.CreateComputePass(GetName() + "_DirectRes" + std::to_string(i))
				.RootSignature(m_RootSignature)
				.PassIndex(i)
				.ReadWrite(1, 0, 0, i == 0 ? inDirectFilterRes : i % 2 == 1 ? forPinpongTexture : inDirectFilterRes)
				.ReadWrite(1, 1, 0, i == 0 ? pathTracingIndirectRes : i % 2 == 1 ? inDirectFilterRes : forPinpongTexture)
				.ReadWrite(1, 2, 0, velocity)
				.Execute([&](RDGPassContext context) {
				auto& [w, h] = APP_WINDOWSIZE;
				RHICommandListRef command = context.command;
				command->SetComputePipeline(m_Pipeline);
				command->BindDescriptorSet(context.descriptors[1], 1);
				uint32_t curIndex = context.passIndex[0];
				command->PushConstants(&curIndex, sizeof(uint32_t), SHADER_FREQUENCY_COMPUTE);
				command->BindDescriptorSet(RENDER_RESOURCEMANAGER->GetGlobalResourcePerFrameDescriptorSet(), 0);
				command->Dispatch((w + 15) / 16, (h + 15) / 16, 1);
					})
				.Finish();
		}


	}

}

直接光模糊后结果

间接光会有闪烁的情况

滤波公式，每次滤波时都是一个联合双边滤波

具体的联合双边滤波有三部分组成

先加入法线贡献

// 5x5 Atrous 核心 做了空洞滤波，相当于64*64的卷积核
uint curStep = 1 << curPassIndex;
for (int dy = -2; dy <= 2; ++dy) {
    for (int dx = -2; dx <= 2; ++dx) {
        ivec2 samplePos = invocID + ivec2(dx, dy) * int(curStep);

        // 边界检查
        samplePos = clamp(samplePos, ivec2(0), imgSize - 1);

        vec3 sampleColor = imageLoad(IN_COLOR, samplePos).xyz;
        // 高斯
        float gaussWeight = gaussKernel5x5[dx + 2 + (dy + 2) * 5];
        // 法线
        vec3 sampleNormal = imageLoad(NORMAL, samplePos).xyz;
        float normalWeight = pow(max(dot(normal, sampleNormal), 0.0), 128.0);

        float weight = gaussWeight*normalWeight;

        colorSum += sampleColor * weight;
        weightSum += weight;
    }
}

明显还是有问题的，因为小正方形上面和地面法线都朝上，所以贡献偏大了，阴影跑到了正方形上边

需要引入颜色差异来解决这个问题，毕竟阴影里的颜色和阴影外的最大区别就是颜色，很容易区分，另外还需要注意颜色差异是噪声造成的还是场景造成的（方差越大，越不应该作为权重评判的指标）

分子表示亮度差，差异越大权重越小，但差异过大也可能是噪声导致的，所以差异大并不一定表示颜色边界

所以引入方差来表示颜色的变化，方差越大，权重越大。就是越不考虑颜色差异的影响

这里的方差是指时间维度的方差，这样的话就得用MotionVector来找上一帧的位置，也就可以理解为如果一个像素位置颜色一直在变化，那它就很有可能只是噪声，就不应该用颜色差异来知道滤波，所以这一项权重就会变大

先根据一阶矩和二阶矩计算出方差

时间上的方差结果只用于第一次滤波，后续4次滤波用一个公式来更新方差值

游戏引擎开发实践（DDGI）

Sun, 07 Dec 2025 20:36:06 +0800

总体流程

探针收集光照信息：探针向四面八方发射256条光线，计算击中点的光照并存储（此处可以额外计算击中点的间接光照，来模拟无限弹射的全局光照效果），另外还要存储hitT用来评估可见性

混合光照信息：每个探针分配6*6的像素，每个像素代表一个法线方向，通过蒙特卡洛积分来估计法线方向上的Irrandiance（其实和IBL思路一致），并进行时域加权混合，来获得更多的样本？

混合距离信息：每个探针分配 14*14的像素，计算每个方向上HitT的期望和平方的期望，时域混合（这两部都采用了八面体映射，另外这两步涉及到采样边界的问题，在像素外扩充一圈，用特定规则填充后存储）类似，保证在一个探针内采样时，不会采样到别的探针数据

光照Pass使用探针：根据着色点位置找到周围8个探针，从8个探针中获取对应法线位置的数据进行加权平均，有3种权重系数

如果probe离着色点较远，降低probe的权重（三线性插值系数）

如果着色点到probe的方向与表面法线的夹角过大，降低probe的权重（方向系数）

如果着色点与probe之间有较大的概率存在遮挡物，降低probe的权重（切比雪夫系数）

DDGI Probe

DDGIVolume

把探针组组成一个包围盒，定义探针数量和间距，以及DDGI的各种参数，这里实现了一个新的探针组件来表达它，并实现了他的可视化

ProbeTrace

这个阶段利用光追，计算并保存每个探针发射四面八方的光线的Radiance 信息（在每个击中点进行一次光照计算）

获取volume的设置，采用y-up方向，作为Image2Darray的layer，所以每层的探针数量为probeCount.x * probeCount.z

DDGISetting ddgiSetting = RENDER_RESOURCEMANAGER->GetGlobalSettingInfo().ddgiSetting;

glm::uvec3 probeCount = ddgiSetting.probeCount;
uint32_t raysPerProbe = ddgiSetting.raysPerProbe;
uint32_t probeCountPreLayer = probeCount.x * probeCount.z;
uint32_t volumeLayerCount = probeCount.y;  // y-up

执行光追TraceRays(raysPerProbe，probeCountPreLayer，volumeLayerCount)

// VolumeTrace
{
	auto& build = builder.CreateRayTracingPass(GetName() + "_VolumeTrace")
		.PassIndex(raysPerProbe, probeCountPreLayer, volumeLayerCount)
		.RootSignature(m_VolumeTraceRootSignature)
		.ReadWrite(1, 0, 0, rayTexture, VIEW_TYPE_2D_ARRAY, { TEXTURE_ASPECT_COLOR ,0,1,0,volumeLayerCount })
		.Read(1, 1, 0, dirShadowMap, VIEW_TYPE_2D_ARRAY, { TEXTURE_ASPECT_DEPTH ,0,1,0,4 })
		.Read(1, 3, 0, skyBox, VIEW_TYPE_CUBE, { TEXTURE_ASPECT_COLOR ,0,1,0,6 })
		.Read(1, 4, 0, irrandiance, VIEW_TYPE_2D_ARRAY, { TEXTURE_ASPECT_COLOR,0,1,0,volumeLayerCount })
		.Read(1, 5, 0, distance, VIEW_TYPE_2D_ARRAY, { TEXTURE_ASPECT_COLOR,0,1,0,volumeLayerCount })
		.Execute([&](RDGPassContext context) {
		RHICommandListRef command = context.command;
		command->SetRayTracingPipeline(m_VolumeTracePipeline);
		command->BindDescriptorSet(RENDER_RESOURCEMANAGER->GetGlobalResourcePerFrameDescriptorSet(), 0);
		command->BindDescriptorSet(context.descriptors[1], 1);
		command->TraceRays(context.passIndex[0], context.passIndex[1], context.passIndex[2]);
			});
	LightInfo& lightInfo = LightCollector::GetLightInfo();
	if (lightInfo.pointLightCount > 0) {
		RDGTextureHandle pointShadowMap = builder.GetTexture("Point Shadow Color[0]");
		build.Read(1, 2, 0, pointShadowMap, VIEW_TYPE_CUBE, { TEXTURE_ASPECT_COLOR,0,1,0,6 });
	}
}

光追Shader

RayGen中需要为每个探针的每条光线的击中点计算光照和阴影，并且混合历史信息（计算击中点的周围8个探针历史信息的irrandiance，作为击中点的间接光照（只计算漫反射部分））

struct Payload {
    vec3 albedo;
	float roughness; 
	vec3 worldPosition;
	float metallic;
	vec3 normal;
	float  hitT;
};


void main(){

    uint rayIndex = gl_LaunchIDEXT.x;
    uint probePlaneIndex = gl_LaunchIDEXT.y;
    uint planeIndex = gl_LaunchIDEXT.z;
    uint probeCountPrePlane = DDGIGetProbesPerPlane(volume.probeCount);  // x * z（y-up）
	uint probeIndex = (planeIndex * probeCountPrePlane) + probePlaneIndex; 
	uvec3 probeCoords = DDGIGetProbeCoords(probeIndex,volume); // 探针在探针网格的坐标
	vec3 probeWorldPosition = DDGIGetProbeWorldPosition(probeCoords, volume); 
	vec3 rayDirection = normalize(RTXGISphericalFibonacci(rayIndex,volume.raysPerProbe)); // 生成光线方向
    // 最终每根光线的计算结果都需要存储， Texture2DArray(x:rayIndex, y:probeIndexInLayer, z:layerIndex)
	uvec3 outputCoords = DDGIGetRayDataTexelCoords(rayIndex,probeIndex,volume);

    // 启动射线
	traceRayEXT(TLAS, 					// acceleration structure
		gl_RayFlagsOpaqueEXT,       	// rayFlags 控制光线的行为，比如是否忽略背面、是否启用 any-hit、是否可用 conservative tracing 等
		0xFF,           				// cullMask 0xFF → 匹配所有实例
		0,              				// sbtRecordOffset 索引到 Shader Binding Table (SBT) 的起始记录位置
		1,              				// sbtRecordStride SBT 中每条记录的间隔（单位是记录数，不是字节）
		0,              				// missIndex 当光线没有击中任何几何体时，使用 SBT 中 miss shader 的索引
		probeWorldPosition.xyz,     	// ray origin
		0,       						// ray min range
		rayDirection.xyz,  				// ray direction
		MAX_RAY_TRACING_DISTANCE,       // TODO:这个应该换成DDGI自己的参数设置
		0               				// payload (location = 0) payload的位置
  	);

    // Miss，返回天空的Radiance
    if(payload.hitT == -1.f){
        imageStore(out_RAYDATA, ivec3(outputCoords), vec4(payload.albedo, 1e27f));
        return;
	}

    // 击中背面，参考RTXGI的做法
    // Make the hit distance negative to mark a backface hit for blending, probe relocation, and probe classification.
	// Shorten the hit distance on a backface hit by 80% to decrease the influence of the probe during irradiance sampling.
    if(payload.hitKind == gl_HitKindBackFacingTriangleEXT){
    	imageStore(out_RAYDATA, ivec3(outputCoords), vec4(vec3(0), -payload.hitT * 0.2));
    	return;
	}

/////////////////////////////////////////////
// Directional Light TODO: 点光源和聚光   这里也是通过TraceRays来判断阴影的
/////////////////////////////////////////////
	vec3 brdf = (payload.albedo / PI);
	vec3 lighting = vec3(0.f);
	DirectionLight dirLight = GetDirectionLight();
	// 硬件在找到第一个 hit 后立即停止 | 跳过ClosestHitShader，直接返回rayGen | 所有模型都被视为不透明
	const uint rayFlags =gl_RayFlagsTerminateOnFirstHitEXT | gl_RayFlagsSkipClosestHitShaderEXT | gl_RayFlagsOpaqueEXT;
	// 发射光线计算遮挡
	traceRayEXT(TLAS,
		rayFlags,
		0xFF, 
		0, 
		1,
		1, 
		payload.worldPosition,
		0,   
		-dirLight.direction,
		MAX_RAY_TRACING_DISTANCE,
		1
  	);
	float shadowScale = 1.0;
	if(shadowPayload.hitT !=  -1.f){
		shadowScale = 0.0;
	}
    vec3 lightDirection = -normalize(dirLight.direction);
    float  nol = max(dot(payload.normal, lightDirection), 0.f);
	vec3 dirLighting = nol * dirLight.radiance * shadowScale;
	lighting += dirLighting;
	vec3 diffuse = lighting * brdf;


/////////////////////////////////////////////
// Indirection Light
/////////////////////////////////////////////
	vec3 irradiance = vec3(0);
	float volumeBlendWeight = DDGIGetVolumeBlendWeight(payload.worldPosition, volume);
	if (volumeBlendWeight > 0){

        irradiance = DDGIGetIrrandianceByWorldPosition(
            payload.worldPosition,
            payload.normal,
            volume,
            ddgi_Irrandiance,ddgi_Distance);
	}
	// Perfectly diffuse reflectors don't exist in the real world.
    // Limit the BRDF albedo to a maximum value to account for the energy loss at each bounce.
    float maxAlbedo = 0.9f;

    vec3 radiance = diffuse + ((min(payload.albedo, vec3(maxAlbedo, maxAlbedo, maxAlbedo)) / PI) * irradiance * volumeBlendWeight);

	// 最终存储rayData radiance(3) + hitT(1)
	imageStore(out_RAYDATA, ivec3(outputCoords), vec4(Saturate(radiance), payload.hitT));
}

closestHit需要获取击中点的模型信息

#ifdef RAYCLOSEST_HIT_SHADER
layout(location = 0) rayPayloadInEXT Payload payload;
hitAttributeEXT vec2 attribs;
void main()
{
	uint instanceID       = gl_InstanceCustomIndexEXT;   // 在构建TLAS时，给每个实例分配的ID
	uint primitiveID     = gl_PrimitiveID;  // 击中的三角形索引

	vec3 barycentrics = vec3(1.0 - attribs.x - attribs.y, attribs.x, attribs.y); 

	// 收集MeshInfo
	mat4 model = GetModelMatrix(instanceID);
	uvec3 triangleIndex = GetTriangleIndex(instanceID, primitiveID);
	vec4 position = GetTrianglePosition(instanceID,triangleIndex,barycentrics);
	vec3 meshNormal = GetTriangleMeshNormal(instanceID,triangleIndex,barycentrics);
	vec4 tangent = GetTriangleTangent(instanceID,triangleIndex,barycentrics);

	vec3 worldNormal = GetWorldNormal(meshNormal,model);
	vec4 worldTangent = GetWorldTangent(tangent,model);
	vec2 texCoord  = GetTriangleTexCoord(instanceID, triangleIndex, barycentrics);    
    vec4 worldPos       = model * position; 
	MaterialInfo material   = GetMaterialInfo(instanceID);
	vec4 albedo = GetDiffuse(material,texCoord);
	vec3 normal = GetNormal(material, texCoord, worldNormal, worldTangent);
    vec4 emission = GetEmission(material,texCoord);
	albedo += emission;
	float roughness = GetRoughness(material,texCoord);
    float metallic = GetMetallic(material, texCoord);

	payload.worldPosition = worldPos.xyz;
	payload.normal = normal;
	payload.roughness = roughness;
	payload.metallic = metallic;
	payload.albedo = albedo.rgb;
	payload.hitT = gl_HitTEXT;
	payload.hitKind = gl_HitKindEXT;
}
#endif

Miss处理未击中的情况，需要两个，一个处理天空，一个处理阴影判断标记（因为MissShader只支持一个Payload，好像只有RayGen可以定义多个PayLoad，其他都只能用于处理一个PayLoad）

#ifdef RAYMISS_SHADER
layout(location = 0) rayPayloadInEXT Payload payload;    // rayPayloadInEXT 注意是InEXT

layout(set = 1, binding = 3) uniform textureCube skyCube;
void main()
{
	vec3 rayDir = normalize(gl_WorldRayDirectionEXT);
    payload.albedo = texture(samplerCube(skyCube,SAMPLER[0]),rayDir).rgb;
	payload.hitT = -1;
}
#endif

#ifdef RAYMISS_SHADER
layout(location = 1) rayPayloadInEXT ShadowPayLoad shadowPayload;

void main()
{
	shadowPayload.hitT = -1;
}
#endif

RayTrace结束后，获得了每个探针的每条光线携带的Radiance信息

另外还会在着色点采样它周围8个探针的光照数据（就是上一帧的记录，也是该着色点的间接光照）这样做相当于得到了采样点的间接光照

ProbeBlend

根据RayData来更新探针信息

IrrandianceBlend

探针理论上需要存储每个方向上的半球积分来得到该位置的Irrandiance，但是存储所有方向不太可能，DDGI采用6*6的像素存储一个探针36个方向上的Irrandiance，使用时进行插值即可，另外使用八面体映射，遍历每个探针，保存一个6 * 6区域，每个区域都被映射到八面体上的一个方向，再把这个方向挪到球面，遍历所有光线与该方向的权重进行混合

注意Texture2DArray的采样的uvw的w不是0-1,用第几层就传递几，这点疏忽了给我整麻了

// dispatch 需要处理网格中的每一个探针，所以传入的是probeCount.x, probeCount.y, probeCount.z
{
        // Irrandiance Blend
        builder.CreateComputePass(GetName() + "_ProbeIrrandianceBlend")
            .ReadWrite(1, 0, 0, irrandiance, VIEW_TYPE_2D_ARRAY, { TEXTURE_ASPECT_COLOR ,0,1,0,volumeLayerCount })
            .ReadWrite(1, 1, 0, rayTexture, VIEW_TYPE_2D_ARRAY, { TEXTURE_ASPECT_COLOR ,0,1,0,volumeLayerCount })
            .RootSignature(m_ProbeIrrandianceBlendRootSignature)
            .PassIndex(probeCount.x, probeCount.z, probeCount.y)
            .Execute([&](RDGPassContext context) {
            RHICommandListRef command = context.command;
            command->SetComputePipeline(m_ProbeIrrandianceBlendPipeline);
            command->BindDescriptorSet(RENDER_RESOURCEMANAGER->GetGlobalResourcePerFrameDescriptorSet(), 0);
            command->BindDescriptorSet(context.descriptors[1], 1);
            command->Dispatch(context.passIndex[0], context.passIndex[1], context.passIndex[2]);
                })
            .Finish();
    }

layout(set = 1, rgba32f, binding = 0) uniform image2DArray o_Texture;
layout(set = 1, rgba32f, binding = 1) uniform image2DArray  IN_RayData;
// 每个探针需要8*8的区域，所以这里线程组设置就是8*8（内部6*6是数据，外部一圈是填充，为了保证双线性插值的正确性）
layout(local_size_x = DDGI_PROBE_NUM_TEXELS_IRRANDIANCE, local_size_y = DDGI_PROBE_NUM_TEXELS_IRRANDIANCE, local_size_z = 1) in;

void main(){
    // 索引探针在RayData的位置
    DDGISetting volume = GetDDGISetting();
    uvec3 groupID = gl_WorkGroupID;  // 对于dispatch的ID
    uvec3 invocationID = gl_GlobalInvocationID; // 相对于全局的调用ID 用于最后存储像素位置
    uvec3 LocalInvocationID = gl_LocalInvocationID; // 相对于组内的调用ID 用于区别边界和内部
    // 用LocalInvocationID是不是0，0或者 7，7 马上就能判断是不是边界
    bool isBorderTexel = (LocalInvocationID.x == 0 || LocalInvocationID.x == (DDGI_PROBE_NUM_TEXELS_IRRANDIANCE_INTERIOR + 1)) || (LocalInvocationID.y == 0 || LocalInvocationID.y == (DDGI_PROBE_NUM_TEXELS_IRRANDIANCE_INTERIOR + 1));
    
    // 
    uint probeIndex = (groupID.y * DDGIGetProbesPerPlane(volume.probeCount)) + groupID.z * volume.probeCount.x + groupID.x ;

    // Early out: no probe maps to this thread 感觉不会出现这种情况
    uint numProbes = (volume.probeCount.x * volume.probeCount.y * volume.probeCount.z);
    if (probeIndex >= numProbes || probeIndex < 0) return;
    
    vec4 result = vec4(0.0);
    
    // 首先处理内部6*6
    if(!isBorderTexel){
        // 对于6*6区域的一个像素，对应到探针的一个方向上，需要计算这个方向上的半球积分来存储Irrandiance
        // 1. 获取这个像素对应的方向
        uvec3 threadCoords = uvec3(groupID.x * DDGI_PROBE_NUM_TEXELS_IRRANDIANCE_INTERIOR, groupID.y * DDGI_PROBE_NUM_TEXELS_IRRANDIANCE_INTERIOR, invocationID.z) + LocalInvocationID - uvec3(1, 1, 0); // 计算出抛开边界后当前线程是的坐标（没有边界填充的2DArray坐标）
        // 把6*6区域当作一个纹理，下面获得当前线程处理的位置的UV坐标[-1,1]
        vec2 probeOctantUV = DDGIGetNormalizedOctahedralCoordinates(uvec2(threadCoords.xy), DDGI_PROBE_NUM_TEXELS_IRRANDIANCE_INTERIOR);
        // 获取这个UV对应到八面体上的方向
    	vec3 probeRayDirection = DDGIGetOctahedralDirection(probeOctantUV);

        
        // 遍历当前探针的所有光线，为当前八面体上的方向计算irrandiance
        for (uint rayIndex = 0; rayIndex < volume.raysPerProbe; rayIndex++){
            // 获取ray的方向，RTXGISphericalFibonacci是可以复现的所以不需要提前存储
            vec3 rayDirection = normalize(RTXGISphericalFibonacci(rayIndex,volume.raysPerProbe));  // TODO: 优化点，因为每个探针计算这个都是一模一样的
            // 当前要存储的方向与这跟光线的cos，两个方向夹角越小，权重越大
            float weight = max(0.0, dot(probeRayDirection, rayDirection));
            // 解析RayData中的信息
            uvec3 rayDataTexCoords = DDGIGetRayDataTexelCoords(rayIndex, probeIndex, volume);  
            vec4 storedData = imageLoad(IN_RayData, ivec3(rayDataTexCoords));
            vec3 probeRayRadiance = storedData.xyz;
            float probeRayDistance = storedData.w;
            if(probeRayDistance < 0){ // 击中的是背面
                continue;
            }
            result += vec4(probeRayRadiance * weight, weight);
        }

        // 到这里 用vec4存储了所有光线的加权和，并且w分量存储了权重和，方便计算
//////////////////////////////工程化修正/////////////////////////////////////////////
        float epsilon = float(volume.raysPerProbe);
        epsilon *= 1e-9f;
        result.rgb *= 1.f / (1.f * max(result.a, epsilon));

        // 时域加权混合
        vec4 history = imageLoad(o_Texture,ivec3(gl_GlobalInvocationID));
        vec3 delta = (result.rgb - history.rgb);

        float  hysteresis = 0.97; // TODO：混合系数是参数
        if (dot(history, history) == 0) hysteresis = 0.f;
        float probeIrradianceEncodingGamma = 5.0f;  // TODO：编码Gamma是参数
        
        result.rgb = pow(result.rgb, vec3(1.f / probeIrradianceEncodingGamma));
        vec3 irradianceSample = result.rgb;
        float probeIrradianceThreshold = 0.25f; // TODO：阈值是参数
        if (RTXGIMaxComponent(history.rgb - result.rgb) > probeIrradianceThreshold)
        {
            // Lower the hysteresis when a large lighting change is detected
            hysteresis = max(0.f, hysteresis - 0.75f);
        }
        float probeBrightnessThreshold  = 0.10f; // TODO：阈值是参数
        if (RGBtoLuminance(delta) > probeBrightnessThreshold)
        {
            // Clamp the maximum per-update change in irradiance when a large brightness change is detected
            delta *= 0.25f;
        }
        const float c_threshold = 1.f / 1024.f;
        vec3 lerpDelta = (1.f - hysteresis) * delta;
        if (RTXGIMaxComponent(result.rgb) < RTXGIMaxComponent(history.rgb))
        {
            lerpDelta = min(max(vec3(c_threshold), abs(lerpDelta)), abs(delta)) * sign(lerpDelta);
        }
        result = vec4(history.rgb + lerpDelta, 1.f);
        imageStore(o_Texture, ivec3(gl_GlobalInvocationID), result);
///////////////////////////////////////////////////////////////////////////
        
        
        // 边界处理
       else{
        // 边界
        // AllMemoryBarrierWithGroupSync();   这里有一个同步点 

        bool isCornerTexel = (LocalInvocationID.x == 0 || LocalInvocationID.x == (DDGI_PROBE_NUM_TEXELS_IRRANDIANCE - 1)) && (LocalInvocationID.y == 0 || LocalInvocationID.y == (DDGI_PROBE_NUM_TEXELS_IRRANDIANCE - 1));
        bool isRowTexel = (LocalInvocationID.x > 0 && LocalInvocationID.x < (DDGI_PROBE_NUM_TEXELS_IRRANDIANCE - 1));

        uvec3 copyCoordinates = uvec3(groupID.x * DDGI_PROBE_NUM_TEXELS_IRRANDIANCE, groupID.y * DDGI_PROBE_NUM_TEXELS_IRRANDIANCE, invocationID.z);

        if(isCornerTexel)
        {
            copyCoordinates.x += LocalInvocationID.x > 0 ? 1 : DDGI_PROBE_NUM_TEXELS_IRRANDIANCE_INTERIOR;
            copyCoordinates.y += LocalInvocationID.y > 0 ? 1 : DDGI_PROBE_NUM_TEXELS_IRRANDIANCE_INTERIOR;
        }
        else if(isRowTexel)
        {
            copyCoordinates.x += (DDGI_PROBE_NUM_TEXELS_IRRANDIANCE - 1) - LocalInvocationID.x;
            copyCoordinates.y += LocalInvocationID.y + ((LocalInvocationID.y > 0) ? -1 : 1);
        }
        else // Column Texel
        {
            copyCoordinates.x += LocalInvocationID.x + ((LocalInvocationID.x > 0) ? -1 : 1);
            copyCoordinates.y += (DDGI_PROBE_NUM_TEXELS_IRRANDIANCE - 1) - LocalInvocationID.y;
        }

        imageStore(o_Texture, ivec3(gl_GlobalInvocationID), imageLoad(o_Texture, ivec3(copyCoordinates)));
    }
}

DistanceBlend

对于distance，只有一些地方不一样

#version 450 core
#include "../common/common.glsl"
#include "../common/DDGI.glsl"
layout(set = 1, rgba32f, binding = 0) uniform image2DArray o_Texture;
layout(set = 1,rgba32f, binding = 1) uniform image2DArray  IN_RayData;
#ifdef COMPUTE_SHADER
layout(local_size_x = DDGI_PROBE_NUM_TEXELS_DISTANCE, local_size_y = DDGI_PROBE_NUM_TEXELS_DISTANCE, local_size_z = 1) in;  
void main(){
	DDGISetting volume = GetDDGISetting();
    uvec3 groupID = gl_WorkGroupID;  // 对于dispatch的ID
    uvec3 invocationID = gl_GlobalInvocationID; // 相对于全局的调用ID
    uvec3 LocalInvocationID = gl_LocalInvocationID; // 相对于组内的调用ID
    bool isBorderTexel = (LocalInvocationID.x == 0 || LocalInvocationID.x == (DDGI_PROBE_NUM_TEXELS_DISTANCE_INTERIOR + 1)) || (LocalInvocationID.y == 0 || LocalInvocationID.y == (DDGI_PROBE_NUM_TEXELS_DISTANCE_INTERIOR + 1));
    uint probeIndex = (groupID.y * DDGIGetProbesPerPlane(volume.probeCount)) + groupID.z * volume.probeCount.x + groupID.x ;

    vec4 result = vec4(0.0);

    if(!isBorderTexel){
        uvec3 threadCoords = uvec3(groupID.x * DDGI_PROBE_NUM_TEXELS_DISTANCE_INTERIOR, groupID.y * DDGI_PROBE_NUM_TEXELS_DISTANCE_INTERIOR, invocationID.z) + LocalInvocationID - uvec3(1, 1, 0);
        vec2 probeOctantUV = DDGIGetNormalizedOctahedralCoordinates(uvec2(threadCoords.xy), DDGI_PROBE_NUM_TEXELS_DISTANCE_INTERIOR);
        vec3 probeRayDirection = DDGIGetOctahedralDirection(probeOctantUV);
        // 遍历当前探针的所有光线
        for (uint rayIndex = 0; rayIndex < volume.raysPerProbe; rayIndex++){
            vec3 rayDirection = normalize(RTXGISphericalFibonacci(rayIndex, volume.raysPerProbe));
            float weight = max(0.f, dot(probeRayDirection, rayDirection));
            float probeDistanceExponent = 50.f; // TODO:参数
             // Increase or decrease the filtered distance value's "sharpness"
            weight = pow(weight, probeDistanceExponent);
            uvec3 rayDataTexCoords = DDGIGetRayDataTexelCoords(rayIndex, probeIndex, volume);
            // 光线最大能射到probe间距的1.5倍
            float probeMaxRayDistance = length(volume.gridStep) * 1.5f;
            vec4 storedData = imageLoad(IN_RayData, ivec3(rayDataTexCoords));
            float probeRayDistance = storedData.w;
            probeRayDistance = min(abs(probeRayDistance),probeMaxRayDistance);
            result += vec4(probeRayDistance * weight, (probeRayDistance * probeRayDistance) * weight, 0.f, weight);
        }
//////////////////////////////工程化修正/////////////////////////////////////////////
        float epsilon = float(volume.raysPerProbe);
        epsilon *= 1e-9f;
        result.rgb *= 1.f / (1.f * max(result.a, epsilon));

        // 时域加权混合
        vec4 history = imageLoad(o_Texture,ivec3(gl_GlobalInvocationID));
        float  hysteresis = 0.97; // TODO：混合系数是参数
        if (dot(history, history) == 0) hysteresis = 0.f;
        result = vec4(Lerp(result.rg, history.rg, hysteresis), 0.f, 1.f);
//////////////////////////////工程化修正/////////////////////////////////////////////
        imageStore(o_Texture, ivec3(gl_GlobalInvocationID), result);
        return;

    }else{
        // 边界
        memoryBarrier();        // 所有全局内存类型的屏障
        memoryBarrierShared();  // 对 shared 内存屏障
        barrier();   //这里有一个同步点 


        bool isCornerTexel = (LocalInvocationID.x == 0 || LocalInvocationID.x == (DDGI_PROBE_NUM_TEXELS_DISTANCE - 1)) && (LocalInvocationID.y == 0 || LocalInvocationID.y == (DDGI_PROBE_NUM_TEXELS_IRRANDIANCE - 1));
        bool isRowTexel = (LocalInvocationID.x > 0 && LocalInvocationID.x < (DDGI_PROBE_NUM_TEXELS_DISTANCE - 1));

        uvec3 copyCoordinates = uvec3(groupID.x * DDGI_PROBE_NUM_TEXELS_DISTANCE, groupID.y * DDGI_PROBE_NUM_TEXELS_DISTANCE, invocationID.z);

        if(isCornerTexel)
        {
            copyCoordinates.x += LocalInvocationID.x > 0 ? 1 : DDGI_PROBE_NUM_TEXELS_DISTANCE_INTERIOR;
            copyCoordinates.y += LocalInvocationID.y > 0 ? 1 : DDGI_PROBE_NUM_TEXELS_DISTANCE_INTERIOR;
        }
        else if(isRowTexel)
        {
            copyCoordinates.x += (DDGI_PROBE_NUM_TEXELS_DISTANCE - 1) - LocalInvocationID.x;
            copyCoordinates.y += LocalInvocationID.y + ((LocalInvocationID.y > 0) ? -1 : 1);
        }
        else // Column Texel
        {
            copyCoordinates.x += LocalInvocationID.x + ((LocalInvocationID.x > 0) ? -1 : 1);
            copyCoordinates.y += (DDGI_PROBE_NUM_TEXELS_DISTANCE - 1) - LocalInvocationID.y;
        }

        imageStore(o_Texture, ivec3(gl_GlobalInvocationID), imageLoad(o_Texture, ivec3(copyCoordinates)));
    }

}

#endif

IndirectLight

/*
    根据一个世界坐标，计算从探针中获取的Irrandiance
*/
vec3 DDGIGetIrrandianceByWorldPosition(vec3 worldPosition, vec3 direction, DDGISetting volume, texture2DArray IrrdianceTexture,texture2DArray distanceTexture){

    // 如果WorldPosition不在DDGIvolume内，直接返回
    // if(!DDGICheckPostion(worldPosition,volume)){
    //     return vec3(0.f, 0.f, 0.f);
    // }
    vec3  sumIrradiance = vec3(0.0f);
    float sumWeight = 0.0f;

    vec3 irradiance = vec3(0.f, 0.f, 0.f);
    float accumulatedWeights = 0.f;
    // 得到离worldPosition最近的探针坐标
    ivec3 baseProbeCoords = DDGIGetBaseProbeGridCoords(worldPosition, volume);
    vec3 baseProbeWorldPosition = DDGIGetProbeWorldPosition(baseProbeCoords,volume);
    vec3 alpha = clamp(((worldPosition - baseProbeWorldPosition) / volume.gridStep), vec3(0.f, 0.f, 0.f), vec3(1.f, 1.f, 1.f));

    for(int i = 0; i < 8; i++){
        float weight = 1.0;
        // 使用魔法获得一个探针😄
        ivec3  offset  = ivec3(i, i >> 1, i >> 2) & ivec3(1);
        ivec3  probeGridCoord   = clamp(baseProbeCoords + offset, ivec3(0), ivec3(volume.probeCount) - ivec3(1));
        uint probeIndex =  (probeGridCoord.y * DDGIGetProbesPerPlane(volume.probeCount)) + probeGridCoord.z * volume.probeCount.x + probeGridCoord.x;
        vec3 probePos = DDGIGetProbeWorldPosition(probeGridCoord, volume);

        // 方向系数
        {
            vec3 directionToProbe = normalize(probePos - worldPosition);
            weight *= Square(max(0.0001, (dot(directionToProbe, direction) + 1.0) * 0.5)) + 0.2;  
        }

        //切比雪夫系数
        {
            vec3 probeToPoint   = worldPosition - probePos;
            vec3 dir            = normalize(-probeToPoint);
            float dist          = length(probeToPoint);
            vec2 octantCoords = DDGIGetOctahedralCoordinates(dir);
            vec3 probeTextureUV = DDGIGetProbeUV(int(probeIndex), octantCoords, int(DDGI_PROBE_NUM_TEXELS_DISTANCE_INTERIOR), volume);
            vec2 temp = texture(sampler2DArray(distanceTexture,SAMPLER[0]),probeTextureUV).rg;  // 采样距离纹理
            float mean      = temp.x;
            float variance  = abs(Square(temp.x) - temp.y);

            float chebyshev = variance / (variance + Square(max(dist - mean, 0.0)));
            chebyshev       = max(Pow3(chebyshev), 0.0);  //以切比雪夫系数三次方作为权重

            weight *= (dist <= mean) ? 1.0 : chebyshev;
        }

        //避免计算精度问题
        {
            weight = max(0.000001, weight); 

            const float crushThreshold = 0.2f;
            if (weight < crushThreshold)
                weight *= weight * weight * (1.0f / Square(crushThreshold)); 
        }

        //三线性插值系数
        {
            vec3 trilinear = mix(1.0 - alpha, alpha, offset);
            weight *= trilinear.x * trilinear.y * trilinear.z;  
        }

        //采样，累计光照      
        {
            vec3 irradianceDir  = direction;
            vec2 octantCoords = DDGIGetOctahedralCoordinates(direction);
            vec3 probeTextureUV = DDGIGetProbeUV(int(probeIndex), octantCoords, int(DDGI_PROBE_NUM_TEXELS_IRRANDIANCE_INTERIOR), volume);
            vec3 probeIrradiance = texture(sampler2DArray(IrrdianceTexture,SAMPLER[0]),probeTextureUV).rgb;
            sumIrradiance += weight * probeIrradiance;
            sumWeight += weight;
        }

    }

    vec3 netIrradiance = sumIrradiance / sumWeight;
    return 2 * PI * netIrradiance; 
}

下图显示只渲染间接光

Math

首先回顾Irrandiance是单位半球上各个方向的Radiance的积分（×cos）

均匀分布的蒙特卡洛积分来近似上边这个积分式

DDGI存储一个Irrandiance时，并不是/N，而是/余弦权重之和，目的是减少方差

他的期望是N/2,对比蒙特卡洛积分还需要*2

总结

第一次实现比较复杂的全局光照效果，还是太逞能，总想抄RTXGI的各种实践Tick，实际根本理解不了。甚至还想着用Y-Up来构建Imager2DArray，导致逻辑十分混乱。大量时间用在了无用的调试Bug上。
还有一些DDGI的内容没有实现
1. RelocationVolumeProbes：读取一个探针交中背面的次数，如果大于阈值，说明Probe在墙里边，就朝着交中背面的方向偏移，或者交中正面的距离太短了，也进行偏移
2. ClassifyVolumeProbes：Classify主要是为了给probe进行分类，对于一些卡在墙中或者不在视野内的probe则不进行计算，以节省开销，当然，更重要的是，这个还能避免计算墙外probe，一定程度上减少漏光
总体来看第一次搞大动作比较失败~

游戏引擎开发实践（抗锯齿 TAA）

Thu, 04 Dec 2025 18:58:15 +0800

总体来看TAA思想比较简单易懂，实现思路更多是实践性的经验总结

TAA

TAA (Temporal Anti-Aliasing) 综合历史帧的数据来实现抗锯齿，这样会将每个像素点的多次采样均摊到多个帧中，相对的开销要小得多。在 MSAA 中，我们在一帧中，在每个像素中放置了多个次像素采样点。在 TAA 中，我们实现的方式，就是在每帧采样时，将采样的点进行偏移，实现抖动 (jitter)。

静态场景

在静态场景下，上一帧与本帧的颜色信息很好获得，只需要取相同位置进行采样，然后进行一个插值即可，然后用jitter进行抖动

1
2
3

float3 currColor = currBuffer.Load(pos);
float3 historyColor = historyBuffer.Load(pos);
return lerp(historyColor, currColor, 0.05f);

这里的取混合系数为0.05，意味着最新的一帧渲染结果，只对最终结果产生了5%的贡献。

将累计的过程展开来看的话，可以看出当前帧 TAA 后的结果，是包含了所有的历史帧结果的，说明这种方式是合理的：

在 TAA 中，我们实现的方式，就是在每帧采样时，将采样的点进行偏移，实现抖动 (jitter)。采样点抖动的偏移，是和 MSAA 的次像素采样点放置是相同的，都需要使用低差异的采样序列，来实现更好的抗锯齿效果。TAA 中都会直接使用 Halton 序列，采样的点位置如下所示：

1
2
3

// 先将Halton序列的值转化为 -0.5~0.5范围的偏移；再除以屏幕长度，得到UV下的偏移值；最后乘以2，是转化到裁剪空间中的偏移值
ProjectionMatrix.m02 += (HaltonSequence[Index].x - 0.5f) / ScreenWidth * 2;
ProjectionMatrix.m12 += (HaltonSequence[Index].y - 0.5f) / ScreenHeight * 2;

动态物体

要对历史数据进行混合，就要能够还原出当前物体在屏幕中投影的位置。为了能够精确地记录物体在屏幕空间中的移动，我们使用 Motion Vector 贴图来记录物体在屏幕空间中的变化距离，表示当前帧和上一帧中，物体在屏幕空间投影坐标的变化值

记录上一帧的投影矩阵和上一帧的模型位置，在本帧使用上一帧的透视变换逆变换就能把模型还原到上一帧的视角下，在上一帧视角下对比两帧模型的位置来拿到Motion Vector（这种有点麻烦，实战不用这种方案）

使用 MotionVector

已经知道模型的运动变化了，在本帧中复原模型到上一帧的位置，算出对应的屏幕坐标

// 减去抖动坐标值，得到当前实际的像素中心UV值
uv -= _Jitter;
// 减去Motion值，算出上帧的投影坐标
float2 uvLast = uv - motionVectorBuffer.Sample(point, uv);
//使用双线性模式采样
float3 historyColor = historyBuffer.Sample(linear, uvLast);

这样使用也是有问题的。比如一扇门，本来模型在门后，现在向右位移模型出现，但是按照MontionVector去采样上一帧的颜色时，其实采样到了门上。

因此为了得到更加平滑的数据，可以在当前像素点周围判断深度，取距离镜头最近的点位置，来采样 Motion Vector 的值，这样可以减弱遮挡错误的影响。

优化手法：使用 lerp 代替 if-else，可以在 GPU 并行计算中避免分支，提高效率

float2 GetClosestFragment(float2 uv)
{
    float2 k = _CameraDepthTexture_TexelSize.xy;
    //在上下左右四个点
    const float4 neighborhood = float4(
        SAMPLE_DEPTH_TEXTURE(_CameraDepthTexture, sampler_PointClamp, clamp(uv - k)),
        SAMPLE_DEPTH_TEXTURE(_CameraDepthTexture, sampler_PointClamp, clamp(uv + float2(k.x, -k.y))),
        SAMPLE_DEPTH_TEXTURE(_CameraDepthTexture, sampler_PointClamp, clamp(uv + float2(-k.x, k.y))),
        SAMPLE_DEPTH_TEXTURE(_CameraDepthTexture, sampler_PointClamp, clamp(uv + k))
    );
    // 获取离相机最近的点
    #if defined(UNITY_REVERSED_Z)
        #define COMPARE_DEPTH(a, b) step(b, a)
    #else
        #define COMPARE_DEPTH(a, b) step(a, b)
    #endif
    // 获取离相机最近的点，这里使用 lerp 是避免在shader中写分支判断
    float3 result = float3(0.0, 0.0, SAMPLE_DEPTH_TEXTURE(_CameraDepthTexture, sampler_PointClamp, uv));
    result = lerp(result, float3(-1.0, -1.0, neighborhood.x), COMPARE_DEPTH(neighborhood.x, result.z));
    result = lerp(result, float3( 1.0, -1.0, neighborhood.y), COMPARE_DEPTH(neighborhood.y, result.z));
    result = lerp(result, float3(-1.0,  1.0, neighborhood.z), COMPARE_DEPTH(neighborhood.z, result.z));
    result = lerp(result, float3( 1.0,  1.0, neighborhood.w), COMPARE_DEPTH(neighborhood.w, result.z));
    return (uv + result.xy * k);
}

//在周围像素中，寻找离相机最近的点
float2 closest = GetClosestFragment(uv);
//使用周围最近点，得到Velocity值，来计算上帧投影位置
float2 uvLast = uv - motionVectorBuffer.Sample(point, closest);
//...

另外对应历史点的采样，可以使用 Catmull–Rom 采样进行进一步优化，而不是使用默认的双线性采样

因为使用了双线性采样，所以得到的值会混合周围像素的颜色，造成结果略微模糊。如果想要使得到的历史结果质量更好，也可以使用一些特殊的过滤方式进行处理。比如UE4中使用 Catmull–Rom 的方式进行锐化过滤。Catmull-Rom方式的采样，会在目标点周围进行 5 次采样，然后根据相应权重进行过滤混合，额外的开销也非常大。

历史结果处理

由于像素抖动，模型变化，渲染光照变化导致渲染结果发生变化时，会导致历史帧得到的像素值失效，就会产生 鬼影/ghosting 和 闪烁 /flicking 问题。

为了缓解鬼影和闪烁的问题，我们还要对采样的历史帧和当前帧数据进行对比，将历史帧数据 clamp/截断 在合理的范围内。要确定当前帧目标像素的亮度范围，就需要读取当前帧数据目标像素周围 5 个或者 9 个像素点的颜色范围：

简单的做法就是直接进行 clamp：就是先在当前位置像素领域内判断颜色范围，之后采样历史点时把历史点的颜色clamp到这个范围内，防止它颜色变化太大

float3 AABBMin, AABBMax;
AABBMax = AABBMin = RGBToYCoCg(Color);
// 取得YCoCg色彩空间下，Clip的范围
for(int k = 0; k < 9; k++)
{
    float3 C = RGBToYCoCg(_MainTex.Sample(sampler_PointClamp, uv, kOffsets3x3[k]));
    AABBMin = min(AABBMin, C);
    AABBMax = max(AABBMax, C);
}
// 需要 Clip处理的历史数据
float3 HistoryYCoCg = RGBToYCoCg(HistoryColor);

// 简单地进行Clmap
float3 ResultYCoCg =  clmap(History, AABBMin, AABBMax);
//还原到RGB色彩空间，得到最终结果
HistoryColor.rgb = YCoCgToRGB(ResultYCoCg));

另外一种做法是进行 clip，clip的效果会更好，计算量也会相对较大二者的差别可从下图看出：

Clip和Clamp的区别，clamp简单粗暴地把颜色固定到范围角点上，clip则效果更好，首先获取范围内颜色的中间值，然后从历史点颜色发送射线到中间值，取射线与AABB盒交点位置的颜色值

混合结果

1
2
3

// 与上帧相比移动距离越远，就越倾向于使用当前的像素的值
blendFactor = saturate(0.05 + length(motion) * 100);
return lerp(historyColor, currColor, blendFactor);

因为我们用到了很多双线性采样，会使得得到的结果有些模糊，因此我们根据情况选择是否对结果进行一次简单的锐化。

实战

MotionVector

这块逻辑很清晰。因为模型在世界的位置只取决于模型实例的Model变换。而模型在屏幕像素的位置取决于投影矩阵和摄像机矩阵。所以每个模型都需要额外存储一个glm::mat4来存储上一帧的模型变换，摄像机也需要额外存储上一帧的投影矩阵（不过这个一般不会变），已经上一帧的View矩阵

在GBufferPass时，获取模型上一帧的Model矩阵，在FragShader中，根据像素存储插值出来的本帧Position和上帧Position进行计算，得到MotionVector

vec2 CalculateVelocity(vec4 pos, vec4 prevPos){
    vec4 curNDC  = CAMERAINFO.data.proj * CAMERAINFO.data.view * pos;
    curNDC /= curNDC.w;
    vec2 curUV = curNDC.xy * 0.5 + 0.5;
    vec4 prevNDC = CAMERAINFO.data.prevProj * CAMERAINFO.data.prevView * prevPos;
    prevNDC /= prevNDC.w;
    vec2 prevUV = prevNDC.xy * 0.5 + 0.5;
    return vec2(curUV.xy - prevUV.xy);  // MotionVector存储的是当前像素与上一帧中该位置信息所在的像素的偏移增量
}

混合历史信息

在TAApass，读取当前ViewPort，根据MotionVector把像素值偏移到上一帧位置，读取历史信息，混合历史信息和当前信息

#version 450 core
#include "../common/common.glsl"
#ifdef COMPUTE_SHADER

layout(set = 1,binding = 0,rgba32f) uniform image2D out_texture;
layout(set = 1,binding = 1) uniform texture2D velocityTexture;
layout(set = 1,binding = 2) uniform texture2D historyTexture;
layout(set = 1,binding = 3) uniform texture2D curTexture;
layout(set = 1,binding = 4) uniform texture2D depthTexture;


vec2 GetClosestFragment(vec2 uv)
{
    vec2 k = 1.0 / vec2(imageSize(out_texture)); 
    
    float depth0 = texture(sampler2D(depthTexture, SAMPLER[0]), clamp(uv - k, 0.0, 1.0)).r;
    float depth1 = texture(sampler2D(depthTexture, SAMPLER[0]), clamp(uv + vec2(k.x, -k.y), 0.0, 1.0)).r;
    float depth2 = texture(sampler2D(depthTexture, SAMPLER[0]), clamp(uv + vec2(-k.x, k.y), 0.0, 1.0)).r;
    float depth3 = texture(sampler2D(depthTexture, SAMPLER[0]), clamp(uv + k, 0.0, 1.0)).r;
    
    vec4 neighborhood = vec4(depth0, depth1, depth2, depth3);

    #define COMPARE_DEPTH(a, b) step(a, b)


    vec3 result = vec3(0.0, 0.0, texture(sampler2D(depthTexture, SAMPLER[0]), uv).r);
    
    result = mix(result, vec3(-1.0, -1.0, neighborhood.x), COMPARE_DEPTH(neighborhood.x, result.z));
    result = mix(result, vec3( 1.0, -1.0, neighborhood.y), COMPARE_DEPTH(neighborhood.y, result.z));
    result = mix(result, vec3(-1.0,  1.0, neighborhood.z), COMPARE_DEPTH(neighborhood.z, result.z));
    result = mix(result, vec3( 1.0,  1.0, neighborhood.w), COMPARE_DEPTH(neighborhood.w, result.z));

    #undef COMPARE_DEPTH
    return uv + result.xy * k;
}

layout(local_size_x = 16, local_size_y = 16, local_size_z = 1) in;
void main()
{
    // TODO: 此处的重投影逻辑可能在别的地方一会用到，应该写成单独的一个pass,把重投影后的UV写在一个纹理中
    ivec2 imgSize = ivec2(imageSize(out_texture));
    ivec2 invocID = ivec2(gl_GlobalInvocationID.xy);
    if (invocID.x >= imgSize.x || invocID.y >= imgSize.y) 
        return;
    vec2 texCoords = (vec2(invocID) + 0.5f) / vec2(imgSize);

    vec2 ClosestUv = GetClosestFragment(texCoords);

    vec2 velocity = texture(sampler2D(velocityTexture,SAMPLER[0]), ClosestUv).rg;  // 用采样点周围离摄像头最近的深度的UV来采样速度值
    vec2 historyTexCoords = texCoords - velocity;
    bool valid = historyTexCoords.x > 0.0f ? true : false;

    float blend = 0.95f;
    if(!valid)  blend = 1.0f;

    vec3 historyColor = texture(sampler2D(historyTexture,SAMPLER[0]), historyTexCoords).rgb;
    vec3 curColor = texture(sampler2D(curTexture,SAMPLER[0]), texCoords).rgb;
    vec3 mixColor = mix(curColor,historyColor, blend);
    imageStore(out_texture, invocID, vec4(mixColor, 1.0));
}

#endif

当然目前只是简单混合了颜色，渲染结果能看出来TAA的效果，但是移动物体或者摄像机时，鬼影十分严重

处理拖影

对比当前数据和历史数据，把历史数据clamp到合理范围内

#version 450 core
#include "../common/common.glsl"
#include "../common/TAA.glsl"
#include "../common/math.glsl"
#ifdef COMPUTE_SHADER

layout(set = 1,binding = 0,rgba32f) uniform image2D out_texture;
layout(set = 1,binding = 1) uniform texture2D velocityTexture;
layout(set = 1,binding = 2) uniform texture2D historyTexture;
layout(set = 1,binding = 3) uniform texture2D curTexture;
layout(set = 1,binding = 4) uniform texture2D depthTexture;

layout(local_size_x = 16, local_size_y = 16, local_size_z = 1) in;

void main()
{
    ivec2 invocID = ivec2(gl_GlobalInvocationID.xy);
    ivec2 imgSize = ivec2(imageSize(out_texture));
    if (invocID.x >= imgSize.x || invocID.y >= imgSize.y) 
        return;
    if(GetPostprocessSetting().TaaSetting.enable == 0){
        vec2 texCoords = (vec2(invocID) + 0.5f) / vec2(imgSize);
        vec3 curColor = texture(sampler2D(curTexture,SAMPLER[0]), texCoords).rgb;
        imageStore(out_texture, invocID, vec4(curColor, 1.0));
        return;
    }
    vec2 texelSize = 1.0 / vec2(imgSize);
    vec2 baseTexCoords = (vec2(invocID) + 0.5f) / vec2(imgSize);
    vec2 jitterUV = GetPostprocessSetting().TaaSetting.UVjetter * texelSize;
    vec2 texCoordsWithJitter = baseTexCoords + jitterUV;

    vec2 ClosestUv = GetClosestFragment(baseTexCoords, texelSize, depthTexture);
    vec2 velocity = texture(sampler2D(velocityTexture,SAMPLER[0]), ClosestUv).rg;
    vec2 historyTexCoords = baseTexCoords - velocity; 

    // 采样当前帧（带抖动）、历史帧（无抖动）颜色
    vec3 historyColor = texture(sampler2D(historyTexture,SAMPLER[0]), historyTexCoords).rgb;
    vec3 curColor = texture(sampler2D(curTexture,SAMPLER[0]), texCoordsWithJitter).rgb;

    const vec2 kOffsets3x3[9] = {
        vec2(-1.0, -1.0), vec2( 0.0, -1.0), vec2( 1.0, -1.0),
        vec2(-1.0,  0.0), vec2( 0.0,  0.0), vec2( 1.0,  0.0),
        vec2(-1.0,  1.0), vec2( 0.0,  1.0), vec2( 1.0,  1.0)
    };

    // fix 拖影：3x3邻域使用带抖动的UV，且钳位边界
    vec3 AABBMin = RGBToYCoCg(curColor);
    vec3 AABBMax = AABBMin;
    for(int k = 0; k < 9; k++)
    {
        vec2 uvOffset = kOffsets3x3[k] * texelSize;
        vec2 neighborUV = texCoordsWithJitter + uvOffset;
        neighborUV = clamp(neighborUV, 0.0, 1.0);
        vec3 C = RGBToYCoCg(texture(sampler2D(curTexture, SAMPLER[0]), neighborUV).rgb);
        AABBMin = min(AABBMin, C);
        AABBMax = max(AABBMax, C);
    }

    // Clip处理核心逻辑（无问题）
    vec3 HistoryYCoCg = RGBToYCoCg(historyColor);
    vec3 Filtered = (AABBMin + AABBMax) * 0.5f;
    vec3 RayOrigin = HistoryYCoCg;
    vec3 RayDir = Filtered - RayOrigin;
    float epsilon = 1.0 / 65536.0;
    RayDir = mix(vec3(epsilon), RayDir, greaterThan(abs(RayDir), vec3(epsilon)));
    vec3 InvRayDir = 1.0 / RayDir;
    vec3 MinIntersect = (AABBMin - RayOrigin) * InvRayDir;
    vec3 MaxIntersect = (AABBMax - RayOrigin) * InvRayDir;
    vec3 EnterIntersect = min(MinIntersect, MaxIntersect);
    float ClipBlend = max(EnterIntersect.x, max(EnterIntersect.y, EnterIntersect.z));
    ClipBlend = clamp(ClipBlend, 0.0, 1.0);
    vec3 ResultYCoCg = mix(HistoryYCoCg, Filtered, ClipBlend);
    historyColor = YCoCgToRGB(ResultYCoCg);

    float motionLength = length(velocity);
    float blendFactor = Saturate(0.05 + motionLength * 1000.0);
    bool valid = (historyTexCoords.x >= 0.0 && historyTexCoords.x <= 1.0) && 
                 (historyTexCoords.y >= 0.0 && historyTexCoords.y <= 1.0);
    if (!valid) {blendFactor = 1.0;}

    if (GetPostprocessSetting().TaaSetting.shaper == 1)
    {
        float strength = GetPostprocessSetting().TaaSetting.shaperStrength;
        vec2 topUV     = clamp(texCoordsWithJitter + vec2(0.0, -texelSize.y), 0.0, 1.0);
        vec2 leftUV    = clamp(texCoordsWithJitter + vec2(-texelSize.x, 0.0), 0.0, 1.0);
        vec2 rightUV   = clamp(texCoordsWithJitter + vec2(texelSize.x, 0.0), 0.0, 1.0);
        vec2 bottomUV  = clamp(texCoordsWithJitter + vec2(0.0, texelSize.y), 0.0, 1.0);

        vec3 topColor    = RGBToYCoCg(texture(sampler2D(curTexture, SAMPLER[0]), topUV).rgb);
        vec3 leftColor   = RGBToYCoCg(texture(sampler2D(curTexture, SAMPLER[0]), leftUV).rgb);
        vec3 centerColor = RGBToYCoCg(curColor);
        vec3 rightColor  = RGBToYCoCg(texture(sampler2D(curTexture, SAMPLER[0]), rightUV).rgb);
        vec3 bottomColor = RGBToYCoCg(texture(sampler2D(curTexture, SAMPLER[0]), bottomUV).rgb);

        vec3 sharpenSum = vec3(0.0);
        sharpenSum += (-1.0 * strength) * topColor;
        sharpenSum += (-1.0 * strength) * leftColor;
        sharpenSum += (5.0 * strength) * centerColor;
        sharpenSum += (-1.0 * strength) * rightColor;
        sharpenSum += (-1.0 * strength) * bottomColor;

        vec3 sharpenedColor = YCoCgToRGB(sharpenSum);
        sharpenedColor = max(sharpenedColor, vec3(0.0));
        curColor = sharpenedColor;
    }

    // HDR需要先转为LDRmix后再恢复， 如果不这样，目前测试发现会出现一个黑点，然后移动后越来越大
    historyColor = ToneMapping(max(historyColor, 0.0f));
    curColor = ToneMapping(max(curColor, 0.0f));
    vec3 mixColor = mix(historyColor, curColor, blendFactor);
    mixColor = InverseToneMapping(max(mixColor, 0.0f));

    imageStore(out_texture, invocID, vec4(mixColor, 1.0));
}

#endif

游戏引擎开发实践（高质量Bloom）

Mon, 10 Nov 2025 10:09:12 +0800

下采样

为什么要下采样

要想光晕扩的足够大，第一件事情就是扩大模糊的范围。一种非常简单的思路就是死命加大滤波盒的尺寸，使用一个巨大的 kernal 对纹理进行模糊。但是性能上肯定是吃不消，单 pass 的纹理采样次数是 N^2 而双 pass 是 N+N

此外还有一个问题，在处理高分辨率纹理时你需要等比地增加滤波盒的尺寸，才能形成同等大小的模糊。比如在 1000x1000 分辨率下用 250 像素的 kernal，模糊的结果占 1/4 屏幕，当分辨率增加到 2000x2000 的时候，要使用 500 像素的 kernal 才能达到同样的效果

回到模糊的问题，模糊滤波的本质是查询 kernal 范围内的所有像素并加权平均，即范围查询问题。在计算机图形学中实现快速范围查询，通常会请到老朋友 Mipmap 出场。Mipmap 将图像大小依次折半形成金字塔，mip[i] 中的单个像素代表了 mip[i-1] 中的 2x2 像素块均值，也代表 mip[i-2] 中的 4x4 像素块均值：

为什么不直接平均，而是用高斯模糊

为什么不直接用平均，而是用高斯模糊。下图为直接使用mipmap，进行下采样

下图为高斯模糊，明显更加圆滑，直接MipMap还是方形的

所以进行下采样时，使用高斯模糊，而不是普通的平均。这只是第一步

直接将最高层级 mip 叠加到图像上虽然能够产生足够大的光晕扩散，但是发光物的中心区域不够明亮。此外，发光物和泛光之间没有过度而是直接跳变

亮度跳变导致的

为了实现发光物和最高层 mip 之间的过渡，我们需要叠加所有的 mip 层级到原图上。因为 mip[i] 是基于 mip[i-1] 进行计算的，相邻层级之间相对连续则不会产生跳变

上采样

引擎实践

游戏引擎开发实践（大气渲染）

Fri, 07 Nov 2025 18:08:43 +0800

其实OpenGL渲染器已经完成的单次散射的大气渲染，但是对原理理解不透彻，这次准备更完善一点，并且实现整套的多重散射大气渲染，参考UE的实现，以及几篇论文

Precomputed Atmospheric Scattering

Eric Bruneton, Fabrice Neyret在2008年发表的论文，在2017年有了一个示例代码

Transmittance 透射率

基本概念：透射是可乘的

对于 三点共线 $p, q, r$（顺序为 $p \to q \to r$）
从 p 到 r 的透射率 = 从 p 到 q 的透射 × 从 q 到 r 的透射

$$ T(p,r) = T(p,q) \cdot T(q,r) $$

这是光线传输的乘法性质，因为大气衰减是指数衰减，连续段可以相乘。

处理大气边界

对于点对 $p, q$
将从 $p$ 出发到 $q$ 的射线延长，找到它 与大气上下边界的最近交点 $i$
透射可以表示为：

$$ T(p,q) = \frac{T(p,i)}{T(q,i)} $$

特殊情况：如果 $[p,q]$ 与地面相交 → 透射为 0（光被阻挡）
直观理解：你只需要知道从大气内部某点到大气边界的透射，再通过除法就能得到任意点对的透射。

透射率的预计算

离地心的距离 r 和天顶角的余弦$\mu = \cos\theta$这两个参数，就可以描述从任意点出发沿着任意方向到大气层的路径上的传输衰减。

所以预计算的是摄像机在任意高度，不同抬头角度看向大气层的边界的投射率

// TODO: 知乎https://zhuanlan.zhihu.com/p/595576594上对坐标到纹理的重映射方法与论文不一样

单次散射

光路即使没有经过太阳，太阳也对这条光路有贡献，因为本来不应该经过视线的光由于空气粒子的反弹进入了视线，形成光路

光线在空气中主要会发生两种物理现象：散射和透射。

散射：散射是指一束光和大气层中的微粒发生碰撞之后，众多粒子各奔东西四散而逃的物理现象。我们把逃逸到视线方向进而产生颜色贡献的光照能量记作：S
透射（Transmittance）描述的是光在介质中穿行所造成的能量衰减，记作：$I = T(I_0)$

所以单次散射的流程：

T1透射（衰减）
S点散射
T2透射（衰减）

事实上在大气层内太阳光可以被看做是平行光，因此需要对视线方向做积分来重建无数条光路的总和：

散射理论

解决散射系数和相位函数是什么

在大气渲染中也是类似的，我们通过 “散射系数” 和 “相位函数” 来描述光线散射的现象。散射系数$\sigma$ 描述了光线和空气分子发生一次反弹之后逃逸到各个方向的（失去的）能量总和

剩下的能量并非完全进入我们的视线，而是会四下逃窜。因此相位函数 $phase(\theta)$ 表述了反弹后剩下的能量有多少能够逃到指定的方向上。相位函数和 BRDF 一样在定义域上积分等于 1.0，这保证了能量守恒：

理解就是：1. 散射系数决定有多少能量会进行散射 2. 相位函数决定这些散射的能量有多少会沿着$\theta$方向进行散射（注意散射的能量才是渲染用的，而不是剩下的）

将散射系数和相位函数简单相乘就能得到在某点发生一次散射之后，逃逸到某个方向上的能量大小

$S = \sigma \cdot \text{phase}(\theta)$

大气层并非完全均匀，大气分子的密度随着高度的增加而减少。越少的分子数目意味着发生散射的概率越低。此外大气对红、黄、蓝三种波长的光有着不同的散射量。因此散射系数通常是波长和高度的函数

$\sigma(\lambda, h)$

对于空气这种介质，它的密度通常随着海拔的增高而降低。密度的高低反应在数值上就是散射概率的减少，散射概率的减少对应着散射后剩余能量的增加。因此可以用海平面（Y=0）处的散射系数和海平面 h 处的高度密度衰减函数来描述任意高度的散射系数

$\sigma(\lambda, h) = \sigma(\lambda, 0)\rho(h)$

单次散射预计算

这篇论文使用的是4D表，属于是把计算结果全部打表了

单次散射函数依赖 4 个参数：

$$ (r, \mu, \mu_s, \nu) $$

$r$：观察点到地心的距离
$\mu = \cos(\theta_v)$：视线方向与地心方向余弦
$\mu_s = \cos(\theta_s)$：太阳方向与地心方向余弦
$\nu = \cos(\theta_{vs})$：视线方向与太阳方向余弦

多重散射

二次散射的计算需要一次散射，三次需要二次，所以一层一层往上算来得到多重散射效果。

太阳光可能散射两次才散射到ViewDir

沿着ViewDir上某一点的计算不仅要计算来自太阳的散射，而是一个球面积分（也就是说任意方向都可能散射到这个点），对于球面上任何一点的贡献计算又是一层积分运算（球面积分的每一个采样方向，都要逐步进行 raymarch 到大气层边缘。如下图最右边蓝色线条）。所有2次多重散射就需要3重积分来求解

设：

$L^{(1)}(p, \omega)$：点 p 向方向 ω 的单次散射光。
$L^{(2)}(p, \omega)$：点 p 向方向 ω 的二次散射光。
$L^{(3)}(p, \omega)$：点 p 向方向 ω 的三次散射光。

那么：

$$ L^{(2)}(p, \omega) = \int_{q, \omega'} L^{(1)}(q, \omega') \cdot f_s(\omega', \omega) $$

以此类推：

$$ L^{(n)}(p, \omega) = \int_{q, \omega'} L^{(n-1)}(q, \omega') \cdot f_s(\omega', \omega) $$

所以：

计算第 n 阶散射，必须先有第 n−1 阶的结果。

有点懂，但没完全懂….

A Scalable and Production Ready Sky and Atmosphere Rendering Technique

2020年Epic发表介绍大气渲染的论文

多重散射的优化

这篇论文主要对多重散射需要一层一层计算迭代来实现的情况做了简化。作者通过做出一些对结果影响不大的简化假设，大幅度地降低了Multiple Scattering计算的消耗，并且使用数值方法计算无穷阶Scattering之和变为可能。

论文提到的Sky-View LUT就是最终渲染结果存储的纹理

TODO: 在靠近地平线部分大气散射会变得高频，因此UV的映射不是线性，而是靠近地平线部分会分配更多像素

大气透视查找表

除了天空，远处被大气覆盖的物体也要受到大气的影响。远处的物体对相机的贡献主要来自于两点，物体自身的颜色乘以着色点到相机的 transmittance，以及相机到着色点这段路径中间受到的大气散射。对应下图两条不同颜色的路径：

分割Camera Frustum（和Cluster Rendering中的分割一样），计算每个格子到Camera方向的In-Scattering和Transmittance，保存在Volume Texture中；
在Volume Texture的z轴方向上根据Transmittance累加In-Scattering，使得每一个单元格保存的是该单元格到Camera的Luminance；
在Opaque渲染之后，做一次Post Processing，采样上述的Volume Texture，对场景中的物体添加Aerial Perspective；
Transparent物体渲染时在VS中采样Volume Texture添加Aerial Perspective。

引擎实践

Transmittance Lut

用ComputerShader预计算一张2D表，记录每个高度，每个天顶角到大气外圈的透射率。

流程是把UV坐标映射到X：不同天顶角余弦值（-1，1）,Y：不同高度（0，1）用得到的数据计算透射率后保存

#version 450 core
#ifdef COMPUTE_SHADER
#define LOCAL_SIZE 8
#include "include/SkyCommon.glslh"

layout(rgba32f, binding = 0) uniform writeonly image2D transmittanceLut;


layout(local_size_x = LOCAL_SIZE, local_size_y = LOCAL_SIZE, local_size_z = 1) in;
void main()
{
    ivec2 texelCoord = ivec2(gl_GlobalInvocationID.xy);

	AtmosphereParameter Atmosphere;  // TODO: AtmosphereUniform
    Atmosphere.PlanetRadius = 6360000.0;
    Atmosphere.AtmosphereHeight = 60000.0;
    Atmosphere.RayleighScatteringScalarHeight = 8000.0;
    Atmosphere.MieScatteringScalarHeight = 1200.0;
    Atmosphere.OzoneLevelCenterHeight = 25000.0;
    Atmosphere.OzoneLevelWidth = 15000.0;


	float bottomRadius = Atmosphere.PlanetRadius;
	float topRadius = Atmosphere.PlanetRadius + Atmosphere.AtmosphereHeight;


    ivec2 lutSize = imageSize(transmittanceLut);
    float viewHeight;
    float viewZenithCosAngle;
    vec2 uv = vec2(texelCoord) / vec2(lutSize);
	float r = 0.0;

    UvToTransmittanceLutParams(bottomRadius, topRadius, uv, viewZenithCosAngle, r);
	float sin_theta = sqrt(1.0 - viewZenithCosAngle * viewZenithCosAngle);
	vec3 CameraPosition = vec3(0.0, r, 0.0);
	vec3 viewDir = vec3(sin_theta, viewZenithCosAngle, 0);

	float dis = RayIntersectSphere(vec3(0,0,0), topRadius, CameraPosition, viewDir);
	vec3 hitPoint = CameraPosition + viewDir * dis;
	vec3 color = Transmittance(Atmosphere, CameraPosition, hitPoint);
    imageStore(transmittanceLut, texelCoord, vec4(color, 1.0));
}

#endif

// UV转LUT参数（高度、天顶角的余弦值）
void UvToTransmittanceLutParams(float bottomRadius, float topRadius, vec2 uv, out float mu, out float r)
{
    float x_mu = uv.x;
    float x_r = uv.y;

    float H = sqrt(max(0.0f, topRadius * topRadius - bottomRadius * bottomRadius));
    float rho = H * x_r;
    r = sqrt(max(0.0f, rho * rho + bottomRadius * bottomRadius));

    float d_min = topRadius - r;
    float d_max = rho + H;
    float d = d_min + x_mu * (d_max - d_min);
    mu = d == 0.0f ? 1.0f : (H * H - rho * rho - d * d) / (2.0f * r * d);
    mu = clamp(mu, -1.0f, 1.0f);
}

最终生成的lut如下，在Vulkan中，0,0在右上角，所以和参考博客生成的lutY轴反转了

SkyView Lut

用一张2D（球面坐标）纹理存储不同ViewDir下的大气渲染结果

#version 450 core
#ifdef COMPUTE_SHADER
#define LOCAL_SIZE 8
#include "include/SkyCommon.glslh"
// 二维 UV 坐标当作球面坐标 (θ, φ) 映射到单位球方向向量。 一个技巧：用2D球面来存储3D的方向向量了
vec3 UVToViewDir(vec2 uv)
{
    float theta = (1.0 - uv.y) * PI;
    float phi = (uv.x * 2 - 1) * PI;
    
    float x = sin(theta) * cos(phi);
    float z = sin(theta) * sin(phi);
    float y = cos(theta);

    return vec3(x, y, z);
}
layout(rgba32f, binding = 0) uniform writeonly image2D SkyViewLut;
layout(binding = 1) uniform sampler2D u_TransmittanceLut;
layout(binding = 2) uniform sampler2D u_MultiScatteringLut;
layout(std140, set = 0, binding = 3) uniform SceneData
{
	DirectionalLight DirectionalLights;
	float EnvironmentMapIntensity;
} u_Scene;
layout(set = 0,binding = 4) uniform CameraDataUniform {
    mat4 view;
    mat4 proj;
	mat4 viewProj;
	float width;
	float height;
	float Near;
	float Far;
	vec3 CameraPosition;
} u_CameraData;
layout(local_size_x = LOCAL_SIZE, local_size_y = LOCAL_SIZE, local_size_z = 1) in;
void main()
{
    ivec2 texelCoord = ivec2(gl_GlobalInvocationID.xy);

	AtmosphereParameter Atmosphere = BuildAtmosphereParameter();

	ivec2 lutSize = imageSize(SkyViewLut);

	vec2 uv = vec2(texelCoord) / vec2(lutSize);
    vec3 viewDir = UVToViewDir(uv);
	vec3 lightDir = normalize(-u_Scene.DirectionalLights.Direction);
	vec3 cameraPosition = normalize(u_CameraData.CameraPosition);

	float h = cameraPosition.y - Atmosphere.SeaLevel + Atmosphere.PlanetRadius;
	vec3 eyePos = vec3(0, h, 0);

	vec3 color = GetSkyView(Atmosphere, eyePos, viewDir, lightDir, -1.0f,u_TransmittanceLut, u_MultiScatteringLut);

    imageStore(SkyViewLut, texelCoord, vec4(color, 1.0));

}

#endif

vec3 GetSkyView(
    in AtmosphereParameter param, vec3 eyePos, vec3 viewDir, vec3 lightDir, float maxDis, 
    sampler2D _transmittanceLut, sampler2D _multiScatteringLut)
{
    const int N_SAMPLE = 32;
    vec3 color = vec3(0, 0, 0);

    // 光线和大气层, 星球求交
    float dis = RayIntersectSphere(vec3(0,0,0), param.PlanetRadius + param.AtmosphereHeight, eyePos, viewDir);
    float d = RayIntersectSphere(vec3(0,0,0), param.PlanetRadius, eyePos, viewDir);
    if(dis < 0) return color; 
    if(d > 0) dis = min(dis, d);
    if(maxDis > 0) dis = min(dis, maxDis);  // 带最长距离 maxDis 限制, 方便 aerial perspective lut 部分复用代码

    float ds = dis / float(N_SAMPLE);
    vec3 p = eyePos + (viewDir * ds) * 0.5;
    vec3 sunLuminance = param.SunLightColor * param.SunLightIntensity;
    vec3 opticalDepth = vec3(0, 0, 0);

    for(int i=0; i<N_SAMPLE; i++)
    {
        // 积累沿途的湮灭系数
        float h = length(p) - param.PlanetRadius;
        vec3 extinction = RayleighCoefficient(param, h) + MieCoefficient(param, h) +  // scattering
                            OzoneAbsorption(param, h) + MieAbsorption(param, h);        // absorption
        opticalDepth += extinction * ds;

        vec3 t1 = TransmittanceToAtmosphere(param, p, lightDir, _transmittanceLut);
        vec3 s  = Scattering(param, p, lightDir, viewDir);
        vec3 t2 = exp(-opticalDepth);
        
        // 单次散射
        vec3 inScattering = t1 * s * t2 * ds * sunLuminance;
        color += inScattering;

        // 多重散射
        vec3 multiScattering = GetMultiScattering(param, p, lightDir, _multiScatteringLut);
        color += multiScattering * t2 * ds * sunLuminance;

        p += viewDir * ds;
    }

    return color;
}

游戏引擎开发实践（Vulkan架构篇：Image）

Sun, 02 Nov 2025 20:46:56 +0800

这里涉及的整套结构已经废弃，转为研究更轻薄的RHI层，放弃过度封装！

本文主要讲解GameEngine项目Vulkan封装，在渲染层只需要调用RHI层接口即可

总览

所有底层对象创建都需要使用xxxSpecification来说明创建需求，调用RHI接口函数，创建底层Vulkan对象

Image

enum class ImageFormat
{
    None = 0,
    RED8UN,
    RED8UI,
    ...
    // Defaults
    Depth = DEPTH32F,
};
// 图片用途
enum class ImageUsage
{
	None = 0,
	Texture,
	Attachment,
	Storage,
	HostRead
};
// 图片说明书
struct ImageSpecification
{
	std::string DebugName;
	ImageFormat Format = ImageFormat::RGBA;  // 图片格式
	ImageUsage Usage = ImageUsage::Texture; // 用途
	bool Transfer = false; // 是否需要转移
	uint32_t Width = 1;
	uint32_t Height = 1;
	uint32_t Mips = 1; // mip多少层，在Vulkan中也需要自己指定
	uint32_t Layers = 1; // Layer，图层通常用于立方体纹理（6 个面）、数组纹理（多个图像的集合）等场景。
	bool CreateSampler = true;
};

class Image : public RendererResource
{
public:
	virtual ~Image() = default;

	virtual void Resize(const uint32_t width, const uint32_t height) = 0;
	virtual void Invalidate() = 0;
	virtual void Release() = 0;

	virtual uint32_t GetWidth() const = 0;
	virtual uint32_t GetHeight() const = 0;
	virtual glm::uvec2 GetSize() const = 0;
	virtual bool HasMips() const = 0;

	virtual float GetAspectRatio() const = 0;

	virtual ImageSpecification& GetSpecification() = 0;
	virtual const ImageSpecification& GetSpecification() const = 0;

	virtual Buffer GetBuffer() const = 0;
	virtual Buffer& GetBuffer() = 0;

	virtual uint64_t GetGPUMemoryUsage() const = 0; 

	virtual void CreatePerLayerImageViews() = 0;

	virtual uint64_t GetHash() const = 0;

	virtual void SetData(Buffer buffer) = 0;
	virtual void CopyToHostBuffer(Buffer& buffer) const = 0; 
};
class Image2D : public Image
{
public:
    static Ref<Image2D> Create(const ImageSpecification& specification, Buffer buffer = Buffer());
    virtual void Resize(const glm::uvec2& size) = 0;
    virtual bool IsValid() const = 0;
};

到VulkanImage2D后，创建过程

处理图片用途

声明图像的所有用途（需用按位或组合），类型为 VkImageUsageFlags，常见取值：
- VK_IMAGE_USAGE_SAMPLED_BIT：可被采样器访问（作为纹理）。
- VK_IMAGE_USAGE_COLOR_ATTACHMENT_BIT：作为颜色附着（渲染目标）。
- VK_IMAGE_USAGE_DEPTH_STENCIL_ATTACHMENT_BIT：作为深度 / 模板附着。
- VK_IMAGE_USAGE_TRANSFER_SRC_BIT/VK_IMAGE_USAGE_TRANSFER_DST_BIT：作为复制操作的源 / 目标。
- VK_IMAGE_USAGE_STORAGE_BIT：作为存储图像（Compute Shader 读写）。
用途需与后续操作匹配，否则会触发验证层错误。

VkImageUsageFlags usage = VK_IMAGE_USAGE_SAMPLED_BIT;
if (m_Specification.Usage == ImageUsage::Attachment) 
{
	if (Utils::IsDepthFormat(m_Specification.Format))
		usage |= VK_IMAGE_USAGE_DEPTH_STENCIL_ATTACHMENT_BIT;
	else
		usage |= VK_IMAGE_USAGE_COLOR_ATTACHMENT_BIT;
}
if (m_Specification.Transfer || m_Specification.Usage == ImageUsage::Texture)
{
	usage |= VK_IMAGE_USAGE_TRANSFER_SRC_BIT | VK_IMAGE_USAGE_TRANSFER_DST_BIT;
}
if (m_Specification.Usage == ImageUsage::Storage)
{
	usage |= VK_IMAGE_USAGE_STORAGE_BIT | VK_IMAGE_USAGE_TRANSFER_DST_BIT;
}

VkImageCreateInfo

VkImageCreateInfo imageCreateInfo = {};
imageCreateInfo.sType = VK_STRUCTURE_TYPE_IMAGE_CREATE_INFO;
imageCreateInfo.imageType = VK_IMAGE_TYPE_2D;
imageCreateInfo.format = vulkanFormat;
imageCreateInfo.extent.width = m_Specification.Width;
imageCreateInfo.extent.height = m_Specification.Height;
imageCreateInfo.extent.depth = 1;
imageCreateInfo.mipLevels = m_Specification.Mips;
imageCreateInfo.arrayLayers = m_Specification.Layers;
imageCreateInfo.samples = VK_SAMPLE_COUNT_1_BIT;
imageCreateInfo.tiling = m_Specification.Usage == ImageUsage::HostRead ? VK_IMAGE_TILING_LINEAR : VK_IMAGE_TILING_OPTIMAL; // 内存布局
imageCreateInfo.usage = usage;
m_Info.MemoryAlloc = allocator.AllocateImage(imageCreateInfo, memoryUsage, m_Info.Image, &m_GPUAllocationSize);
s_ImageReferences[m_Info.Image] = this;
VKUtils::SetDebugUtilsObjectName(device, VK_OBJECT_TYPE_IMAGE, m_Specification.DebugName, m_Info.Image);

VkImageViewCreateInfo（默认创建的ImageView是包含Image所有（所有mip，所有layer）的ImageView）

VkImageViewCreateInfo imageViewCreateInfo = {};
imageViewCreateInfo.sType = VK_STRUCTURE_TYPE_IMAGE_VIEW_CREATE_INFO;
imageViewCreateInfo.viewType = m_Specification.Layers > 1 ? VK_IMAGE_VIEW_TYPE_2D_ARRAY : VK_IMAGE_VIEW_TYPE_2D;
imageViewCreateInfo.format = vulkanFormat;
imageViewCreateInfo.flags = 0;
imageViewCreateInfo.subresourceRange = {};
imageViewCreateInfo.subresourceRange.aspectMask = aspectMask;
imageViewCreateInfo.subresourceRange.baseMipLevel = 0;
imageViewCreateInfo.subresourceRange.levelCount = m_Specification.Mips;
imageViewCreateInfo.subresourceRange.baseArrayLayer = 0;
imageViewCreateInfo.subresourceRange.layerCount = m_Specification.Layers;
imageViewCreateInfo.image = m_Info.Image;
VK_CHECK_RESULT(vkCreateImageView(device, &imageViewCreateInfo, nullptr, &m_Info.ImageView));
VKUtils::SetDebugUtilsObjectName(device, VK_OBJECT_TYPE_IMAGE_VIEW, fmt::format("{} default image view", m_Specification.DebugName), m_Info.ImageView);

采样器

if (m_Specification.CreateSampler)
{
	VkSamplerCreateInfo samplerCreateInfo = {};
	samplerCreateInfo.sType = VK_STRUCTURE_TYPE_SAMPLER_CREATE_INFO;
	samplerCreateInfo.maxAnisotropy = 1.0f;
	if (Utils::IsIntegerBased(m_Specification.Format))
	{
		samplerCreateInfo.magFilter = VK_FILTER_NEAREST;
		samplerCreateInfo.minFilter = VK_FILTER_NEAREST;
		samplerCreateInfo.mipmapMode = VK_SAMPLER_MIPMAP_MODE_NEAREST;
	}
	else
	{
		samplerCreateInfo.magFilter = VK_FILTER_LINEAR;
		samplerCreateInfo.minFilter = VK_FILTER_LINEAR;
		samplerCreateInfo.mipmapMode = VK_SAMPLER_MIPMAP_MODE_LINEAR;
	}

	samplerCreateInfo.addressModeU = VK_SAMPLER_ADDRESS_MODE_CLAMP_TO_EDGE;
	samplerCreateInfo.addressModeV = samplerCreateInfo.addressModeU;
	samplerCreateInfo.addressModeW = samplerCreateInfo.addressModeU;
	samplerCreateInfo.mipLodBias = 0.0f;
	samplerCreateInfo.minLod = 0.0f;
	samplerCreateInfo.maxLod = 100.0f;
	samplerCreateInfo.borderColor = VK_BORDER_COLOR_FLOAT_OPAQUE_WHITE;
	m_Info.Sampler = Vulkan::CreateSampler(samplerCreateInfo);
	VKUtils::SetDebugUtilsObjectName(device, VK_OBJECT_TYPE_SAMPLER, fmt::format("{} default sampler", m_Specification.DebugName), m_Info.Sampler);
}

设置图片默认布局 Storage和HostRead才会设置，其他图片都还是无布局状态，不过RenderPass设置可以设置附件的开始和结束布局

if (m_Specification.Usage == ImageUsage::Storage) // General
{
	// Transition image to GENERAL layout
	VkCommandBuffer commandBuffer = VulkanContext::GetCurrentDevice()->GetCommandBuffer(true);

	VkImageSubresourceRange subresourceRange = {};
	subresourceRange.aspectMask = VK_IMAGE_ASPECT_COLOR_BIT;
	subresourceRange.baseMipLevel = 0;
	subresourceRange.levelCount = m_Specification.Mips;
	subresourceRange.layerCount = m_Specification.Layers;

	Utils::InsertImageMemoryBarrier(commandBuffer, m_Info.Image,
		0, 0,
		VK_IMAGE_LAYOUT_UNDEFINED, VK_IMAGE_LAYOUT_GENERAL,
		VK_PIPELINE_STAGE_ALL_COMMANDS_BIT, VK_PIPELINE_STAGE_ALL_COMMANDS_BIT,
		subresourceRange);

	VulkanContext::GetCurrentDevice()->FlushCommandBuffer(commandBuffer);
}
else if (m_Specification.Usage == ImageUsage::HostRead) // VK_IMAGE_LAYOUT_TRANSFER_DST_OPTIMAL
{
	// Transition image to TRANSFER_DST layout
	VkCommandBuffer commandBuffer = VulkanContext::GetCurrentDevice()->GetCommandBuffer(true);

	VkImageSubresourceRange subresourceRange = {};
	subresourceRange.aspectMask = VK_IMAGE_ASPECT_COLOR_BIT;
	subresourceRange.baseMipLevel = 0;
	subresourceRange.levelCount = m_Specification.Mips;
	subresourceRange.layerCount = m_Specification.Layers;

	Utils::InsertImageMemoryBarrier(commandBuffer, m_Info.Image,
		0, 0,
		VK_IMAGE_LAYOUT_UNDEFINED, VK_IMAGE_LAYOUT_TRANSFER_DST_OPTIMAL,
		VK_PIPELINE_STAGE_ALL_COMMANDS_BIT, VK_PIPELINE_STAGE_ALL_COMMANDS_BIT,
		subresourceRange);

	VulkanContext::GetCurrentDevice()->FlushCommandBuffer(commandBuffer); // 会把命令提交并等待完成
}

资源描述符信息封装（用默认的构造写一个资源描述符）

	void VulkanImage2D::UpdateDescriptor()
	{
		if (m_Specification.Format == ImageFormat::DEPTH24STENCIL8 ||
			m_Specification.Format == ImageFormat::DEPTH32F ||
			m_Specification.Format == ImageFormat::DEPTH32FSTENCIL8UINT) {
			m_DescriptorImageInfo.imageLayout = VK_IMAGE_LAYOUT_DEPTH_STENCIL_READ_ONLY_OPTIMAL;
		}
		else if (m_Specification.Usage == ImageUsage::Storage) {
			m_DescriptorImageInfo.imageLayout = VK_IMAGE_LAYOUT_GENERAL;
		}
		else if (m_Specification.Usage == ImageUsage::HostRead) {
			m_DescriptorImageInfo.imageLayout = VK_IMAGE_LAYOUT_TRANSFER_DST_OPTIMAL;
		}
		else {
			m_DescriptorImageInfo.imageLayout = VK_IMAGE_LAYOUT_SHADER_READ_ONLY_OPTIMAL;
		}

		m_DescriptorImageInfo.imageView = m_Info.ImageView;

		m_DescriptorImageInfo.sampler = m_Info.Sampler;
	}

另外Image类需要提供创建不同Mip不同Layer的ImageView的功能，用于不同的场景，比如Mip用于使用ComputerShader创建HZB，Layer用于CSM级联阴影，用一个Image的不同Layer表示不同的级联

Texture

Texture就是把Image再封装一层，用于纹理采样，另外封装了2D纹理和Cube纹理，后续还可以封装3D纹理，用于体积云等等

	struct TextureSpecification
	{
		ImageFormat Format = ImageFormat::RGBA;
		uint32_t Width = 1;
		uint32_t Height = 1;
		TextureWrap SamplerWrap = TextureWrap::Repeat;
		TextureFilter SamplerFilter = TextureFilter::Linear;

		bool GenerateMips = true;
		bool Storage = false;
		bool StoreLocally = false;

		std::string DebugName;
	};
	class Texture : public RendererResource
	{
	public:
		virtual ~Texture() {}

		virtual void Bind(uint32_t slot = 0) const = 0;

		virtual ImageFormat GetFormat() const = 0;
		virtual uint32_t GetWidth() const = 0;
		virtual uint32_t GetHeight() const = 0;
		virtual glm::uvec2 GetSize() const = 0;

		virtual uint32_t GetMipLevelCount() const = 0;
		virtual std::pair<uint32_t, uint32_t> GetMipSize(uint32_t mip) const = 0;

		virtual uint64_t GetHash() const = 0;

		virtual TextureType GetType() const = 0;
	};

	class Texture2D : public Texture
	{
	public:
		static Ref<Texture2D> Create(const TextureSpecification& specification);
		static Ref<Texture2D> Create(const TextureSpecification& specification, const std::filesystem::path& filepath);
		static Ref<Texture2D> Create(const TextureSpecification& specification, Buffer imageData);
		virtual void CreateFromFile(const TextureSpecification& specification, const std::filesystem::path& filepath) = 0;
		virtual void CreateFromBuffer(const TextureSpecification& specification, Buffer data = Buffer()) = 0;
		virtual void ReplaceFromFile(const TextureSpecification& specification, const std::filesystem::path& filepath) = 0;

		virtual void Resize(const glm::uvec2& size) = 0;
		virtual void Resize(const uint32_t width, const uint32_t height) = 0;

		virtual Ref<Image2D> GetImage() const = 0;

		virtual void Lock() = 0;
		virtual void Unlock() = 0;

		virtual Buffer GetWriteableBuffer() = 0;

		virtual bool Loaded() const = 0;

		virtual const std::filesystem::path& GetPath() const = 0;

		virtual TextureType GetType() const override { return TextureType::Texture2D; }

		static AssetType GetStaticType() { return AssetType::Texture; }
		virtual AssetType GetAssetType() const override { return GetStaticType(); }
	};
	class TextureCube : public Texture
	{
	public:
		static Ref<TextureCube> Create(const TextureSpecification& specification, Buffer imageData = Buffer());

		virtual TextureType GetType() const override { return TextureType::TextureCube; }
		virtual void GenerateMips(bool readonly = false) = 0;
		virtual void GenerateMips(Ref<RenderCommandBuffer> renderCommandBuffer,bool readonly = false) = 0;
		static AssetType GetStaticType() { return AssetType::EnvMap; }
		virtual AssetType GetAssetType() const override { return GetStaticType(); }
	};

创建底层Image对象

ImageSpecification imageSpec;
imageSpec.Format = m_Specification.Format;
imageSpec.Width = m_Specification.Width;
imageSpec.Height = m_Specification.Height;
imageSpec.Mips = specification.GenerateMips ? GetMipLevelCount() : 1;
imageSpec.DebugName = specification.DebugName;
imageSpec.CreateSampler = false;
m_Image = Image2D::Create(imageSpec);

从文件中读取数据

`1`	`m_ImageData = TextureImporter::ToBufferFromFile(filepath, m_Specification.Format, m_Specification.Width, m_Specification.Height);`

数据写入Image对象（先把数据放在临时缓冲区，再转移到图片），生成MipMap后，转为VK_IMAGE_LAYOUT_SHADER_READ_ONLY_OPTIMAL布局

void VulkanTexture2D::SetData(Buffer buffer)
{
	auto device = VulkanContext::GetCurrentDevice();
	Ref<VulkanImage2D> image = m_Image.As<VulkanImage2D>();
	auto& info = image->GetImageInfo();

	VkDeviceSize size = m_ImageData.Size;

	VkMemoryAllocateInfo memAllocInfo{};
	memAllocInfo.sType = VK_STRUCTURE_TYPE_MEMORY_ALLOCATE_INFO;

	VulkanAllocator allocator("Texture2D");

	// Create staging buffer
	VkBufferCreateInfo bufferCreateInfo{};
	bufferCreateInfo.sType = VK_STRUCTURE_TYPE_BUFFER_CREATE_INFO;
	bufferCreateInfo.size = size;
	bufferCreateInfo.usage = VK_BUFFER_USAGE_TRANSFER_SRC_BIT;
	bufferCreateInfo.sharingMode = VK_SHARING_MODE_EXCLUSIVE;
	VkBuffer stagingBuffer;
	VmaAllocation stagingBufferAllocation = allocator.AllocateBuffer(bufferCreateInfo, VMA_MEMORY_USAGE_CPU_TO_GPU, stagingBuffer);

	// Copy data to staging buffer
	uint8_t* destData = allocator.MapMemory<uint8_t>(stagingBufferAllocation);
	HZ_CORE_ASSERT(m_ImageData.Data);
	memcpy(destData, m_ImageData.Data, size);
	allocator.UnmapMemory(stagingBufferAllocation);

	VkCommandBuffer copyCmd = device->GetCommandBuffer(true);

	// Image memory barriers for the texture image

	// The sub resource range describes the regions of the image that will be transitioned using the memory barriers below
	VkImageSubresourceRange subresourceRange = {};
	// Image only contains color data
	subresourceRange.aspectMask = VK_IMAGE_ASPECT_COLOR_BIT;
	// Start at first mip level
	subresourceRange.baseMipLevel = 0;
	subresourceRange.levelCount = 1;
	subresourceRange.layerCount = 1;

	// Transition the texture image layout to transfer target, so we can safely copy our buffer data to it.
	VkImageMemoryBarrier imageMemoryBarrier{};
	imageMemoryBarrier.sType = VK_STRUCTURE_TYPE_IMAGE_MEMORY_BARRIER;
	imageMemoryBarrier.srcQueueFamilyIndex = VK_QUEUE_FAMILY_IGNORED;
	imageMemoryBarrier.dstQueueFamilyIndex = VK_QUEUE_FAMILY_IGNORED;
	imageMemoryBarrier.image = info.Image;
	imageMemoryBarrier.subresourceRange = subresourceRange;
	imageMemoryBarrier.srcAccessMask = 0;
	imageMemoryBarrier.dstAccessMask = VK_ACCESS_TRANSFER_WRITE_BIT;
	imageMemoryBarrier.oldLayout = VK_IMAGE_LAYOUT_UNDEFINED;
	imageMemoryBarrier.newLayout = VK_IMAGE_LAYOUT_TRANSFER_DST_OPTIMAL;

	// Insert a memory dependency at the proper pipeline stages that will execute the image layout transition
	// Source pipeline stage is host write/read execution (VK_PIPELINE_STAGE_HOST_BIT)
	// Destination pipeline stage is copy command execution (VK_PIPELINE_STAGE_TRANSFER_BIT)
	vkCmdPipelineBarrier(
		copyCmd,
		VK_PIPELINE_STAGE_HOST_BIT,
		VK_PIPELINE_STAGE_TRANSFER_BIT,
		0,
		0, nullptr,
		0, nullptr,
		1, &imageMemoryBarrier);

	VkBufferImageCopy bufferCopyRegion = {};
	bufferCopyRegion.imageSubresource.aspectMask = VK_IMAGE_ASPECT_COLOR_BIT;
	bufferCopyRegion.imageSubresource.mipLevel = 0;
	bufferCopyRegion.imageSubresource.baseArrayLayer = 0;
	bufferCopyRegion.imageSubresource.layerCount = 1;
	bufferCopyRegion.imageExtent.width = m_Specification.Width;
	bufferCopyRegion.imageExtent.height = m_Specification.Height;
	bufferCopyRegion.imageExtent.depth = 1;
	bufferCopyRegion.bufferOffset = 0;

	// Copy mip levels from staging buffer
	vkCmdCopyBufferToImage(
		copyCmd,
		stagingBuffer,
		info.Image,
		VK_IMAGE_LAYOUT_TRANSFER_DST_OPTIMAL,
		1,
		&bufferCopyRegion);

	uint32_t mipCount = m_Specification.GenerateMips ? GetMipLevelCount() : 1;
	if (mipCount > 1) // Mips to generate
	{
		Utils::InsertImageMemoryBarrier(copyCmd, info.Image,
			VK_ACCESS_TRANSFER_WRITE_BIT, VK_ACCESS_TRANSFER_READ_BIT,
			VK_IMAGE_LAYOUT_TRANSFER_DST_OPTIMAL, VK_IMAGE_LAYOUT_TRANSFER_SRC_OPTIMAL,
			VK_PIPELINE_STAGE_TRANSFER_BIT, VK_PIPELINE_STAGE_TRANSFER_BIT,
			subresourceRange);
	}
	else
	{
		Utils::InsertImageMemoryBarrier(copyCmd, info.Image,
			VK_ACCESS_TRANSFER_READ_BIT, VK_ACCESS_SHADER_READ_BIT,
			VK_IMAGE_LAYOUT_TRANSFER_DST_OPTIMAL, image->GetDescriptorInfoVulkan().imageLayout,
			VK_PIPELINE_STAGE_TRANSFER_BIT, VK_PIPELINE_STAGE_FRAGMENT_SHADER_BIT,
			subresourceRange);
	}

	device->FlushCommandBuffer(copyCmd);

	// Clean up staging resources
	allocator.DestroyBuffer(stagingBuffer, stagingBufferAllocation);

	if (m_Specification.GenerateMips && mipCount > 1)
		GenerateMips();
}

对于Cube纹理，就是imageCreateInfo.arrayLayers = 6; // cubeMap本质是一个图片数组，arrayLayers来表示6个面，其他类似

游戏引擎开发实践（阴影篇）

Sat, 25 Oct 2025 20:49:55 +0800

在OpenGL渲染器中已经实现了硬阴影以及PCF，PCSS，在这里再引入级联阴影

级联阴影

传统阴影做法与问题

截图来自我的OpenGL延迟渲染器

1
2

float orthoSize = 10.0f;
glm::mat4 lightProjection = glm::ortho(-orthoSize, orthoSize, -orthoSize, orthoSize, near_plane, far_plane);

这行代码决定了从光源位置渲染阴影贴图的正交投影矩阵，他决定了阴影的覆盖范围，当设置为10时，硬阴影以及PCSS效果如下

当设置为100时，硬阴影与PCSS效果如下,可以看到硬阴影锯齿变得严重起来，软阴影也糊成一片了

最后设置为1000,阴影以及完全失效了，因为覆盖区域太大了，整个模型也就占几个像素，导致模型边缘区域都是一样的判断结果，另外bias也失效了

所以使用大场景时，阴影需要覆盖很大的区域，导致一大片位置只在阴影贴图中占一小部分，会导致近处模型阴影明显出问题

级联阴影的原理

首先对摄像机坐标系下的视锥体分割，分割为不同深度的分段
在光源的视角下，生成每个视锥体分段的“包围盒”，这个包围盒是生成阴影贴图时正交投影的重要参考

视锥体分段

目的是把相机的视锥体（camera frustum）沿深度方向划分成多个“级联”

常用方法叫PSSM

ds表示阴影贴图的像素长度
dp屏幕像素长度
dp/ds可以理解为阴影的锯齿误差
为了使整个画面的阴影看起来质量一致，不因到相机的距离而发生明显质量变化，应该让dp/ds 是一个常数（dp/ds：表示“一个阴影贴图像素在屏幕上看起来有多大”）
由dp/dy = n/z，得出dp = ndy/z
φ和θ分别表示曲面法线与屏幕和阴影贴图平面之间的角度。由dz/cosθ = dy/cosφ，得出dy = dzcosφ/cosθ
所以dp = ndzcosφ/zcosθ，dp/ds = ndzcosφ/zdscosθ

看看这个式子：

$$ \frac{dp}{ds} = \frac{n dz \cos\phi}{z \, ds \cos\theta} $$

它告诉你阴影质量受哪些因素影响：

因素	影响	含义
n / z	↓ 随距离增大而减小	物体越远，阴影在屏幕上越小 → 锯齿更明显
cosφ / cosθ	与法线角度相关	面倾斜时投影面积不同，阴影更“拉伸”
dz/ds	光源深度变化与贴图分辨率关系	光源投影范围越大（dz 大），每个像素越模糊
→ dp/ds 越大，阴影越锯齿

最后如果用对数拆分方案，可以推导出

其中Z是视锥体分段处的值,对应上图中的Ci，n是近平面距离，f是远平面距离，N是视锥体分割的个数，一般是1~4个

如果使用均匀拆分方案

而PSSM方法是他们的折中，用系数λ来加权平均，

float nd = camera->near;
float fd = camera->far;
float lambda = 0.75;
float ratio = fd / nd;
frustums[0].near(nd);
for(int i = 1 ; i < 分段个数 ; i++) 
{
	float si = i / (float)分段个数;
	float t_near = lambda * (nd * powf(ratio, si)) + (1 - lambda) * (nd + (fd - nd) * si);
	float far = near * 1.005f;//略微增加重合，避免断裂
	frustums[i].near(near);
	frustums[i-1].far(far);
}
frustums[分段个数-1].far(fd);

到这里就拿到了每个视锥体切片的Near和Far是多少，就是上图中的C0，C1…

光源空间中正交投影

先计算出摄像机视锥体分块在世界空间中的坐标（就是计算了近平面和远平面组成的立方体的8个顶点的世界坐标）

glm::vec3 viewPos = camera->Position;
glm::vec3 viewDir = camera->Front;
glm::vec3 up(0.0f, 1.0f, 0.0f);
glm::vec3 right = glm::cross(viewDir, up);
for(int i = 0 ; i < 分块个数 ; i++) 
{
   Frustum& frustum = m_frustums[i];
   glm::vec3 fc = viewPos + viewDir * frustum.far(); // 当前的Near
   glm::vec3 nc = viewPos + viewDir * frustum.near(); // 当前的Far
   right = glm::normalize(right);   // 相机的右方向
   up = glm::normalize(glm::cross(right, viewDir)); // 计算正交基的上方向
   // 计算当前分片的近平面和远平面宽高的一半
   float near_height = tan(frustum.fov() / 2.0f) * frustum.near();
   float near_width = near_height * frustum.ratio();
   float far_height = tan(frustum.fov() / 2.0f) * frustum.far();
   float far_width = far_height * frustum.ratio();
   //记录视锥8个顶点
   frustum.m_points[0] = nc - up * near_height - right * near_width;
   frustum.m_points[1] = nc + up * near_height - right * near_width;
   frustum.m_points[2] = nc + up * near_height + right * near_width;
   frustum.m_points[3] = nc - up * near_height + right * near_width;
   frustum.m_points[4] = fc - up * far_height - right * far_width;
   frustum.m_points[5] = fc + up * far_height - right * far_width;
   frustum.m_points[6] = fc + up * far_height + right * far_width;
   frustum.m_points[7] = fc - up * far_height + right * far_width;
}

利用分块的各顶点坐标，计算摄像机视锥体分段的“包围盒”，从而计算出分块对应的正交投影矩阵（最终结果就是每个级联块都有了自己的变换矩阵，我想把模型放在哪个级联块中，就乘以他的变换矩阵）

glm::mat4 lightProjMat;
for(int i = 0 ; i < 分块个数 ; i++) 
{
   //1. 找出光空间中八个顶点的最大最小z值（光源视角下z的范围）
   Frustum& frustum = m_frustums[i];
   glm::vec3 max(-1000.0f, -1000.0f, 0.0f);
   glm::vec3 min(1000.0f, 1000.0f, 0.0f);
   glm::vec4 transf = lightViewMat * glm::vec4(frustum.m_points[0], 1.0f);
   min.z = transf.z;
   max.z = transf.z;
   for(int j = 1 ; j < 8 ; j++) 
   {
     transf = lightViewMat * glm::vec4(frustum.m_points[j], 1.0f);
     if(transf.z > max.z) { max.z = transf.z; }
     if(transf.z < min.z) { min.z = transf.z; }
   }
//1.1 扩展光视锥体的大小，使其包括所有的遮挡物
   for(int j=0; j<场景中物体包围球个数; j++)
   {
   	transf = lightViewMat * vec4f(objBSphereCenter[j], 1.0f);
		if(transf.z + objBSphereRadius[j] > max.z)
		{
			max.z = transf.z + objBSphereRadius[j];
		}
   }
   //2. 设光空间的正交投影矩阵为ortho，他的x,y∈[-1,1]，z∈[-tmax.z,-tmin.z]
   //使用x,y∈[-1,1]，是因为每个分块的投影矩阵都可以使用单位x,y缩放平移后获得
   //使用z∈[-tmax.z,-tmin.z]，是因为摄像机空间指向负Z方向，而glm::ortho传入的是近平面和远平面指向正Z方向
   glm::mat4 ortho = glm::ortho(-1.0f, 1.0f, -1.0f, 1.0f, -tmax.z, -tmin.z);
//2.1 在光空间中，找出视锥体切片各顶点的x、y的标准设备坐标范围。因为我们设的投影矩阵的x、y都是标准设备坐标，我们需要求出x、y的变化范围，以便对ortho进行缩放平移
   glm::mat4 lightVP = ortho * lightViewMat;
   for(int j = 0 ; j < 8 ; j++) 
   {
     transf = lightVP * glm::vec4(frustum.m_points[j], 1.0f);
     transf.x /= transf.w;
     transf.y /= transf.w;
     if(transf.x > max.x) { max.x = transf.x; }
     if(transf.x < min.x) { min.x = transf.x; }
     if(transf.y > max.y) { max.y = transf.y; }
     if(transf.y < min.y) { min.y = transf.y; }
   }
//2.2 根据正交投影矩阵的公式，设置缩放平移量(计算过程在后面)
   glm::vec2 scale(2.0f / (max.x - min.x), 2.0f / (max.y - min.y));
   glm::vec2 offset(-0.5f * (max.x + min.x) * scale.x, -0.5f * (max.y + min.y) * scale.y);
   glm::mat4 crop = glm::mat4(1.0);
//2.3 设置缩放平移的变换矩阵
   crop[0][0] = scale.x;
   crop[1][1] = scale.y;
   crop[0][3] = offset.x;
   crop[1][3] = offset.y;
   crop = glm::transpose(crop);//注意glm按列储存，实际矩阵要转置
//2.4 计算出光空间中的正交投影矩阵
   lightProjMat = crop * ortho;
   //保存光空间的投影矩阵
   projection_matrices[i] = lightProjMat;
   //保存世界坐标到光空间变换的矩阵
   crop_matrices[i] = lightProjMat * lightViewMat;
}

计算出摄像机视锥体分块的远平面在摄像机空间中投影后的位置，并把他变换到[0.0，1.0]。这么做的目的是为了在中判断某个片段属于哪个分块

for(int i = 0 ; i < 分块个数 ; i++) 
{
   far_bounds[i] =0.5f*((-1.0f * frustums[i].far() * projMat[2][2] + projMat[3][2])/
   frustums[i].far())+0.5f;
 }

游戏引擎开发实践（实例化渲染）

Tue, 21 Oct 2025 20:11:16 +0800

废弃

StaticMesh收集

首先从Scene的Entity找到包含StaticMesh组件的Entity，第一步剔除不显示的Mesh

void Scene::CollectRenderableEntities(Ref<SceneRender> sceneRender)
{
	// 收集StaticMesh
	auto allEntityOwnMesh = GetAllEntitiesWith<StaticMeshComponent>();
	for (auto entity : allEntityOwnMesh) {
		auto& staticMeshComponent = allEntityOwnMesh.get<StaticMeshComponent>(entity);
		if (!staticMeshComponent.Visible) continue;
		Ref<MeshSource> mesh = AssetManager::GetAsset<MeshSource>(staticMeshComponent.StaticMesh);
		if (mesh == nullptr) continue;
		Entity e = Entity(entity, this);
		glm::mat4 transform = GetWorldSpaceTransformMatrix(e);
		sceneRender->SubmitStaticMesh(mesh, transform);
	}
}

另外因为层级结构，需要递归处理每个Mesh的模型变换矩阵

	glm::mat4 Scene::GetWorldSpaceTransformMatrix(Entity entity)
	{
		glm::mat4 transform(1.0f);

		Entity parent = GetEntityByUUID(entity.GetParentUUID());
		if (parent)
			transform = GetWorldSpaceTransformMatrix(parent);

		return transform * entity.Transform().GetTransform();
	}

最后注册这个Mesh，携带它的模型变换。

注册Mesh到StaticDrawList

遍历每个SubMesh

计算他的全局变换矩阵
获取MeshKey（用于实例化，这样做自动把一样的SubMesh自动放在了一起），这里Key就表示同一个SubMesh同一个材质，就属于实例化的一个
缓存对应的变换矩阵
增加对应DrawCommand的实例数量，最终每一个MeshKey对应的DrawCommand都会变成一个DrawCall

struct StaticDrawCommand
{
    Ref<MeshSource> MeshSource;
    uint32_t SubmeshIndex;
    Ref<MaterialAsset> MaterialAsset;
    uint32_t InstanceCount = 0;
};
void SceneRender::SubmitStaticMesh(Ref<MeshSource> meshSource, const glm::mat4& transform) {
	const auto& submeshData = meshSource->GetSubmeshes();
	for(uint32_t submeshIndex = 0; submeshIndex <submeshData.size(); submeshIndex++){
		glm::mat4 submeshTransform = transform * submeshData[submeshIndex].Transform;  // subMesh的全局变换
		AssetHandle materialHandle = meshSource->GetMaterialHandle(submeshData[submeshIndex].MaterialIndex);
		Ref<MaterialAsset> material = AssetManager::GetAsset<MaterialAsset>(materialHandle);// subMesh的材质索引;
		HZ_CORE_VERIFY(material);
		MeshKey meshKey = { meshSource->Handle, materialHandle, submeshIndex, false };
		// 缓存变换矩阵
		auto& transformStorage = m_MeshTransformMap[meshKey].Transforms.emplace_back(); // 对于每一种MeshKey，都存储多个Transforms矩阵，表示多个实例
		transformStorage.MRow[0] = { submeshTransform[0][0], submeshTransform[1][0], submeshTransform[2][0], submeshTransform[3][0] };
		transformStorage.MRow[1] = { submeshTransform[0][1], submeshTransform[1][1], submeshTransform[2][1], submeshTransform[3][1] };
		transformStorage.MRow[2] = { submeshTransform[0][2], submeshTransform[1][2], submeshTransform[2][2], submeshTransform[3][2] };
		// 缓存绘制命令
		auto& destDrawList = m_StaticMeshDrawList;
		auto& dc = destDrawList[meshKey];
		dc.MeshSource = meshSource;
		dc.SubmeshIndex = submeshIndex;
		dc.MaterialAsset = material;
		dc.InstanceCount++;
	}
};

缓存所有DrawCommand的变换矩阵

注册完成后，处理模型变换信息，这里使用的是顶点缓冲区来存储模型变换信息，下面代码作用就是把每个要渲染的SubMesh的变换矩阵按顺序存在一个顶点缓冲区，等待渲染时绑定

// 收集所有参与渲染的Mesh的变换矩阵存储在m_SubmeshTransformBuffers
{
    uint32_t frameIndex = Renderer::GetCurrentFrameIndex();

    uint32_t offset = 0;
    for (auto& [key, transformData] : m_MeshTransformMap)
    {
        transformData.TransformOffset = offset * sizeof(TransformVertexData);
        for (const auto& transform : transformData.Transforms)
        {
            m_SubmeshTransformBuffers[frameIndex].Data[offset] = transform; 
            offset++;
        }
    }
    // 在这里所有的变换矩阵已经上传到GPU（RT线程）
    m_SubmeshTransformBuffers[frameIndex].Buffer->SetData(m_SubmeshTransformBuffers[frameIndex].Data, offset * sizeof(TransformVertexData)); 
}

下面要渲染时就按顺序渲染

for (auto& [meshKey, drawCommand] : m_StaticMeshDrawList)
{
    const auto& transformData = m_MeshTransformMap.at(meshKey); // 其中已经记录好了每个DrawCall对应的变换矩阵偏移
    Renderer::RenderStaticMeshWithMaterial(m_CommandBuffer, m_GeoPipeline,drawCommand.MeshSource, drawCommand.SubmeshIndex, drawCommand.MaterialAsset->GetMaterial(), m_SubmeshTransformBuffers[frameIndex].Buffer, transformData.TransformOffset, drawCommand.InstanceCount);
}

实例化渲染

绑定整个Mesh的顶点数据
绑定所有变换矩阵的缓冲区也作为顶点数据，并设置正确的偏移量
绑定索引
材质相关

void VulkanRenderer::RenderStaticMeshWithMaterial(Ref<RenderCommandBuffer> renderCommandBuffer, Ref<Pipeline> pipeline, Ref<MeshSource> meshSource, uint32_t submeshIndex, Ref<Material> material, Ref<VertexBuffer> transformBuffer, uint32_t transformOffset, uint32_t instanceCount)
{
	HZ_CORE_ASSERT(meshSource);
	HZ_CORE_ASSERT(material);
	Ref<VulkanMaterial> vulkanMaterial = material.As<VulkanMaterial>();
	Renderer::Submit([renderCommandBuffer, pipeline,meshSource, submeshIndex, vulkanMaterial, transformBuffer, transformOffset, instanceCount]() mutable {
		uint32_t frameIndex = Renderer::RT_GetCurrentFrameIndex();
		VkCommandBuffer commandBuffer = renderCommandBuffer.As<VulkanRenderCommandBuffer>()->GetActiveCommandBuffer();
		Ref<VulkanVertexBuffer> meshVertBuffer = meshSource->GetVertexBuffer().As<VulkanVertexBuffer>();
		VkBuffer vkMeshVertBuffer = meshVertBuffer->GetVulkanBuffer();
		VkDeviceSize vertexOffsets[1] = { 0 };
		vkCmdBindVertexBuffers(commandBuffer, 0, 1, &vkMeshVertBuffer, vertexOffsets);  // 把整个Mesh的顶点都绑定
		Ref<VulkanVertexBuffer> vulkanTransformBuffer = transformBuffer.As<VulkanVertexBuffer>();
		VkBuffer vkTransformBuffer = vulkanTransformBuffer->GetVulkanBuffer();
		VkDeviceSize instanceOffsets[1] = { transformOffset };
		vkCmdBindVertexBuffers(commandBuffer, 1, 1, &vkTransformBuffer, instanceOffsets); // 第二个顶点缓冲区绑定当前SubMesh的变换矩阵数据

		auto vulkanMeshIB = Ref<VulkanIndexBuffer>(meshSource->GetIndexBuffer());
		VkBuffer ibBuffer = vulkanMeshIB->GetVulkanBuffer();
		vkCmdBindIndexBuffer(commandBuffer, ibBuffer, 0, VK_INDEX_TYPE_UINT32); // 索引缓冲区全绑定

		// 每个材质绑定自己的 Set=1
		VkDescriptorSet matSet = vulkanMaterial->GetDescriptorSets()[frameIndex];
		vkCmdBindDescriptorSets(commandBuffer, VK_PIPELINE_BIND_POINT_GRAPHICS,
			pipeline.As<VulkanPipeline>()->GetVulkanPipelineLayout(),
			1, // Set=1
			1, &matSet,
			0, nullptr);
		const auto& submeshes = meshSource->GetSubmeshes();
		const auto& submesh = submeshes[submeshIndex];
		vkCmdDrawIndexed(commandBuffer, submesh.IndexCount/*索引数量*/, instanceCount/*实例数量*/, submesh.BaseIndex/*索引缓冲区的偏移*/, submesh.BaseVertex/*顶点偏移*/, 0/*实例化ID开始的编号*/);
		
	});
}

另外要注意实例的变换矩阵的切换时机要在Pipeline创建时设置好,下面可以看到实例顶点布局的inputRate是设置的VK_VERTEX_INPUT_RATE_INSTANCE，这样他就会每个实例切换一次


    VkVertexInputBindingDescription& vertexInputBinding = vertexInputBindingDescriptions.emplace_back();
    vertexInputBinding.binding = 0;
    vertexInputBinding.stride = vertexLayout.GetStride();
    vertexInputBinding.inputRate = VK_VERTEX_INPUT_RATE_VERTEX;

    if (instanceLayout.GetElementCount())
    {
        VkVertexInputBindingDescription& instanceInputBinding = vertexInputBindingDescriptions.emplace_back();
        instanceInputBinding.binding = 1;
        instanceInputBinding.stride = instanceLayout.GetStride();
        instanceInputBinding.inputRate = VK_VERTEX_INPUT_RATE_INSTANCE;
    }

Shader

#version 450 core
#ifdef VERTEX_SHADER
layout(binding = 0) uniform UniformBufferObject {
    mat4 view;
    mat4 proj;
	float width;
	float height;
	float Near;
	float Far;
} ubo;

layout(location = 0) in vec3 inPosition;
layout(location = 1) in vec3 inNormal;
layout(location = 2) in vec3 inTangent;
layout(location = 3) in vec3 inBinormal; 
layout(location = 4) in vec2 inTexCoord;
layout(location = 5) in vec4 a_MRow0;
layout(location = 6) in vec4 a_MRow1;
layout(location = 7) in vec4 a_MRow2;

layout(location = 0) out vec3 fragWorldPos;
layout(location = 1) out vec3 fragWorldNormal;
layout(location = 2) out vec3 fragWorldTangent;
layout(location = 3) out vec3 fragWorldBinormal;
layout(location = 4) out vec2 fragTexCoord;

void main() {
    mat4 transform = mat4(
		vec4(a_MRow0.x, a_MRow1.x, a_MRow2.x, 0.0),
		vec4(a_MRow0.y, a_MRow1.y, a_MRow2.y, 0.0),
		vec4(a_MRow0.z, a_MRow1.z, a_MRow2.z, 0.0),
		vec4(a_MRow0.w, a_MRow1.w, a_MRow2.w, 1.0)
	);
    vec4 worldPos = transform * vec4(inPosition, 1.0);
    fragWorldPos = worldPos.xyz;

    mat3 modelRot = mat3(transform);
    fragWorldNormal = normalize(modelRot * inNormal);
    fragWorldTangent = normalize(modelRot * inTangent);
    fragWorldBinormal = normalize(modelRot * inBinormal);
    fragTexCoord = inTexCoord;
    gl_Position = ubo.proj * ubo.view * worldPos;
}
#endif

RenderDoc可以看到，只有一个DrawCall

游戏引擎开发实践（动画篇）

Mon, 20 Oct 2025 20:17:44 +0800

骨骼构建

骨骼信息读取

骨骼数据包含

骨骼名称
每个骨骼的父骨骼索引
每个骨骼相对于父骨骼的变换（平移、旋转、缩放）
整个骨架的变换矩阵

	std::vector<std::string> m_BoneNames;
	std::vector<uint32_t> m_ParentBoneIndices;
	// rest pose of skeleton. All in bone-local space (i.e. translation/rotation/scale relative to parent)
	std::vector<glm::vec3> m_BoneTranslations;
	std::vector<glm::quat> m_BoneRotations;
	std::vector<glm::vec3> m_BoneScales;
	// The skeleton itself can have a transform
	// Notably this happens if the whole "armature" is rotated or scaled in DCC tool
	glm::mat4 m_Transform;

另外骨骼信息应该独属于Mesh，应该用unique_ptr包裹指针

第一步直接把所以SubMesh的骨骼信息提取到Vector，这一步只是把Name提取出来了

void BoneHierarchy::ExtractBones()
{
	// Note: ASSIMP does not appear to support import of digital content files that contain _only_ an armature/skeleton and no mesh.
	for (uint32_t meshIndex = 0; meshIndex < m_Scene->mNumMeshes; ++meshIndex)
	{
		const aiMesh* mesh = m_Scene->mMeshes[meshIndex];
		for (uint32_t boneIndex = 0; boneIndex < mesh->mNumBones; ++boneIndex)
		{
			m_Bones.emplace(mesh->mBones[boneIndex]->mName.C_Str());
		}
	}

	// Extract also any nodes that are animated (but don't have any skin bound to them)
	for (uint32_t animationIndex = 0; animationIndex < m_Scene->mNumAnimations; ++animationIndex)
	{
		const aiAnimation* animation = m_Scene->mAnimations[animationIndex];
		for (uint32_t channelIndex = 0; channelIndex < animation->mNumChannels; ++channelIndex)
		{
			const aiNodeAnim* nodeAnim = animation->mChannels[channelIndex];
			m_Bones.emplace(nodeAnim->mNodeName.C_Str());
		}
	}
}

第二步一套代码从assimp中读取了骨骼信息

void BoneHierarchy::TraverseNode(aiNode* node, Skeleton* skeleton, const glm::mat4& parentTransform)
{
	if (m_Bones.find(node->mName.C_Str()) != m_Bones.end())
	{
		skeleton->SetTransform(parentTransform);
		aiNode* parent = node->mParent;
		while (parent)
		{
			parent->mTransformation = aiMatrix4x4();
			parent = parent->mParent;
		}
		TraverseBone(node, skeleton, Skeleton::NullIndex);
	}
	else
	{
		auto transform = parentTransform * Utils::Mat4FromAIMatrix4x4(node->mTransformation);
		for (uint32_t nodeIndex = 0; nodeIndex < node->mNumChildren; ++nodeIndex)
		{
			TraverseNode(node->mChildren[nodeIndex], skeleton, transform);
		}
	}
}

void BoneHierarchy::TraverseBone(aiNode* node, Skeleton* skeleton, uint32_t parentIndex)
{
	uint32_t boneIndex = skeleton->AddBone(node->mName.C_Str(), parentIndex, Utils::Mat4FromAIMatrix4x4(node->mTransformation));
	for (uint32_t nodeIndex = 0; nodeIndex < node->mNumChildren; ++nodeIndex)
	{
		if (m_Bones.find(node->mChildren[nodeIndex]->mName.C_Str()) != m_Bones.end())
		{
			TraverseBone(node->mChildren[nodeIndex], skeleton, boneIndex);
		}
		else
		{
			// do not traverse any further.
			// It is not supported to have a non-bone and then more bones below it.
		}
	}
}

蒙皮权重处理

首先定义骨骼权重信息

	struct BoneInfluence
	{
		uint32_t BoneInfoIndices[4] = { 0, 0, 0, 0 };  // 影响当前顶点的骨骼索引（最多4个）
		float Weights[4] = { 0.0f, 0.0f, 0.0f, 0.0f }; // 对应骨骼的影响权重（最多4个）

		void AddBoneData(uint32_t boneInfoIndex, float weight)
		{
			if (weight < 0.0f || weight > 1.0f)
			{
				HZ_CORE_WARN("Vertex bone weight is out of range. We will clamp it to [0, 1] (BoneID={0}, Weight={1})", boneInfoIndex, weight);
				weight = std::clamp(weight, 0.0f, 1.0f);
			}
			if (weight > 0.0f)
			{
				for (size_t i = 0; i < 4; i++)
				{
					if (Weights[i] == 0.0f)
					{
						BoneInfoIndices[i] = boneInfoIndex;
						Weights[i] = weight;
						return;
					}
				}

				// Note: when importing from assimp we are passing aiProcess_LimitBoneWeights which automatically keeps only the top N (where N defaults to 4)
				//       bone weights (and normalizes the sum to 1), which is exactly what we want.
				//       So, we should never get here.
				HZ_CORE_WARN("Vertex has more than four bones affecting it, extra bone influences will be discarded (BoneID={0}, Weight={1})", boneInfoIndex, weight);
			}
		}

		void NormalizeWeights()
		{
			float sumWeights = 0.0f;
			for (size_t i = 0; i < 4; i++)
			{
				sumWeights += Weights[i];
			}
			if (sumWeights > 0.0f)
			{
				for (size_t i = 0; i < 4; i++)
				{
					Weights[i] /= sumWeights;
				}
			}
		}
	};

另外还要骨骼信息

struct BoneInfo
{
	glm::mat4 InverseBindPose;
	uint32_t BoneIndex;
	BoneInfo(const glm::mat4& inverseBindPose, uint32_t boneIndex)
		: InverseBindPose(inverseBindPose), BoneIndex(boneIndex) {
	}
};

下来遍历每个SubMesh的骨骼信息来处理每个顶点的权重信息

				// skinning weights
		meshSource->m_Skeleton = AssimpAnimationImporter::ImportSkeleton(scene);
		if (meshSource->HasSkeleton())
		{
			HZ_CORE_INFO_TAG("Mesh", "开始处理骨骼信息");
			meshSource->m_BoneInfluences.resize(meshSource->m_Vertices.size());
			for (uint32_t m = 0; m < scene->mNumMeshes; m++)
			{
				aiMesh* mesh = scene->mMeshes[m];
				Submesh& submesh = meshSource->m_Submeshes[m];

				if (mesh->mNumBones > 0)
				{
					submesh.IsRigged = true;
					for (uint32_t i = 0; i < mesh->mNumBones; i++)
					{
						aiBone* bone = mesh->mBones[i];
						bool hasNonZeroWeight = false;
						for (size_t j = 0; j < bone->mNumWeights; j++)
						{
							if (bone->mWeights[j].mWeight > 0.000001f)
							{
								hasNonZeroWeight = true;
								break;
							}
						}
						if (!hasNonZeroWeight)
							continue;

						// Find bone in skeleton
						uint32_t boneIndex = meshSource->m_Skeleton->GetBoneIndex(bone->mName.C_Str());
						if (boneIndex == Skeleton::NullIndex)
						{
							HZ_CORE_ERROR_TAG("Animation", "Could not find mesh bone '{}' in skeleton!", bone->mName.C_Str());
						}

						uint32_t boneInfoIndex = ~0;
						for (size_t j = 0; j < meshSource->m_BoneInfo.size(); ++j)
						{
							if (meshSource->m_BoneInfo[j].BoneIndex == boneIndex)
							{
								boneInfoIndex = static_cast<uint32_t>(j);
								break;
							}
						}
						if (boneInfoIndex == ~0)
						{
							boneInfoIndex = static_cast<uint32_t>(meshSource->m_BoneInfo.size());
							const auto& boneInfo = meshSource->m_BoneInfo.emplace_back(Utils::Mat4FromAIMatrix4x4(bone->mOffsetMatrix), boneIndex);
							HZ_CORE_INFO_TAG("Mesh", "BoneInfo for bone '{0}'", bone->mName.C_Str());
							HZ_CORE_INFO_TAG("Mesh", "  SubMeshIndex = {0}", m);
							HZ_CORE_INFO_TAG("Mesh", "  BoneIndex = {0}", boneIndex);
							glm::vec3 translation;
							glm::quat rotationQuat;
							glm::vec3 scale;
							Math::DecomposeTransform(boneInfo.InverseBindPose, translation, rotationQuat, scale);
							glm::vec3 rotation = glm::degrees(glm::eulerAngles(rotationQuat));
							HZ_CORE_INFO_TAG("Mesh", "  Inverse Bind Pose = {");
							HZ_CORE_INFO("    translation: ({0:8.4f}, {1:8.4f}, {2:8.4f})", translation.x, translation.y, translation.z);
							HZ_CORE_INFO("    rotation:    ({0:8.4f}, {1:8.4f}, {2:8.4f})", rotation.x, rotation.y, rotation.z);
							HZ_CORE_INFO("    scale:       ({0:8.4f}, {1:8.4f}, {2:8.4f})", scale.x, scale.y, scale.z);
							HZ_CORE_INFO("  }");
						}

						for (size_t j = 0; j < bone->mNumWeights; j++)
						{
							int VertexID = submesh.BaseVertex + bone->mWeights[j].mVertexId;
							float Weight = bone->mWeights[j].mWeight;
							meshSource->m_BoneInfluences[VertexID].AddBoneData(boneInfoIndex, Weight);
						}
					}
				}
			}

			for (auto& boneInfluence : meshSource->m_BoneInfluences)
			{
				boneInfluence.NormalizeWeights();
			}
		}

至此为MeshSource导入了骨骼信息，封装为

1
2

	std::vector<BoneInfluence> m_BoneInfluences; // 每个顶点对应的骨骼影响数据
	std::vector<BoneInfo> m_BoneInfo; // 骨骼信息

动画构建

GLTF的动画结构

采样器:定义了有几个关键帧，以及每个关键帧对应的骨骼运动信息
通道：指明一根骨骼由哪个采样器控制，以及控制方式（平移、旋转、缩放）

使用游戏引擎制作动画时的关键帧是统一设置了所有骨骼的变换信息，GLTF对每个骨骼单独控制，节省了很多空间，因为可能两个关键帧之间某些骨骼并没有变换，但是统一存储还得存一遍。下面是一个开火动画的例子

 "animations" : [    
        {
            "name" : "Fire", // 开火动画的例子
            "samplers" : [
                {
                    "input" : 7, // 存储的是所有关键帧的时间点（7只是访问accessors 数组的索引）
                    "interpolation" : "LINEAR", // 采用线性插值
                    "output" : 8 // 与input里一一对应的关键帧的数据
                },
                {
                    "input" : 7,
                    "interpolation" : "LINEAR",
                    "output" : 9
                }
            ]，
            "channels" : [
                {
                    "sampler" : 0, // 指定一个采样器
                    "target" : {
                        "node" : 5, // 指定这个采样器作用哪个骨骼
                        "path" : "translation" // 作用的方式
                    }
                },
                {
                    "sampler" : 1,
                    "target" : {
                        "node" : 5,
                        "path" : "rotation"
                    }
                }
            ]
        }
    ]

动画数据本质就是存储每个关键帧的骨骼变换数据，GLTF这样存储是一种优化手段

GLTF动画数据导入

定义关键帧

template<typename T> struct KeyFrame
{
	float FrameTime;
	T Value;
	KeyFrame(const float frameTime, const T& value) : FrameTime(frameTime), Value(value) {}
};

定义Channel结构,对于一组关键帧，存储一根骨骼每个关键帧的变换数据，以及骨骼的Index（捕捉了 “单根骨骼的完整动画轨迹”）

struct Channel
{
	std::vector<KeyFrame<glm::vec3>> Translations;
	std::vector<KeyFrame<glm::quat>> Rotations;
	std::vector<KeyFrame<glm::vec3>> Scales;
	uint32_t Index;
};

下面给出如何封装所有骨骼的Channel

static std::vector<Channel> ImportChannels(aiAnimation* anim, const Skeleton& skeleton, const bool isMaskedRootMotion, const glm::vec3& rootTranslationMask, float rootRotationMask)
{
	std::vector<Channel> channels;

	std::unordered_map<std::string_view, uint32_t> boneIndices;
	std::unordered_set<uint32_t> rootBoneIndices;
	for (uint32_t i = 0; i < skeleton.GetNumBones(); ++i)
	{
		boneIndices.emplace(skeleton.GetBoneName(i), i + 1);  // 0 is reserved for root motion channel    boneIndices are base=1
		if (skeleton.GetParentBoneIndex(i) == Skeleton::NullIndex)
			rootBoneIndices.emplace(i + 1);
	}

	std::map<uint32_t, aiNodeAnim*> validChannels;
	for (uint32_t channelIndex = 0; channelIndex < anim->mNumChannels; ++channelIndex)
	{
		aiNodeAnim* nodeAnim = anim->mChannels[channelIndex];
		auto it = boneIndices.find(nodeAnim->mNodeName.C_Str());
		if (it != boneIndices.end())
		{
			validChannels.emplace(it->second, nodeAnim);   // validChannels.first is base=1,  .second is node pointer
		}
	}

	channels.resize(skeleton.GetNumBones() + 1);   // channels is base=1

	// channels don't necessarily have first frame at time zero.
	// We can just generate a dummy key frame, but that can end up looking a bit odd (in particular,
	// looping animations appear to pause for a split second each time they loop and encounter the
	// dummy key frame.
	// So instead, we clip the animation time horizon.
	double firstFrameDelta = DBL_MAX;
	double animationDuration = anim->mDuration;
	for (uint32_t boneIndex = 1; boneIndex < channels.size(); ++boneIndex)
	{
		if (auto validChannel = validChannels.find(boneIndex); validChannel != validChannels.end())
		{
			auto nodeAnim = validChannel->second;
			if (nodeAnim->mNumPositionKeys > 0)
				firstFrameDelta = std::min(firstFrameDelta, nodeAnim->mPositionKeys[0].mTime);

			if (nodeAnim->mNumRotationKeys > 0)
				firstFrameDelta = std::min(firstFrameDelta, nodeAnim->mRotationKeys[0].mTime);

			if (nodeAnim->mNumScalingKeys > 0)
				firstFrameDelta = std::min(firstFrameDelta, nodeAnim->mScalingKeys[0].mTime);
		}
	}

	anim->mDuration -= firstFrameDelta;

	// The rest of the code assumes non-zero animation duration.
	// Enforce that here.
	if (anim->mDuration <= 0.0) {
		anim->mDuration = 1.0;
	}

	for (uint32_t boneIndex = 1; boneIndex < channels.size(); ++boneIndex)
	{
		Channel& channel = channels[boneIndex];
		channel.Index = boneIndex;
		if (auto validChannel = validChannels.find(boneIndex); validChannel != validChannels.end())
		{
			auto nodeAnim = validChannel->second;
			channel.Translations.reserve(nodeAnim->mNumPositionKeys + 2); // +2 because worst case we insert two more keys
			channel.Rotations.reserve(nodeAnim->mNumRotationKeys + 2);
			channel.Scales.reserve(nodeAnim->mNumScalingKeys + 2);
			// Note: There is no need to check for duplicate keys (i.e. multiple keys all at same frame time)
			//       because Assimp throws these out for us
			for (uint32_t keyIndex = 0; keyIndex < nodeAnim->mNumPositionKeys; ++keyIndex)
			{
				aiVectorKey key = nodeAnim->mPositionKeys[keyIndex];
				float frameTime = std::clamp(static_cast<float>((key.mTime - firstFrameDelta) / anim->mDuration), 0.0f, 1.0f);
				if ((keyIndex == 0) && (frameTime > 0.0f))
				{
					channels[boneIndex].Translations.emplace_back(0.0f, glm::vec3{ static_cast<float>(key.mValue.x), static_cast<float>(key.mValue.y), static_cast<float>(key.mValue.z) });
				}
				channel.Translations.emplace_back(frameTime, glm::vec3{ static_cast<float>(key.mValue.x), static_cast<float>(key.mValue.y), static_cast<float>(key.mValue.z) });
			}
			if (channel.Translations.empty())
			{
				HZ_CORE_WARN_TAG("Animation", "No translation track found for bone '{}'", skeleton.GetBoneName(boneIndex - 1));
				channel.Translations = { {0.0f, glm::vec3{0.0f}}, {1.0f, glm::vec3{0.0f}} };
			}
			else if (channel.Translations.back().FrameTime < 1.0f)
			{
				channel.Translations.emplace_back(1.0f, channel.Translations.back().Value);
			}
			for (uint32_t keyIndex = 0; keyIndex < nodeAnim->mNumRotationKeys; ++keyIndex)
			{
				aiQuatKey key = nodeAnim->mRotationKeys[keyIndex];
				float frameTime = std::clamp(static_cast<float>((key.mTime - firstFrameDelta) / anim->mDuration), 0.0f, 1.0f);
				// WARNING: constructor parameter order for a quat is still WXYZ even if you have defined GLM_FORCE_QUAT_DATA_XYZW
				if ((keyIndex == 0) && (frameTime > 0.0f))
				{
					channel.Rotations.emplace_back(0.0f, glm::quat{ static_cast<float>(key.mValue.w), static_cast<float>(key.mValue.x), static_cast<float>(key.mValue.y), static_cast<float>(key.mValue.z) });
				}
				channel.Rotations.emplace_back(frameTime, glm::quat{ static_cast<float>(key.mValue.w), static_cast<float>(key.mValue.x), static_cast<float>(key.mValue.y), static_cast<float>(key.mValue.z) });
				HZ_CORE_ASSERT(fabs(glm::length(channels[boneIndex].Rotations.back().Value) - 1.0f) < 0.00001f);   // check rotations are normalized (I think assimp ensures this, but not 100% sure)
			}
			if (channel.Rotations.empty())
			{
				HZ_CORE_WARN_TAG("Animation", "No rotation track found for bone '{}'", skeleton.GetBoneName(boneIndex - 1));
				channel.Rotations = { {0.0f, glm::quat{1.0f, 0.0f, 0.0f, 0.0f}}, {1.0f, glm::quat{1.0f, 0.0f, 0.0f, 0.0f}} };
			}
			else if (channel.Rotations.back().FrameTime < 1.0f)
			{
				channel.Rotations.emplace_back(1.0f, channel.Rotations.back().Value);
			}
			for (uint32_t keyIndex = 0; keyIndex < nodeAnim->mNumScalingKeys; ++keyIndex)
			{
				aiVectorKey key = nodeAnim->mScalingKeys[keyIndex];
				float frameTime = std::clamp(static_cast<float>((key.mTime - firstFrameDelta) / anim->mDuration), 0.0f, 1.0f);
				if (keyIndex == 0 && frameTime > 0.0f)
				{
					channel.Scales.emplace_back(0.0f, glm::vec3{ static_cast<float>(key.mValue.x), static_cast<float>(key.mValue.y), static_cast<float>(key.mValue.z) });
				}
				channel.Scales.emplace_back(frameTime, glm::vec3{ static_cast<float>(key.mValue.x), static_cast<float>(key.mValue.y), static_cast<float>(key.mValue.z) });
			}
			if (channel.Scales.empty())
			{
				HZ_CORE_WARN_TAG("Animation", "No scale track found for bone '{}'", skeleton.GetBoneName(boneIndex - 1));
				channel.Scales = { {0.0f, glm::vec3{1.0f}}, {1.0f, glm::vec3{1.0f}} };
			}
			else if (channel.Scales.back().FrameTime < 1.0f)
			{
				channel.Scales.emplace_back(1.0f, channels[boneIndex].Scales.back().Value);
			}
		}
		else
		{
			HZ_CORE_WARN_TAG("Animation", "No animation tracks found for bone '{}'", skeleton.GetBoneName(boneIndex - 1));

			auto translation = skeleton.GetBoneTranslations().at(boneIndex - 1);
			auto rotation = skeleton.GetBoneRotations().at(boneIndex - 1);
			auto scale = skeleton.GetBoneScales().at(boneIndex - 1);

			channel.Translations = { {0.0f, translation}, {1.0f, translation} };
			channel.Rotations = { {0.0f, rotation}, {1.0f, rotation} };
			channel.Scales = { {0.0f, scale}, {1.0f, scale} };
		}
	}

	// Create root motion channel.
	// If isMaskedRootMotion is true, then root motion channel is created by filtering components of the first channel.
	// Otherwise root motion channel is copied as-is from the first channel.
	//
	// Root motion is then removed from all "root" channels (so it doesn't get applied twice)

	HZ_CORE_ASSERT(!rootBoneIndices.empty()); // Can't see how this would ever be false!
	HZ_CORE_ASSERT(rootBoneIndices.find(1) != rootBoneIndices.end()); // First bone must be a root!

	Channel& root = channels[0];
	root.Index = 0;
	if (isMaskedRootMotion)
	{
		for (auto& translation : channels[1].Translations)
		{
			root.Translations.emplace_back(translation.FrameTime, translation.Value * rootTranslationMask);
			translation.Value *= (glm::vec3(1.0f) - rootTranslationMask);
			translation.Value += root.Translations.front().Value;
		}
		for (auto& rotation : channels[1].Rotations)
		{
			if (rootRotationMask > 0.0f)
			{
				auto angleY = Utils::AngleAroundYAxis(rotation.Value);
				root.Rotations.emplace_back(rotation.FrameTime, glm::quat{ glm::cos(angleY * 0.5f), glm::vec3{0.0f, 1.0f, 0.0f} *glm::sin(angleY * 0.5f) });
				rotation.Value = glm::conjugate(glm::quat(glm::cos(angleY * 0.5f), glm::vec3{ 0.0f, 1.0f, 0.0f } *glm::sin(angleY * 0.5f))) * rotation.Value;
				rotation.Value *= root.Rotations.front().Value;
			}
			else
			{
				root.Rotations.emplace_back(rotation.FrameTime, glm::quat{ 1.0f, 0.0f, 0.0f, 0.0f });
			}
		}
	}
	else
	{
		root.Translations = channels[1].Translations;
		root.Rotations = channels[1].Rotations;
		channels[1].Translations = { {0.0f, root.Translations.front().Value}, {1.0f, root.Translations.front().Value} };
		channels[1].Rotations = { {0.0f, root.Rotations.front().Value}, {1.0f, root.Rotations.front().Value} };
	}
	root.Scales = { {0.0f, glm::vec3{1.0f}}, {1.0f, glm::vec3{1.0f}} };

	// It is possible that there is more than one "root" bone in the asset.
	// We need to remove the root motion from all of them (otherwise those bones will move twice as fast when root motion is applied)
	for (const auto rootBoneIndex : rootBoneIndices)
	{
		// we already removed root motion from the first bone, above
		if (rootBoneIndex != 1)
		{
			for (auto& translation : channels[rootBoneIndex].Translations)
			{
				// sample root channel at this translation's frametime
				for (size_t rootFrame = 0; rootFrame < root.Translations.size() - 1; ++rootFrame)
				{
					if (root.Translations[rootFrame + 1].FrameTime >= translation.FrameTime)
					{
						const float alpha = (translation.FrameTime - root.Translations[rootFrame].FrameTime) / (root.Translations[rootFrame + 1].FrameTime - root.Translations[rootFrame].FrameTime);
						translation.Value -= glm::mix(root.Translations[rootFrame].Value, root.Translations[rootFrame + 1].Value, alpha);
						translation.Value += root.Translations.front().Value;
						break;
					}
				}
			}

			for (auto& rotation : channels[rootBoneIndex].Rotations)
			{
				// sample root channel at the this rotation's frametime
				for (size_t rootFrame = 0; rootFrame < root.Rotations.size() - 1; ++rootFrame)
				{
					if (root.Rotations[rootFrame + 1].FrameTime >= rotation.FrameTime)
					{
						const float alpha = (rotation.FrameTime - root.Rotations[rootFrame].FrameTime) / (root.Rotations[rootFrame + 1].FrameTime - root.Rotations[rootFrame].FrameTime);
						rotation.Value = glm::normalize(glm::conjugate(glm::slerp(root.Rotations[rootFrame].Value, root.Rotations[rootFrame + 1].Value, alpha)) * rotation.Value);
						rotation.Value *= root.Rotations.front().Value;
						break;
					}
				}
			}
		}
	}
	return channels;
}

压缩算法（如 ACL）要求所有骨骼的关键帧数量和时间戳严格对齐，否则无法批量处理。但是GLTF导入的骨骼关键帧是不同的采样器得到的，不一定一致，所以需要统一化

	void SanitizeChannels(std::vector<Channel>& channels)
	{
		uint32_t maxNumFrames = 2; // The rest of the code requires each channel to have at least 2 frames
		for (const auto& channel : channels)
		{
			maxNumFrames = std::max(maxNumFrames, static_cast<uint32_t>(channel.Translations.size()));
			maxNumFrames = std::max(maxNumFrames, static_cast<uint32_t>(channel.Rotations.size()));
			maxNumFrames = std::max(maxNumFrames, static_cast<uint32_t>(channel.Scales.size()));
		}

		float frameInterval = 1.0f / (maxNumFrames - 1);

		// loop over all channels and change them so they all have maxNumFrames frames.
		// add new frames where necessary by interpolating between existing frames.
		for (auto& channel : channels)
		{
			Channel newChannel;

			uint32_t translationIndex = 1;
			newChannel.Translations.reserve(maxNumFrames);
			newChannel.Translations.emplace_back(channel.Translations[0]);
			for (uint32_t i = 1; i < maxNumFrames - 1; ++i)
			{
				float frameTime = i * frameInterval;
				while ((translationIndex < channel.Translations.size()) && (channel.Translations[translationIndex].FrameTime < frameTime))
				{
					++translationIndex;
				}
				const float t = (frameTime - channel.Translations[translationIndex - 1].FrameTime) / (channel.Translations[translationIndex].FrameTime - channel.Translations[translationIndex - 1].FrameTime);
				newChannel.Translations.emplace_back(frameTime, glm::mix(channel.Translations[translationIndex - 1].Value, channel.Translations[translationIndex].Value, t));
			}
			newChannel.Translations.emplace_back(channel.Translations.back());

			uint32_t rotationIndex = 1;
			newChannel.Rotations.reserve(maxNumFrames);
			newChannel.Rotations.emplace_back(channel.Rotations[0]);
			for (uint32_t i = 1; i < maxNumFrames - 1; ++i)
			{
				float frameTime = i * frameInterval;
				while ((rotationIndex < channel.Rotations.size()) && (channel.Rotations[rotationIndex].FrameTime < frameTime))
				{
					++rotationIndex;
				}
				const float t = (frameTime - channel.Rotations[rotationIndex - 1].FrameTime) / (channel.Rotations[rotationIndex].FrameTime - channel.Rotations[rotationIndex - 1].FrameTime);
				newChannel.Rotations.emplace_back(frameTime, glm::slerp(channel.Rotations[rotationIndex - 1].Value, channel.Rotations[rotationIndex].Value, t));
			}
			newChannel.Rotations.emplace_back(channel.Rotations.back());

			uint32_t scaleIndex = 1;
			newChannel.Scales.reserve(maxNumFrames);
			newChannel.Scales.emplace_back(channel.Scales[0]);
			for (uint32_t i = 1; i < maxNumFrames - 1; ++i)
			{
				float frameTime = i * frameInterval;
				while ((scaleIndex < channel.Scales.size()) && (channel.Scales[scaleIndex].FrameTime < frameTime))
				{
					++scaleIndex;
				}
				const float t = (frameTime - channel.Scales[scaleIndex - 1].FrameTime) / (channel.Scales[scaleIndex].FrameTime - channel.Scales[scaleIndex - 1].FrameTime);
				newChannel.Scales.emplace_back(frameTime, glm::mix(channel.Scales[scaleIndex - 1].Value, channel.Scales[scaleIndex].Value, t));
			}
			newChannel.Scales.emplace_back(channel.Scales.back());

			channel.Translations = std::move(newChannel.Translations);
			channel.Rotations = std::move(newChannel.Rotations);
			channel.Scales = std::move(newChannel.Scales);
		}
	}

进一步使用acl压缩动画数据

	acl::error_result CompressChannels(const std::vector<Channel>& channels, const float fps, const Skeleton& skeleton, acl::compressed_tracks*& outCompressedTracks)
	{
		acl::iallocator& allocator = Utils::GetAnimationAllocator();
		uint32_t numTracks = static_cast<uint32_t>(channels.size());
		uint32_t numSamples = static_cast<uint32_t>(channels[0].Translations.size());
		acl::track_array_qvvf rawTrackList(allocator, numTracks);

		for (uint32_t i = 0; i < numTracks; ++i)
		{
			acl::track_desc_transformf desc;
			desc.output_index = i;
			desc.parent_index = (i == 0) ? acl::k_invalid_track_index : skeleton.GetParentBoneIndex(i - 1) + 1;  // 0 is root motion channel, 1..numBones are in the skeleton
			desc.precision = 0.0001f;
			desc.shell_distance = 3.0f;

			acl::track_qvvf rawTrack = acl::track_qvvf::make_reserve(desc, allocator, numSamples, fps);
			for (uint32_t j = 0; j < numSamples; ++j)
			{
				const auto& translation = channels[i].Translations[j].Value;
				const auto& rotation = channels[i].Rotations[j].Value;
				const auto& scale = channels[i].Scales[j].Value;

				rawTrack[j].rotation = rtm::quat_set(rotation.x, rotation.y, rotation.z, rotation.w);
				rawTrack[j].translation = rtm::vector_set(translation.x, translation.y, translation.z);
				rawTrack[j].scale = rtm::vector_set(scale.x, scale.y, scale.z);
			}
			rawTrackList[i] = std::move(rawTrack);
		}

		acl::pre_process_settings_t preProcessSettings;
		preProcessSettings.actions = acl::pre_process_actions::recommended;
		preProcessSettings.precision_policy = acl::pre_process_precision_policy::lossy;
		acl::qvvf_transform_error_metric error_metric;
		preProcessSettings.error_metric = &error_metric;
		acl::error_result result = acl::pre_process_track_list(allocator, preProcessSettings, rawTrackList);
		if (result.any())
		{
			return result;
		}

		acl::compression_settings compressSettings = acl::get_default_compression_settings();
		compressSettings.error_metric = &error_metric;
		acl::output_stats stats{ acl::stat_logging::none };
		result = acl::compress_track_list(allocator, rawTrackList, compressSettings, outCompressedTracks, stats);

		return result;
	}

ACL动画压缩

acl::error_result CompressChannels(const std::vector<Channel>& channels, const float fps, const Skeleton& skeleton, acl::compressed_tracks*& outCompressedTracks)
{
	acl::iallocator& allocator = Utils::GetAnimationAllocator();
	uint32_t numTracks = static_cast<uint32_t>(channels.size());
	uint32_t numSamples = static_cast<uint32_t>(channels[0].Translations.size());
	acl::track_array_qvvf rawTrackList(allocator, numTracks);

	for (uint32_t i = 0; i < numTracks; ++i)
	{
		acl::track_desc_transformf desc;
		desc.output_index = i;
		desc.parent_index = (i == 0) ? acl::k_invalid_track_index : skeleton.GetParentBoneIndex(i - 1) + 1;  // 0 is root motion channel, 1..numBones are in the skeleton
		desc.precision = 0.0001f;
		desc.shell_distance = 3.0f;

		acl::track_qvvf rawTrack = acl::track_qvvf::make_reserve(desc, allocator, numSamples, fps);
		for (uint32_t j = 0; j < numSamples; ++j)
		{
			const auto& translation = channels[i].Translations[j].Value;
			const auto& rotation = channels[i].Rotations[j].Value;
			const auto& scale = channels[i].Scales[j].Value;

			rawTrack[j].rotation = rtm::quat_set(rotation.x, rotation.y, rotation.z, rotation.w);
			rawTrack[j].translation = rtm::vector_set(translation.x, translation.y, translation.z);
			rawTrack[j].scale = rtm::vector_set(scale.x, scale.y, scale.z);
		}
		rawTrackList[i] = std::move(rawTrack);
	}

	acl::pre_process_settings_t preProcessSettings;
	preProcessSettings.actions = acl::pre_process_actions::recommended;
	preProcessSettings.precision_policy = acl::pre_process_precision_policy::lossy;
	acl::qvvf_transform_error_metric error_metric;
	preProcessSettings.error_metric = &error_metric;
	acl::error_result result = acl::pre_process_track_list(allocator, preProcessSettings, rawTrackList);
	if (result.any())
	{
		return result;
	}

	acl::compression_settings compressSettings = acl::get_default_compression_settings();
	compressSettings.error_metric = &error_metric;
	acl::output_stats stats{ acl::stat_logging::none };
	result = acl::compress_track_list(allocator, rawTrackList, compressSettings, outCompressedTracks, stats);

	return result;
}

到这里模型的骨骼信息和动画信息都封装好了

渲染动画

动画相关组件

struct DynamicMeshComponent
{
	AssetHandle MeshSource = 0;
};
struct SubmeshComponent
{
	AssetHandle Mesh;
	std::vector<UUID> BoneEntityIds; 
	uint32_t SubmeshIndex = 0;
	bool Visible = true;

	SubmeshComponent() = default;
	SubmeshComponent(const SubmeshComponent& other)
		: Mesh(other.Mesh), BoneEntityIds(other.BoneEntityIds), SubmeshIndex(other.SubmeshIndex), Visible(other.Visible)
	{
	}
	SubmeshComponent(AssetHandle mesh, uint32_t submeshIndex = 0)
		: Mesh(mesh), SubmeshIndex(submeshIndex)
	{
	}
};
struct AnimationComponent
{
    AssetHandle Mesh;
    const Animation* CurrentAnimation; 
    float CurrentTime = 0.0f;
    bool IsLooping = true; 
    Pose CurrentPose;      

    std::vector<UUID> BoneEntityIds; 
    AnimationComponent() = default;
    AnimationComponent(AssetHandle mesh):Mesh(mesh)
    {
    }
};

收集动画Mesh

定义骨骼UBO，同实例化渲染的设计，通过MeshKey来区分不一样的DrawCall，所有Submesh只要材质一样就会被实例化调用，另外用StorageBufferSet平铺骨骼变换矩阵

		using BoneTransforms = std::array<glm::mat4, 100>; // Note: 100 == MAX_BONES from the shaders
		struct BoneTransformsMapData
		{
			std::vector<BoneTransforms> BoneTransformsData;
			uint32_t BoneTransformsBaseIndex = 0;
		};
		std::map<MeshKey, BoneTransformsMapData> m_MeshBoneTransformsMap;
		Ref<StorageBufferSet> m_SBSBoneTransforms;

Shader中，通过a_BoneIndices传递该顶点绑定的骨骼，a_BoneWeights传递权重。这些信息在Mesh导入时已经被封装。通过顶点缓冲区导入

#version 450 core
#ifdef VERTEX_SHADER
layout(binding = 0) uniform UniformBufferObject {
    mat4 view;
    mat4 proj;
	float width;
	float height;
	float Near;
	float Far;
} ubo;
const int MAX_BONES = 100;
const int MAX_ANIMATED_MESHES = 1024;
layout(location = 0) in vec3 inPosition;
layout(location = 1) in vec3 inNormal;
layout(location = 2) in vec3 inTangent;
layout(location = 3) in vec3 inBinormal; 
layout(location = 4) in vec2 inTexCoord;
layout(location = 5) in vec4 a_MRow0;
layout(location = 6) in vec4 a_MRow1;
layout(location = 7) in vec4 a_MRow2;
// Bone influences
layout(location = 8) in ivec4 a_BoneIndices;
layout(location = 9) in vec4 a_BoneWeights;
layout (std140, set = 0, binding = 1) readonly buffer BoneTransforms
{
	mat4 BoneTransforms[MAX_BONES * MAX_ANIMATED_MESHES];
} r_BoneTransforms;

layout(push_constant) uniform BoneTransformIndex
{
	uint Base;
} u_BoneTransformIndex;


layout(location = 0) out vec3 fragWorldPos;
layout(location = 1) out vec3 fragWorldNormal;
layout(location = 2) out vec3 fragWorldTangent;
layout(location = 3) out vec3 fragWorldBinormal;
layout(location = 4) out vec2 fragTexCoord;

void main() {
    mat4 transform = mat4(
		vec4(a_MRow0.x, a_MRow1.x, a_MRow2.x, 0.0),
		vec4(a_MRow0.y, a_MRow1.y, a_MRow2.y, 0.0),
		vec4(a_MRow0.z, a_MRow1.z, a_MRow2.z, 0.0),
		vec4(a_MRow0.w, a_MRow1.w, a_MRow2.w, 1.0)
	);
	mat4 boneTransform = r_BoneTransforms.BoneTransforms[(u_BoneTransformIndex.Base + gl_InstanceIndex) * MAX_BONES + a_BoneIndices[0]] * a_BoneWeights[0];
	boneTransform     += r_BoneTransforms.BoneTransforms[(u_BoneTransformIndex.Base + gl_InstanceIndex) * MAX_BONES + a_BoneIndices[1]] * a_BoneWeights[1];
	boneTransform     += r_BoneTransforms.BoneTransforms[(u_BoneTransformIndex.Base + gl_InstanceIndex) * MAX_BONES + a_BoneIndices[2]] * a_BoneWeights[2];
	boneTransform     += r_BoneTransforms.BoneTransforms[(u_BoneTransformIndex.Base + gl_InstanceIndex) * MAX_BONES + a_BoneIndices[3]] * a_BoneWeights[3];

    vec4 worldPos = transform * boneTransform * vec4(inPosition, 1.0);
    fragWorldPos = worldPos.xyz;
		
    mat3 modelRot = mat3(transform);
    mat3 boneRot = mat3(boneTransform);
    fragWorldNormal = normalize(modelRot * boneRot * inNormal);
    fragWorldTangent = normalize(modelRot * boneRot * inTangent);
    fragWorldBinormal = normalize(modelRot * boneRot * inBinormal);
    fragTexCoord = inTexCoord;
    gl_Position = ubo.proj * ubo.view * worldPos;
}
#endif

OpenGLRender开发记录（3）：后处理Pass（大气渲染）

Sun, 19 Oct 2025 14:20:40 +0800

大气渲染

渲染方法分析

光如何与Participating Media Particles（包括小粒子（气体分子），大粒子（气溶胶、水滴、烟雾））交互？

吸收
外散射
自发光
内散射 M点为着色点，那从P点看向M点时，需要计算两个值（1）Transmittance(透光度):有多少光能透过来(2) Scattering：粒子会把来自各个方向的光散射到观察方向

真实大气物理

太阳光由不同波长的光组成，人眼把这些波长光的组合定义成了白色而已大气中包含两种粒子：气体分子一般小于这些光的波长，其他的气溶胶大于这些波长有两种完全不同的散射模型来末说这两种粒子的散射

瑞利散射 Rayleigh Scattering （针对气体分子）

散射特点：对波长敏感，短波长（蓝光）更容易被散射，所以天空是蓝色。各种波长光散射形状差不多，但是强度不同，各个方向上散射大致相同具体的模型公式有两部分，前半部分是各种系数、后半部分是模型形状（花生形状）。公式表达含义是在在散射方向 θ上的散射光强，它与光的波长、海拔高度有关直观理解天空为什么是蓝色，太阳直射时，大量的蓝光被散射开来，红光散射比较弱。太阳落山时，大量的蓝光散射到了太空和地面，红光的散射效果体现了出来

米氏散射 Mie scattering （针对大分子）

米氏散射对波长依赖弱 → 散射几乎不偏色，所以雾和云看起来白色或灰色所有波长的光一视同仁，但是不同的散射方向能力有巨大差异奇怪的形状。

光的吸收

这两种气体会吸收光，但模型过于复杂，在渲染中假设他们均匀分布

单次散射和多次散射

单次散射只考虑太阳光到一个粒子后散射到摄像机多次散射就是考虑一个粒子散射到另一个粒子这样不停散射最终到达摄像机主要看山的背面，多次散射才能表达出这种感觉

大气渲染实践

瑞利散射和米氏散射建模

参考别的论文，他们是用h = 0时求出的解作为基准，用一个高度衰减函数进行高度衰减。函数都有两部分，一部分求解散射系数一部分求解相函数瑞利散射：

vec3 RayleighCoefficient(in AtmosphereParameter param, float h)
{
    const vec3 sigma = vec3(5.802, 13.558, 33.1) * 1e-6;
    float H_R = param.RayleighScatteringScalarHeight;
    float rho_h = exp(-(h / H_R));
    return sigma * rho_h;
}

float RayleighPhase(in AtmosphereParameter param, float cos_theta)
{
    return (3.0 / (16.0 * 3.14159265)) * (1.0 + cos_theta * cos_theta);
}

米氏散射多一个g，用来控制米氏散射的形状


vec3 MieCoefficient(AtmosphereParameter param, float h)
{
    const vec3 sigma = vec3(3.996e-6);
    float H_M = param.MieScatteringScalarHeight;
    float rho_h = exp(-(h / H_M));
    return sigma * rho_h;
}

float MiePhase(AtmosphereParameter param, float cos_theta)
{
    float g = param.MieAnisotropy;

    float a = 3.0 / (8.0 * 3.14159265);
    float b = (1.0 - g * g) / (2.0 + g * g);
    float c = 1.0 + cos_theta * cos_theta;
    float d = pow(1.0 + g * g - 2.0 * g * cos_theta, 1.5);

    return a * b * (c / d);
}

散射结果，将两种散射结果相加，得到太阳光被一个粒子散射到摄像机的三色比例

vec3 Scattering(AtmosphereParameter param, vec3 p, vec3 lightDir, vec3 viewDir)
{
    float cos_theta = dot(lightDir, viewDir);

    float h = length(p) - param.PlanetRadius;
    vec3 rayleigh = RayleighCoefficient(param, h) * RayleighPhase(param, cos_theta);
    vec3 mie = MieCoefficient(param, h) * MiePhase(param, cos_theta);

    return rayleigh + mie;
}

吸收建模

瑞利散射没有吸收，米氏有吸收，另外大气中的臭氧也有吸收效应

vec3 MieAbsorption(AtmosphereParameter param, float h)
{
    const vec3 sigma = vec3(4.4e-6);
    float H_M = param.MieScatteringScalarHeight;
    float rho_h = exp(-(h / H_M));
    return sigma * rho_h;
}

vec3 OzoneAbsorption(AtmosphereParameter param, float h)
{
    const vec3 sigma_lambda = vec3(0.650, 1.881, 0.085) * 1e-6;
    float center = param.OzoneLevelCenterHeight;
    float width = param.OzoneLevelWidth;
    float rho = max(0.0, 1.0 - abs(h - center) / width);
    return sigma_lambda * rho;
}

透光率

透光率与经过的路径和吸收有关，由于每个点的吸收不同，所以采样处理

vec3 Transmittance(in AtmosphereParameter param, vec3 p1, vec3 p2)
{
    const int N_SAMPLE = 32;

    vec3 dir = normalize(p2 - p1);
    float distance = length(p2 - p1);
    float ds = distance / float(N_SAMPLE);
    vec3 sum = vec3(0.0);
    vec3 p = p1 + dir * ds * 0.5;

    for(int i = 0; i < N_SAMPLE; i++)
    {
        float h = length(p) - param.PlanetRadius;

        vec3 scattering = RayleighCoefficient(param, h) + MieCoefficient(param, h);
        vec3 absorption = OzoneAbsorption(param, h) + MieAbsorption(param, h);
        vec3 extinction = scattering + absorption;

        sum += extinction * ds;
        p += dir * ds;
    }

    // 计算透光率
    return exp(-sum);
}

单次散射

首先要有一个光线与球体求交的计算

float RayIntersectSphere(vec3 center, float radius, vec3 rayStart, vec3 rayDir)
{
    float OS = length(center - rayStart);
    float SH = dot(center - rayStart, rayDir);
    float OH = sqrt(OS * OS - SH * SH);

    // 射线未击中球体
    if(OH > radius) return -1.0;

    float PH = sqrt(radius * radius - OH * OH);

    // 使用最小正距离
    float t1 = SH - PH;
    float t2 = SH + PH;
    float t = (t1 < 0.0) ? t2 : t1;

    return t;
}

对于单次散射而言，从摄像机位置RM获得每一个采样点，每一个采样点进行光照计算，最后汇总

vec3 singleScatterSkyColor(vec3 camPosInPlanet, AtmosphereParameter param, vec3 viewDir){
    vec3 lightDir = normalize(-lightPos);
    int N_SAMPLE = 16;
    float dstToPlanet = RayIntersectSphere(vec3(0,0,0), param.PlanetRadius, camPosInPlanet, viewDir);
    float dstToAtmosphere = RayIntersectSphere(vec3(0,0,0), param.PlanetRadius + param.AtmosphereHeight, camPosInPlanet, viewDir);
    // 还没实现别的渲染，纯黑的，先不判断
//    if(dstToPlanet > 0.0 || dstToAtmosphere < 0.0){
//        return vec3(0);
//    }
    float stepSize = dstToAtmosphere / float(N_SAMPLE);
    vec3 testPoint = camPosInPlanet;
    vec3 color = vec3(0);
    for (int i =0; i<N_SAMPLE; i++) {
        // 太阳方向rayMarching的距离
        float disToLight = RayIntersectSphere(vec3(0,0,0), param.PlanetRadius + param.AtmosphereHeight, testPoint, lightDir);
        // 太阳到采样点之间的透光率
        vec3 tramsmittanceLightToTest = Transmittance(param,testPoint + lightDir * disToLight,testPoint);
        // 散射光比例
        vec3 scattering = Scattering(param, testPoint, lightDir, viewDir);
        // 摄像机到采样点之间的透光度
        vec3 tramsmittanceTestToCam = Transmittance(param,testPoint,camPosInPlanet);
        // 采样点的光照计算。// TODO：需要把太阳光放大很多倍才有比较亮的效果（因为ToneMapping压黑的）
        vec3 inScattering = tramsmittanceLightToTest * scattering * tramsmittanceTestToCam  * stepSize * lightColor * 4;
        testPoint += viewDir * stepSize;
        color += inScattering;
    }
    float cosAngle = dot(viewDir, lightDir);
    if(cosAngle > cos(0.02)) {
        // 视线指向太阳圆盘
        color += Transmittance(param, lightPos + vec3(0,param.PlanetRadius + param.AtmosphereHeight,0), camPosInPlanet) * lightColor;
    }
    return color;
}

透射率预计算

对于T2，因为每次都是固定在一个方向上进行透射率累加，所以一边计算一边缓存即可，不用每次都从头开始计算透射率，主要来看T1的预计算（因为每次计算太阳光到采样点的透射率都是一个全新的方向，不能利用之前的数据）地球是圆的，大气层具有对称性，所以左右晃动不会影响透射率也就是说，对于某一高度的着色点，不同方向上的透射率只和天顶角有关。高度和天顶角两个参数就能确定透射率。（待实现，可参考https://zhuanlan.zhihu.com/p/595576594）

展示

这里还有一点点遮挡关系没有出来，不过不是重点

多重散射

就像渲染方程，除了来自光源的直接光照+散射，场景中其他方向的粒子也会散射，也会对着色点有贡献，所以要积分获得整个球面上所有方向上的贡献之和，同时还有大量预计算这就做到了多重散射。这块的实现暂时放弃，同样可参考https://zhuanlan.zhihu.com/p/595576594

OpenGLRender开发记录（2）：阴影（shadowMap，PCF，PCSS）

Sun, 19 Oct 2025 14:19:37 +0800

已实现功能

除了上次实现IBL之外，项目目前新增了imGUI的渲染，更方便地进行调试可以随意切换IBL贴图、模型控制、灯光控制灯。并且添加了一个PBR材质的地板。下一步就是实现阴影

阴影

shadowMap

这个东西很简单，直接实现了，不讲原理

PCF

取周围一圈的像素求平均，让阴影更软

PCSS

① Blocker Search 阶段（寻找遮挡者）目的：估算遮挡物与被遮挡物之间的距离 → 用于计算 penumbra（阴影模糊程度）

步骤：从当前 fragment 的 light space 坐标，投影到 shadow map 中：projCoords.xy

以该位置为中心，在 shadow map 中进行小范围采样（通常 3x3 或 5x5）：

收集所有比当前 fragment 深度更小的样本（说明它们挡住了光）

累加这些“遮挡者”的深度值

记录 blocker 数量

若存在 blocker：

计算平均 blocker 深度 avgBlockerDepth

② Penumbra Size 计算阶段（决定模糊程度）目的：用当前 fragment 深度与 avgBlockerDepth 的距离估算光源发散导致的阴影模糊程度

③ Filtering 阶段（模糊阴影边缘）目的：根据 penumbra 大小，用可变范围 PCF 模糊阴影边缘

所以PCSS可以叫自适应PCF

实现

shadowMap

初始化一个FBO用于shadowMap的渲染，创建一张纹理存储深度结果

void ShadowPass::init() {
    glGenFramebuffers(1, &shadowFBO);

    // 创建深度纹理
    glGenTextures(1, &shadowMap);
    glBindTexture(GL_TEXTURE_2D, shadowMap);
    glTexImage2D(GL_TEXTURE_2D, 0, GL_DEPTH_COMPONENT,
                 scene.width, scene.height, 0, GL_DEPTH_COMPONENT, GL_FLOAT, NULL);
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_NEAREST);
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_NEAREST);
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_S, GL_REPEAT);
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_T, GL_REPEAT);

    // attach 深度纹理到FBO
    glBindFramebuffer(GL_FRAMEBUFFER, shadowFBO);
    glFramebufferTexture2D(GL_FRAMEBUFFER, GL_DEPTH_ATTACHMENT, GL_TEXTURE_2D, shadowMap, 0);
    glDrawBuffer(GL_NONE);
    glReadBuffer(GL_NONE);
    glBindFramebuffer(GL_FRAMEBUFFER, 0);
    isInit = true;
}

下一步就是在光源视角下渲染，首先得找到摄像机的位置，其实就是MVP矩阵的VP用光源而不是用摄像机，下面是对于平行光的shadowMap渲染

void ShadowPass::render() {
    if (!isInit){
        std::cout << "shadowPass init" << std::endl;
        return;
    }
    glViewport(0, 0, scene.width, scene.height);
    glBindFramebuffer(GL_FRAMEBUFFER, shadowFBO);
    glClear(GL_DEPTH_BUFFER_BIT);

//    glCullFace(GL_FRONT); // 可选，防止 Peter-panning
    shadowShader.bind();

    glm::mat4 lightProjection, lightView;
    float orthoSize = 10.0f;
    float near_plane = 0.1f;
    float far_plane = 100.0f; // 你可以再根据场景大小动态调整
    // 平行光使用正交投影
    lightProjection = glm::ortho(-orthoSize, orthoSize, -orthoSize, orthoSize, near_plane, far_plane);
    // TODO：只实现了平行光，他的position存储的是方向，而不是位置，所以要取反
    lightView = glm::lookAt(-scene.lights[0]->position * 10.0f, glm::vec3(0.0f), glm::vec3(0.0, 1.0, 0.0));
    lightSpaceMatrix = lightProjection * lightView;
    shadowShader.setMat4("lightSpaceMatrix", lightSpaceMatrix);
    // 渲染所有模型（只写深度）
    for (auto& model : scene.models) {
        glm::mat4 modelMatrix = model.getModelMatrix();
        shadowShader.setMat4("model", modelMatrix);
        model.draw(shadowShader);
    }
    shadowShader.unBind();
//    glCullFace(GL_BACK);
    glBindFramebuffer(GL_FRAMEBUFFER, 0);
    glViewport(0, 0, scene.width, scene.height);
}

顶点着色器，物体要乘以lightSpaceMatrix来转到光源视角下

#version 330 core
layout (location = 0) in vec3 aPos;

uniform mat4 model;
uniform mat4 lightSpaceMatrix;

void main() {
    gl_Position = lightSpaceMatrix * model * vec4(aPos, 1.0);
}

片段着色器不需要执行操作

#version 330 core
void main() {
    // 空着就行，只写深度
}

下一步将生成的shadowMap传递到lightPass来参与光照计算，另外需要把lightMatrix也传递过去，用于把模型距离值转移到视角下来进行比较

float ShadowCalculation(vec3 fragPosWorld, vec3 normal) {
    vec4 fragPosLightSpace = lightSpaceMatrix * vec4(fragPosWorld, 1.0);
    vec3 projCoords = fragPosLightSpace.xyz / fragPosLightSpace.w;
    projCoords = projCoords * 0.5 + 0.5; // [-1,1] → [0,1]

    // 从深度贴图采样
    float closestDepth = texture(shadowMap, projCoords.xy).r;
    float currentDepth = projCoords.z;

    // 简单 bias 防止 shadow acne
//    float bias = max(0.005 * (1.0 - dot(normal, normalize(lightPos))), 0.001);

    // 超出边界不产生阴影
    if (projCoords.z > 1.0)
    return 0.0;

    // 进行一次比较
    return (currentDepth) > closestDepth ? 1.0 : 0.0;
}

有了计算阴影的函数后，只需要在计算光照的最后*（1-shadow）

`1`	`vec3 Lo = (kD * albedo / PI + specular) * radiance * NdotL * (1-ShadowCalculation(WorldPos, N));`

结果如下，经典的自阴影现象，主要原因就是shadowMap的分辨率不足，一些不在同一高度的位置被记录了相同高度，在主摄像机渲染时，某个位置在shadowMap存储的高度比自己本来还要高，就会被认为是阴影（但是这种情况下很好分辨光源摄像机的覆盖范围，方便调试🙂）当我把shadowMap的分辨率提高后，自然就消失了，但这肯定不是最优通常的做法是加一个自偏移，也就是说shadowMap存的高度和我用来比较的高度差异不超过bias，就认为没有阴影

float ShadowCalculation(vec3 fragPosWorld, vec3 normal) {
    vec4 fragPosLightSpace = lightSpaceMatrix * vec4(fragPosWorld, 1.0);
    vec3 projCoords = fragPosLightSpace.xyz / fragPosLightSpace.w;
    projCoords = projCoords * 0.5 + 0.5; // [-1,1] → [0,1]

    // 从深度贴图采样
    float closestDepth = texture(shadowMap, projCoords.xy).r;
    float currentDepth = projCoords.z;

    // 简单 bias 防止 shadow acne
    float bias = max(0.005 * (1.0 - dot(normal, normalize(lightPos))), 0.001);

    // 超出边界不产生阴影
    if (projCoords.z > 1.0)
    return 0.0;

    // 进行一次比较
    return (currentDepth - bias) > closestDepth ? 1.0 : 0.0;
}

PCF

阴影问题解决了，下面就是提升效果，当前的阴影是硬阴影，锯齿很严重 PCF思路就是取周围像素的shadow来取平均，柔化阴影边界

        // --- PCF ---
        float shadow = 0.0;
        ivec2 texSize = textureSize(shadowMap, 0);
        vec2 texelSize = 1.0 /vec2(texSize);
        int range = 10;  // 5x5
        int samples = 0;

        for (int x = -range; x <= range; ++x) {
            for (int y = -range; y <= range; ++y) {
                float pcfDepth = texture(shadowMap, projCoords.xy + vec2(x, y) * texelSize).r;
                shadow += (currentDepth - bias > pcfDepth) ? 1.0 : 0.0;
                samples++;
            }
        }
        shadow /= float(samples);
        return shadow;

PCSS

三步走，一些参数我已经提取出去当uniform，可以控制第一步的搜索半径、第二步的半影大小、以及控制一下最大的滤波核大小

        float avgBlockerDepth = 0.0;
        int blockers = 0;

        ivec2 texSize = textureSize(shadowMap, 0);
        vec2 texelSize = 1.0 / vec2(texSize);

        int searchRadius = int(PCSSBlockerSearchRadius);
        for (int x = -searchRadius; x <= searchRadius; ++x) {
            for (int y = -searchRadius; y <= searchRadius; ++y) {
                float sampleDepth = texture(shadowMap, projCoords.xy + vec2(x, y) * texelSize).r;
                if (sampleDepth < currentDepth - bias) {
                    avgBlockerDepth += sampleDepth;
                    blockers++;
                }
            }
        }
        if (blockers == 0) return 0.0;
        avgBlockerDepth /= blockers;
        float penumbra = (currentDepth - avgBlockerDepth) * PCSSScale;
        int kernel = int(clamp(penumbra * float(texSize.x), 1.0, PCSSKernelMax));
        float shadow = 0.0;
        for (int x = -kernel; x <= kernel; ++x) {
            for (int y = -kernel; y <= kernel; ++y) {
                float sampleDepth = texture(shadowMap, projCoords.xy + vec2(x, y) * texelSize).r;
                shadow += (currentDepth - bias > sampleDepth) ? 1.0 : 0.0;
            }
        }
        shadow /= float((2 * kernel + 1) * (2 * kernel + 1));
        return shadow;

阴影

三种阴影可以写在一起

float ShadowCalculation(vec3 fragPosWorld, vec3 normal) {
    vec4 fragPosLightSpace = lightSpaceMatrix * vec4(fragPosWorld, 1.0);
    vec3 projCoords = fragPosLightSpace.xyz / fragPosLightSpace.w;
    projCoords = projCoords * 0.5 + 0.5;

    if (projCoords.z > 1.0) return 0.0;

    float closestDepth = texture(shadowMap, projCoords.xy).r;
    float currentDepth = projCoords.z;
    float bias = max(0.005 * (1.0 - dot(normal, normalize(lightPos))), 0.001);

    // shadow type switching
    if (shadowType == 0) {
        return 0.0; // no shadow
    }
    else if (shadowType == 1) {
        return (currentDepth - bias > closestDepth) ? 1.0 : 0.0; // hard shadow
    }
    else if (shadowType == 2) {
        // --- PCF ---
        float shadow = 0.0;
        ivec2 texSize = textureSize(shadowMap, 0);
        vec2 texelSize = 1.0 /vec2(texSize);
        int range = pcfScope;
        int samples = 0;

        for (int x = -range; x <= range; ++x) {
            for (int y = -range; y <= range; ++y) {
                float pcfDepth = texture(shadowMap, projCoords.xy + vec2(x, y) * texelSize).r;
                shadow += (currentDepth - bias > pcfDepth) ? 1.0 : 0.0;
                samples++;
            }
        }
        shadow /= float(samples);
        return shadow;
    }
    else if (shadowType == 3) {
        float avgBlockerDepth = 0.0;
        int blockers = 0;

        ivec2 texSize = textureSize(shadowMap, 0);
        vec2 texelSize = 1.0 / vec2(texSize);

        int searchRadius = int(PCSSBlockerSearchRadius);
        for (int x = -searchRadius; x <= searchRadius; ++x) {
            for (int y = -searchRadius; y <= searchRadius; ++y) {
                float sampleDepth = texture(shadowMap, projCoords.xy + vec2(x, y) * texelSize).r;
                if (sampleDepth < currentDepth - bias) {
                    avgBlockerDepth += sampleDepth;
                    blockers++;
                }
            }
        }
        if (blockers == 0) return 0.0;
        avgBlockerDepth /= blockers;
        float penumbra = (currentDepth - avgBlockerDepth) * PCSSScale;
        int kernel = int(clamp(penumbra * float(texSize.x), 1.0, PCSSKernelMax));
        float shadow = 0.0;
        for (int x = -kernel; x <= kernel; ++x) {
            for (int y = -kernel; y <= kernel; ++y) {
                float sampleDepth = texture(shadowMap, projCoords.xy + vec2(x, y) * texelSize).r;
                shadow += (currentDepth - bias > sampleDepth) ? 1.0 : 0.0;
            }
        }
        shadow /= float((2 * kernel + 1) * (2 * kernel + 1));
        return shadow;
    }

    return 0.0;
}

OpenGLRender开发记录（1）：基于图像的光照（IBL）

Sun, 19 Oct 2025 14:13:50 +0800

已实现功能

前边基础架构部分就不专门写了。这里展示一下已有的功能

延迟渲染管线
G-Buffer的可视化调试
PBR材质直接光照渲染下面开始研究IBL在OpenGL中的实现

理论准备

基于图像的光照(Image based lighting, IBL)将周围环境整体视为一个大光源。IBL 通常使用立方体贴图的每个像素视为光源

在IBL中，不只有直接光照对着色点有贡献，而是四面八方的环境光都有贡献。之前总觉得为什么渲染方程中有积分，为什么在shader中没见积分运算，原来是它只是一个理想状态，要计算所有方向的光照是很困难的，给定任何方向向量 wi，我们需要一些方法来获取这个方向上场景的辐射度，并且需要实时计算积分。可以使用蒙特卡洛采样来近似积分值，但IBL并不是这样。说实话听YLQ讲，越听越是迷糊。

下面看看IBL是如何避免积分运算的

避免积分运算

首先渲染方程的形式如下，已经被分成了漫反射和镜面反射两部分进一步把+号拆开，可以拆成两个积分

漫反射部分

首先来看漫反射部分，这里用的BRDF是Lambertian模型，它是一个常数，所以可以直接提出去，分子代表颜色另外kd的计算，基本原理就是先算出漫反射的比例，再进一步去除金属度的影响（金属没有漫反射），为什么这样设计，我查AI应该是迪士尼的论文提出的。 kd与光线方向有关系（因为F的计算需要wi），所以不能移出积分，做一个近似操作，本来F需要wi和半程向量来计算，改为用摄像机观察方向w0和法线方向来近似，这样就可以挪出去了其中（F0表示垂直入射时的反射率）

最终

积分内部就只有光源和cos了。到现在对于不同的法线方向n，就可以预计算一个积分值。也就是说这张贴图存储的是不同法线方向上的积分值这样分析半天，其实从理论上想，也应该这样，我不管从什么方向上看（即不同的w0，irrandance是方向无关的）当我观察一个点时，环境贴图对他的贡献都是它法线为中心形成的半球上的光对他的贡献之和（因为是漫反射）

因此我们可以预计算这个积分值，得到一个 cubemap，称为 irradiance map。积分方法就是蒙特卡洛积分，我们可以简单的在半球面上均匀采样。下面给出learnOpenGL的采样方案首先改为球面坐标系用黎曼积分来近似

注意实际场景中 = 多个局部环境（多个“局部场景”）在全局场景下：每个区域（Probe volume）都有自己的局部环境 map；然后通过探针插值（或者 voxel GI）做出空间连续的光照过渡。比如室内室外的map肯定得不一样才对，即使法线方向一致。这就是为什么要用探针

镜面反射部分

这部分比较夸张，与w0、法线方向、以及BRDF中各种参数有关，即使一个方向向量用球面坐标系，也有9个因素。所以不能直接预计算。首先基本思路是蒙特卡罗积分，但是当前采样方法实时太慢 Epic提出了很好的解决方案：分割求和近似法（split sum approximation）

首先思路是把积分中的光照项提出来如果想求解提出来的这一项Lc(wo)是什么，就需要进行蒙特卡洛积分运算，运算通过法线分布函数进行采样化简，化简过程如下（本质是把法线分布函数的PDF求出来带进去，进行分子分母化简，得到最终结果）进一步近似，F对结果影响不大，直接去掉了

再近似，把w0和法线方向都近似成R(反射方向)，这样预计算就与观察无关了（把摄像机方向、法线方向全部换成反射方向R来计算），这样处理会让掠射角处理出问题

总结来说就是利用了各种近似手段把这个积分拆成了两部分，第一部分放在坐标，剩余放在右边，通过各种化简近似出第一部分是什么，然后放回原式第一部分的预计算其实就是在以反射方向为中心，整个半球的光照进行积分的预计算，但是需要通过粗糙度来进行mipmap，因为各种近似的前提是法线分布函数，他是由粗糙度参与控制的，越粗糙的表面，越要用level更高的mipmap

第一部分通过在法线分布函数上进行采样蒙特卡洛积分进行预计算下面看第二部分，他的参数包括w0,n,F0(通过金属度和albedo决定)和粗糙度。 F0是常数，看看怎么挪出去又是一个拆分，把积分拆成两项（这里就是拆加法，没有近似），然后把F0挪出去，得到关于scale和bias两项的计算这两项用法线分布函数进行蒙特卡洛积分，可以抵消很多项。拆掉F0后，积分结果只和cos和粗糙度了，用一个2D纹理的两个通道存储结果即可。这个预计算部分叫做LUT，这个 LUT 是由 BRDF 决定的，所以确定的 BRDF 就有确定的 LUT。

OpenGL实现

HDR与cubemap

在 PBR 渲染管线中考虑高动态范围(High Dynamic Range, HDR)的场景光照非常重要。由于 PBR 的大部分输入基于实际物理属性和测量，因此为入射光值找到其物理等效值是很重要的 第一步：加载HDR图片，存储为纹理

#include "stb_image.h"
stbi_set_flip_vertically_on_load(true);
int width, height, nrComponents;
float *data = stbi_loadf("newport_loft.hdr", &width, &height, &nrComponents, 0);
unsigned int hdrTexture;
if (data)
{
    glGenTextures(1, &hdrTexture);
    glBindTexture(GL_TEXTURE_2D, hdrTexture);
    // 这里必须用32F，有些HDR图片太亮了
    glTexImage2D(GL_TEXTURE_2D, 0, GL_RGB32F, width, height, 0, GL_RGB, GL_FLOAT, data); 
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_S, GL_CLAMP_TO_EDGE);
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_T, GL_CLAMP_TO_EDGE);
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_LINEAR);
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_LINEAR);
    stbi_image_free(data);
}
else
{
    std::cout << "Failed to load HDR image." << std::endl;
}

第二步：从纹理到立方体贴图 顶点着色器传递世界坐标

#version 330 core
layout (location = 0) in vec3 aPos;

out vec3 localPos;

uniform mat4 projection;
uniform mat4 view;

void main()
{
    localPos = aPos;  
    gl_Position =  projection * view * vec4(localPos, 1.0);
}

片段着色器，在HDR图上进行采样

#version 330 core
out vec4 FragColor;
in vec3 localPos;

uniform sampler2D equirectangularMap;

const vec2 invAtan = vec2(0.1591, 0.3183);
vec2 SampleSphericalMap(vec3 v)
{
    vec2 uv = vec2(atan(v.z, v.x), asin(v.y));
    uv *= invAtan;
    uv += 0.5;
    return uv;
}

void main()
{       
    vec2 uv = SampleSphericalMap(normalize(localPos)); // make sure to normalize localPos
    vec3 color = texture(equirectangularMap, uv).rgb;

    FragColor = vec4(color, 1.0);
}

要将等距柱状投影图转换为立方体贴图，我们需要渲染一个（单位）立方体，并从内部将等距柱状图投影到立方体的每个面，先创建一张立方体贴图

unsigned int envCubemap;
glGenTextures(1, &envCubemap);
glBindTexture(GL_TEXTURE_CUBE_MAP, envCubemap);
for (unsigned int i = 0; i < 6; ++i)
{
    // note that we store each face with 16 bit floating point values
    glTexImage2D(GL_TEXTURE_CUBE_MAP_POSITIVE_X + i, 0, GL_RGB16F, 
                 512, 512, 0, GL_RGB, GL_FLOAT, nullptr);
}
glTexParameteri(GL_TEXTURE_CUBE_MAP, GL_TEXTURE_WRAP_S, GL_CLAMP_TO_EDGE);
glTexParameteri(GL_TEXTURE_CUBE_MAP, GL_TEXTURE_WRAP_T, GL_CLAMP_TO_EDGE);
glTexParameteri(GL_TEXTURE_CUBE_MAP, GL_TEXTURE_WRAP_R, GL_CLAMP_TO_EDGE);
glTexParameteri(GL_TEXTURE_CUBE_MAP, GL_TEXTURE_MIN_FILTER, GL_LINEAR);
glTexParameteri(GL_TEXTURE_CUBE_MAP, GL_TEXTURE_MAG_FILTER, GL_LINEAR);

对同一个立方体渲染六次，每次面对立方体的一个面，并用帧缓冲对象记录其结果

unsigned int captureFBO, captureRBO;
glGenFramebuffers(1, &captureFBO);
glGenRenderbuffers(1, &captureRBO);

glBindFramebuffer(GL_FRAMEBUFFER, captureFBO);
glBindRenderbuffer(GL_RENDERBUFFER, captureRBO);
glRenderbufferStorage(GL_RENDERBUFFER, GL_DEPTH_COMPONENT24, 512, 512);
glFramebufferRenderbuffer(GL_FRAMEBUFFER, GL_DEPTH_ATTACHMENT, GL_RENDERBUFFER, captureRBO);

下面正式进入转换

// 让摄像机对准6个轴方向
glm::mat4 captureProjection = glm::perspective(glm::radians(90.0f), 1.0f, 0.1f, 10.0f);
glm::mat4 captureViews[] = 
{
   glm::lookAt(glm::vec3(0.0f, 0.0f, 0.0f), glm::vec3( 1.0f,  0.0f,  0.0f), glm::vec3(0.0f, -1.0f,  0.0f)),
   glm::lookAt(glm::vec3(0.0f, 0.0f, 0.0f), glm::vec3(-1.0f,  0.0f,  0.0f), glm::vec3(0.0f, -1.0f,  0.0f)),
   glm::lookAt(glm::vec3(0.0f, 0.0f, 0.0f), glm::vec3( 0.0f,  1.0f,  0.0f), glm::vec3(0.0f,  0.0f,  1.0f)),
   glm::lookAt(glm::vec3(0.0f, 0.0f, 0.0f), glm::vec3( 0.0f, -1.0f,  0.0f), glm::vec3(0.0f,  0.0f, -1.0f)),
   glm::lookAt(glm::vec3(0.0f, 0.0f, 0.0f), glm::vec3( 0.0f,  0.0f,  1.0f), glm::vec3(0.0f, -1.0f,  0.0f)),
   glm::lookAt(glm::vec3(0.0f, 0.0f, 0.0f), glm::vec3( 0.0f,  0.0f, -1.0f), glm::vec3(0.0f, -1.0f,  0.0f))
};

// convert HDR equirectangular environment map to cubemap equivalent
equirectangularToCubemapShader.use();
equirectangularToCubemapShader.setInt("equirectangularMap", 0);
equirectangularToCubemapShader.setMat4("projection", captureProjection);
glActiveTexture(GL_TEXTURE0);
glBindTexture(GL_TEXTURE_2D, hdrTexture);

glViewport(0, 0, 512, 512); // don't forget to configure the viewport to the capture dimensions.
glBindFramebuffer(GL_FRAMEBUFFER, captureFBO);
for (unsigned int i = 0; i < 6; ++i)
{
    equirectangularToCubemapShader.setMat4("view", captureViews[i]);
    // 把这 6 次渲染结果写入到立方体贴图的六个面上
    glFramebufferTexture2D(GL_FRAMEBUFFER, GL_COLOR_ATTACHMENT0, 
                           GL_TEXTURE_CUBE_MAP_POSITIVE_X + i, envCubemap, 0);
    glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);

    renderCube(); // renders a 1x1 cube
}
glBindFramebuffer(GL_FRAMEBUFFER, 0);

还可以用这个立方体贴图来渲染天空盒 shader部分

#version 330 core
layout (location = 0) in vec3 aPos;

uniform mat4 projection;
uniform mat4 view;

out vec3 localPos;

void main()
{
    localPos = aPos;

    mat4 rotView = mat4(mat3(view)); // remove translation from the view matrix
    vec4 clipPos = projection * rotView * vec4(localPos, 1.0);

    gl_Position = clipPos.xyww;
}

#version 330 core
out vec4 FragColor;

in vec3 localPos;

uniform samplerCube environmentMap;

void main()
{
    vec3 envColor = texture(environmentMap, localPos).rgb;

    envColor = envColor / (envColor + vec3(1.0));
    envColor = pow(envColor, vec3(1.0/2.2)); 

    FragColor = vec4(envColor, 1.0);
}

代码部分

        // 天空盒
        glDepthFunc(GL_LEQUAL);
        skyboxShader.use();
        skyboxShader.setMat4("projection", scene.camera->getProjectionMatrix());
        skyboxShader.setMat4("view", scene.camera->getViewMatrix());
        glActiveTexture(GL_TEXTURE0);
        glBindTexture(GL_TEXTURE_CUBE_MAP, envCubemap);
        scene.renderCube();
        glDepthFunc(GL_LESS);

到这里就得到了立方体贴图和天空盒渲染

irradance Map

预计算对于每个方向来说对半球进行积分的结果，当计算好后，每次需要漫反射，就可以通过法线方向得到漫反射值

`1`	`vec3 irradiance = texture(irradianceMap, N);`

这一步的做法与生成cubemap的做法一致，只是片段着色器不一致。由于辐照度图对所有周围的辐射值取了平均值，因此它丢失了大部分高频细节，所以我们可以以较低的分辨率（32x32）存储，我可以把它渲染成天空盒来看看，基本没有场景信息了，所以不需要高分辨率

GLuint preComputer::computeIrradianceMap(GLuint envCubemap)
{
    Shader irradianceMapShader = Shader("shader/irradianceMap.vert","shader/irradianceMap.frag");
    const glm::mat4 captureProjection = glm::perspective(glm::radians(90.0f), 1.0f, 0.1f, 10.0f);
    const glm::mat4 captureViews[] =
    {
        glm::lookAt(glm::vec3(0.0f, 0.0f, 0.0f), glm::vec3(1.0f,  0.0f,  0.0f), glm::vec3(0.0f, -1.0f,  0.0f)),
        glm::lookAt(glm::vec3(0.0f, 0.0f, 0.0f), glm::vec3(-1.0f,  0.0f,  0.0f), glm::vec3(0.0f, -1.0f,  0.0f)),
        glm::lookAt(glm::vec3(0.0f, 0.0f, 0.0f), glm::vec3(0.0f,  1.0f,  0.0f), glm::vec3(0.0f,  0.0f,  1.0f)),
        glm::lookAt(glm::vec3(0.0f, 0.0f, 0.0f), glm::vec3(0.0f, -1.0f,  0.0f), glm::vec3(0.0f,  0.0f, -1.0f)),
        glm::lookAt(glm::vec3(0.0f, 0.0f, 0.0f), glm::vec3(0.0f,  0.0f,  1.0f), glm::vec3(0.0f, -1.0f,  0.0f)),
        glm::lookAt(glm::vec3(0.0f, 0.0f, 0.0f), glm::vec3(0.0f,  0.0f, -1.0f), glm::vec3(0.0f, -1.0f,  0.0f))
    };
    GLuint FrameBuffer;
    GLuint RenderBuffer;
    glGenFramebuffers(1, &FrameBuffer);
    glGenRenderbuffers(1, &RenderBuffer);
    unsigned int irradianceMap;
    glGenTextures(1, &irradianceMap);
    glBindTexture(GL_TEXTURE_CUBE_MAP, irradianceMap);
    for (unsigned int i = 0; i < 6; ++i)
    {
        glTexImage2D(GL_TEXTURE_CUBE_MAP_POSITIVE_X + i, 0, GL_RGB16F, 32, 32, 0,
                     GL_RGB, GL_FLOAT, nullptr);
    }
    glTexParameteri(GL_TEXTURE_CUBE_MAP, GL_TEXTURE_WRAP_S, GL_CLAMP_TO_EDGE);
    glTexParameteri(GL_TEXTURE_CUBE_MAP, GL_TEXTURE_WRAP_T, GL_CLAMP_TO_EDGE);
    glTexParameteri(GL_TEXTURE_CUBE_MAP, GL_TEXTURE_WRAP_R, GL_CLAMP_TO_EDGE);
    glTexParameteri(GL_TEXTURE_CUBE_MAP, GL_TEXTURE_MIN_FILTER, GL_LINEAR);
    glTexParameteri(GL_TEXTURE_CUBE_MAP, GL_TEXTURE_MAG_FILTER, GL_LINEAR);

    glBindFramebuffer(GL_FRAMEBUFFER, FrameBuffer);
    glBindRenderbuffer(GL_RENDERBUFFER, RenderBuffer);
    glRenderbufferStorage(GL_RENDERBUFFER, GL_DEPTH_COMPONENT24, 32, 32);
    irradianceMapShader.use();
    irradianceMapShader.setInt("environmentMap", 0);
    irradianceMapShader.setMat4("projection", captureProjection);
    glActiveTexture(GL_TEXTURE0);
    glBindTexture(GL_TEXTURE_CUBE_MAP, envCubemap);

    glViewport(0, 0, 32, 32); // don't forget to configure the viewport to the capture dimensions.
    glBindFramebuffer(GL_FRAMEBUFFER, FrameBuffer);
    for (unsigned int i = 0; i < 6; ++i)
    {
        irradianceMapShader.setMat4("view", captureViews[i]);
        glFramebufferTexture2D(GL_FRAMEBUFFER, GL_COLOR_ATTACHMENT0,
                               GL_TEXTURE_CUBE_MAP_POSITIVE_X + i, irradianceMap, 0);
        glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);

        scene.renderCube();
    }
    glBindFramebuffer(GL_FRAMEBUFFER, 0);
}

具体的shader

#version 330 core
layout (location = 0) in vec3 aPos;

out vec3 WorldPos;

uniform mat4 projection;
uniform mat4 view;

void main()
{
    WorldPos = aPos;
    gl_Position =  projection * view * vec4(WorldPos, 1.0);
}

#version 330 core
out vec4 FragColor;
in vec3 WorldPos;

uniform samplerCube environmentMap;

const float PI = 3.14159265359;

void main()
{
    vec3 N = normalize(WorldPos);

    vec3 irradiance = vec3(0.0);

    // tangent space calculation from origin point
    vec3 up    = vec3(0.0, 1.0, 0.0);
    vec3 right = normalize(cross(up, N));
    up         = normalize(cross(N, right));

    float sampleDelta = 0.025;
    float nrSamples = 0.0;
    for(float phi = 0.0; phi < 2.0 * PI; phi += sampleDelta)
    {
        for(float theta = 0.0; theta < 0.5 * PI; theta += sampleDelta)
        {
            // spherical to cartesian (in tangent space)
            vec3 tangentSample = vec3(sin(theta) * cos(phi),  sin(theta) * sin(phi), cos(theta));
            // tangent space to world
            vec3 sampleVec = tangentSample.x * right + tangentSample.y * up + tangentSample.z * N;

            irradiance += texture(environmentMap, sampleVec).rgb * cos(theta) * sin(theta);
            nrSamples++;
        }
    }
    irradiance = PI * irradiance * (1.0 / float(nrSamples));

    FragColor = vec4(irradiance, 1.0);
}

prefilterMap

先创建一张cubemap

unsigned int prefilterMap;
glGenTextures(1, &prefilterMap);
glBindTexture(GL_TEXTURE_CUBE_MAP, prefilterMap);
for (unsigned int i = 0; i < 6; ++i)
{
    glTexImage2D(GL_TEXTURE_CUBE_MAP_POSITIVE_X + i, 0, GL_RGB16F, 128, 128, 0, GL_RGB, GL_FLOAT, nullptr);
}
glTexParameteri(GL_TEXTURE_CUBE_MAP, GL_TEXTURE_WRAP_S, GL_CLAMP_TO_EDGE);
glTexParameteri(GL_TEXTURE_CUBE_MAP, GL_TEXTURE_WRAP_T, GL_CLAMP_TO_EDGE);
glTexParameteri(GL_TEXTURE_CUBE_MAP, GL_TEXTURE_WRAP_R, GL_CLAMP_TO_EDGE);
glTexParameteri(GL_TEXTURE_CUBE_MAP, GL_TEXTURE_MIN_FILTER, GL_LINEAR_MIPMAP_LINEAR); 
glTexParameteri(GL_TEXTURE_CUBE_MAP, GL_TEXTURE_MAG_FILTER, GL_LINEAR);

glGenerateMipmap(GL_TEXTURE_CUBE_MAP);

需要的shader，渲染了5层的mipmap，使用法线分布函数进行重要性采样，预计算每个方向上的积分值

#version 330 core
out vec4 FragColor;
in vec3 WorldPos;

uniform samplerCube environmentMap;
// 当前贴图的粗糙度
uniform float roughness;

const float PI = 3.14159265359;
// ----------------------------------------------------------------------------
float DistributionGGX(vec3 N, vec3 H, float roughness)
{
    float a = roughness*roughness;
    float a2 = a*a;
    float NdotH = max(dot(N, H), 0.0);
    float NdotH2 = NdotH*NdotH;

    float nom   = a2;
    float denom = (NdotH2 * (a2 - 1.0) + 1.0);
    denom = PI * denom * denom;

    return nom / denom;
}
// ----------------------------------------------------------------------------
// http://holger.dammertz.org/stuff/notes_HammersleyOnHemisphere.html
// efficient VanDerCorpus calculation.

float RadicalInverse_VdC(uint bits)
{
    bits = (bits << 16u) | (bits >> 16u);
    bits = ((bits & 0x55555555u) << 1u) | ((bits & 0xAAAAAAAAu) >> 1u);
    bits = ((bits & 0x33333333u) << 2u) | ((bits & 0xCCCCCCCCu) >> 2u);
    bits = ((bits & 0x0F0F0F0Fu) << 4u) | ((bits & 0xF0F0F0F0u) >> 4u);
    bits = ((bits & 0x00FF00FFu) << 8u) | ((bits & 0xFF00FF00u) >> 8u);
    return float(bits) * 2.3283064365386963e-10; // / 0x100000000
}
// 低差异序列
vec2 Hammersley(uint i, uint N)
{
    return vec2(float(i)/float(N), RadicalInverse_VdC(i));
}
// ----------------------------------------------------------------------------
// GGX法线分布函数下的重要性采样
vec3 ImportanceSampleGGX(vec2 Xi, vec3 N, float roughness)
{
    float a = roughness*roughness;

    float phi = 2.0 * PI * Xi.x;
    float cosTheta = sqrt((1.0 - Xi.y) / (1.0 + (a*a - 1.0) * Xi.y));
    float sinTheta = sqrt(1.0 - cosTheta*cosTheta);

    // from spherical coordinates to cartesian coordinates - halfway vector
    vec3 H;
    H.x = cos(phi) * sinTheta;
    H.y = sin(phi) * sinTheta;
    H.z = cosTheta;

    // from tangent-space H vector to world-space sample vector
    vec3 up          = abs(N.z) < 0.999 ? vec3(0.0, 0.0, 1.0) : vec3(1.0, 0.0, 0.0);
    vec3 tangent   = normalize(cross(up, N));
    vec3 bitangent = cross(N, tangent);

    vec3 sampleVec = tangent * H.x + bitangent * H.y + N * H.z;
    return normalize(sampleVec);
}
// ----------------------------------------------------------------------------
void main()
{
    vec3 N = normalize(WorldPos);  // 以像素位置为法线方向（其实是在做 cube map 采样方向）

    vec3 R = N; // 反射向量设为法线
    vec3 V = R; // 视线向量也设为法线（这是预计算贴图，所以默认观察方向和反射方向一致）

    const uint SAMPLE_COUNT = 1024u; // importance sample 的数量
    vec3 prefilteredColor = vec3(0.0);
    float totalWeight = 0.0;

    for(uint i = 0u; i < SAMPLE_COUNT; ++i)
    {
        vec2 Xi = Hammersley(i, SAMPLE_COUNT);           // 第 i 个低差异采样点
        vec3 H = ImportanceSampleGGX(Xi, N, roughness);  // 半程向量 H
        vec3 L  = normalize(2.0 * dot(V, H) * H - V);     // 入射光方向 L = reflect(-V, H)

        float NdotL = max(dot(N, L), 0.0);
        if(NdotL > 0.0)
        {
            // 计算重要性采样的 pdf
            float D = DistributionGGX(N, H, roughness);
            float NdotH = max(dot(N, H), 0.0);
            float HdotV = max(dot(H, V), 0.0);
            float pdf = D * NdotH / (4.0 * HdotV) + 0.0001;

            // 环境贴图的信息
            float resolution = 512.0; // 原始 cube map 每个面宽度
            float saTexel  = 4.0 * PI / (6.0 * resolution * resolution); // 每个 texel 的立体角大小
            float saSample = 1.0 / (float(SAMPLE_COUNT) * pdf + 0.0001); // 当前 sample 对应的立体角

            // 根据 sample 的“模糊度”选择 mipmap 层级
            float mipLevel = roughness == 0.0 ? 0.0 : 0.5 * log2(saSample / saTexel);

            // 对 cube map 进行 LOD 采样（选定 mip level）
            prefilteredColor += textureLod(environmentMap, L, mipLevel).rgb * NdotL;
            totalWeight += NdotL;
        }
    }

    prefilteredColor = prefilteredColor / totalWeight; // 归一化亮度

    FragColor = vec4(prefilteredColor, 1.0); // 输出颜色
}

渲染代码

GLuint preComputer::computePrefilterMap(GLuint envCubemap)
{
    const glm::mat4 captureProjection = glm::perspective(glm::radians(90.0f), 1.0f, 0.1f, 10.0f);
    const glm::mat4 captureViews[] =
    {
        glm::lookAt(glm::vec3(0.0f, 0.0f, 0.0f), glm::vec3(1.0f,  0.0f,  0.0f), glm::vec3(0.0f, -1.0f,  0.0f)),
        glm::lookAt(glm::vec3(0.0f, 0.0f, 0.0f), glm::vec3(-1.0f,  0.0f,  0.0f), glm::vec3(0.0f, -1.0f,  0.0f)),
        glm::lookAt(glm::vec3(0.0f, 0.0f, 0.0f), glm::vec3(0.0f,  1.0f,  0.0f), glm::vec3(0.0f,  0.0f,  1.0f)),
        glm::lookAt(glm::vec3(0.0f, 0.0f, 0.0f), glm::vec3(0.0f, -1.0f,  0.0f), glm::vec3(0.0f,  0.0f, -1.0f)),
        glm::lookAt(glm::vec3(0.0f, 0.0f, 0.0f), glm::vec3(0.0f,  0.0f,  1.0f), glm::vec3(0.0f, -1.0f,  0.0f)),
        glm::lookAt(glm::vec3(0.0f, 0.0f, 0.0f), glm::vec3(0.0f,  0.0f, -1.0f), glm::vec3(0.0f, -1.0f,  0.0f))
    };
    glEnable(GL_TEXTURE_CUBE_MAP_SEAMLESS);
    Shader prefilterShader = Shader("shader/prefiltermap.vert","shader/prefiltermap.frag");

    GLuint FrameBuffer;
    GLuint RenderBuffer;
    glGenFramebuffers(1, &FrameBuffer);
    glGenRenderbuffers(1, &RenderBuffer);
    unsigned int prefilterMap;
    glGenTextures(1, &prefilterMap);
    glBindTexture(GL_TEXTURE_CUBE_MAP, prefilterMap);
    for (unsigned int i = 0; i < 6; ++i)
    {
        glTexImage2D(GL_TEXTURE_CUBE_MAP_POSITIVE_X + i, 0, GL_RGB16F, 128, 128, 0, GL_RGB, GL_FLOAT, nullptr);
    }
    glTexParameteri(GL_TEXTURE_CUBE_MAP, GL_TEXTURE_WRAP_S, GL_CLAMP_TO_EDGE);
    glTexParameteri(GL_TEXTURE_CUBE_MAP, GL_TEXTURE_WRAP_T, GL_CLAMP_TO_EDGE);
    glTexParameteri(GL_TEXTURE_CUBE_MAP, GL_TEXTURE_WRAP_R, GL_CLAMP_TO_EDGE);
    glTexParameteri(GL_TEXTURE_CUBE_MAP, GL_TEXTURE_MIN_FILTER, GL_LINEAR_MIPMAP_LINEAR);
    glTexParameteri(GL_TEXTURE_CUBE_MAP, GL_TEXTURE_MAG_FILTER, GL_LINEAR);

    glGenerateMipmap(GL_TEXTURE_CUBE_MAP);

    prefilterShader.use();
    prefilterShader.setInt("environmentMap", 0);
    prefilterShader.setMat4("projection", captureProjection);
    glActiveTexture(GL_TEXTURE0);
    glBindTexture(GL_TEXTURE_CUBE_MAP, envCubemap);

    glBindFramebuffer(GL_FRAMEBUFFER, FrameBuffer);

    unsigned int maxMipLevels = 5;
    // 单独生成5张map，对应不同的粗糙度，来组成mipmap
    for (unsigned int mip = 0; mip < maxMipLevels; ++mip)
    {
        // reisze framebuffer according to mip-level size.
        unsigned int mipWidth  = 128 * std::pow(0.5, mip);
        unsigned int mipHeight = 128 * std::pow(0.5, mip);
        glBindRenderbuffer(GL_RENDERBUFFER, RenderBuffer);
        glRenderbufferStorage(GL_RENDERBUFFER, GL_DEPTH_COMPONENT24, mipWidth, mipHeight);
        glViewport(0, 0, mipWidth, mipHeight);

        float roughness = (float)mip / (float)(maxMipLevels - 1);
        prefilterShader.setFloat("roughness", roughness);
        for (unsigned int i = 0; i < 6; ++i)
        {
            prefilterShader.setMat4("view", captureViews[i]);
            glFramebufferTexture2D(GL_FRAMEBUFFER, GL_COLOR_ATTACHMENT0,
                                   GL_TEXTURE_CUBE_MAP_POSITIVE_X + i, prefilterMap, mip);

            glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
            scene.renderCube();
        }
    }
    glBindFramebuffer(GL_FRAMEBUFFER, 0);
    return prefilterMap;
}

用prefilterMap渲染天空盒的结果

LUT

现在渲染方程就剩最后一部分积分的预计算了通过一系列变换变成了这个式子只和观察方向与法线的夹角以及粗糙都有关，所以用一张2D贴图存储，采样计算积分仍然使用GGX重要性采样

vec2 IntegrateBRDF(float NdotV, float roughness)
{
    vec3 V;
    V.x = sqrt(1.0 - NdotV*NdotV);
    V.y = 0.0;
    V.z = NdotV;

    float A = 0.0;
    float B = 0.0;

    vec3 N = vec3(0.0, 0.0, 1.0);

    const uint SAMPLE_COUNT = 1024u;
    for(uint i = 0u; i < SAMPLE_COUNT; ++i)
    {
        vec2 Xi = Hammersley(i, SAMPLE_COUNT);
        vec3 H  = ImportanceSampleGGX(Xi, N, roughness);
        vec3 L  = normalize(2.0 * dot(V, H) * H - V);

        float NdotL = max(L.z, 0.0);
        float NdotH = max(H.z, 0.0);
        float VdotH = max(dot(V, H), 0.0);

        if(NdotL > 0.0)
        {
            float G = GeometrySmith(N, V, L, roughness);
            float G_Vis = (G * VdotH) / (NdotH * NdotV);
            float Fc = pow(1.0 - VdotH, 5.0);

            A += (1.0 - Fc) * G_Vis;
            B += Fc * G_Vis;
        }
    }
    A /= float(SAMPLE_COUNT);
    B /= float(SAMPLE_COUNT);
    return vec2(A, B);
}
// ----------------------------------------------------------------------------
void main() 
{
    vec2 integratedBRDF = IntegrateBRDF(TexCoords.x, TexCoords.y);
    FragColor = integratedBRDF;
}

GLuint preComputer::computeLutMap(GLuint envCubemap)
{
    Shader lutShader = Shader("shader/lut.vert","shader/lut.frag");

    GLuint brdfLUTTexture;
    glGenTextures(1, &brdfLUTTexture);
    GLuint FrameBuffer;
    GLuint RenderBuffer;
    glGenFramebuffers(1, &FrameBuffer);
    glGenRenderbuffers(1, &RenderBuffer);
    // pre-allocate enough memory for the LUT texture.
    glBindTexture(GL_TEXTURE_2D, brdfLUTTexture);
    glTexImage2D(GL_TEXTURE_2D, 0, GL_RG16F, 512, 512, 0, GL_RG, GL_FLOAT, 0);
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_S, GL_CLAMP_TO_EDGE);
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_T, GL_CLAMP_TO_EDGE);
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_LINEAR);
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_LINEAR);
    glBindFramebuffer(GL_FRAMEBUFFER, FrameBuffer);
    glBindRenderbuffer(GL_RENDERBUFFER, RenderBuffer);
    glRenderbufferStorage(GL_RENDERBUFFER, GL_DEPTH_COMPONENT24, 512, 512);
    glFramebufferTexture2D(GL_FRAMEBUFFER, GL_COLOR_ATTACHMENT0, GL_TEXTURE_2D, brdfLUTTexture, 0);

    glViewport(0, 0, 512, 512);
    lutShader.use();
    glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
    scene.renderQuad();

    glBindFramebuffer(GL_FRAMEBUFFER, 0);
    return brdfLUTTexture;
}

整合

到这里就以及有了所有预计算贴图，下面就是把这些贴图整合到PBR渲染管线，下面给出一个支持一个光源的IBL+PBR渲染Shader

#version 330 core
out vec4 FragColor;

in vec3 T;
in vec3 B;
in vec3 N;


in vec3 WorldPos;
in vec2 TexCoords;


uniform vec3 camPos;
uniform vec3 lightPos;
uniform vec3 lightColor;

// IBL
uniform samplerCube irradianceMap;
uniform samplerCube prefilterMap;
uniform sampler2D lutMap;

// Material maps
uniform sampler2D texture_albedo;
uniform sampler2D texture_normal;
uniform sampler2D texture_metallic;
uniform sampler2D texture_roughness;
uniform sampler2D texture_ao;
uniform sampler2D texture_emission;
// material parameters
//uniform vec3 albedo;
//uniform float metallic;
//uniform float roughness;
//uniform float ao;
const float PI = 3.14159265359;

// Convert normal map to world space
vec3 getNormalFromMap()
{
    vec3 n = normalize(N);
    vec3 t = normalize(T - dot(T, n) * n);
    vec3 b = normalize(cross(n, t));

    mat3 TBN = mat3(t, b, n);
    vec3 normalTS = texture(texture_normal, TexCoords).rgb;
    normalTS = normalTS * 2.0 - 1.0;
    return normalize(TBN * normalTS);
}

// GGX NDF
float DistributionGGX(vec3 N, vec3 H, float roughness)
{
    float a = roughness*roughness;
    float a2 = a*a;
    float NdotH = max(dot(N, H), 0.0);
    float NdotH2 = NdotH*NdotH;

    float nom   = a2;
    float denom = (NdotH2 * (a2 - 1.0) + 1.0);
    denom = PI * denom * denom;

    return nom / denom;
}

// Geometry: Schlick-GGX
float GeometrySchlickGGX(float NdotV, float roughness)
{
    float r = (roughness + 1.0);
    float k = (r*r) / 8.0;

    float nom   = NdotV;
    float denom = NdotV * (1.0 - k) + k;

    return nom / denom;
}

float GeometrySmith(vec3 N, vec3 V, vec3 L, float roughness)
{
    float NdotV = max(dot(N, V), 0.0);
    float NdotL = max(dot(N, L), 0.0);
    float ggx2 = GeometrySchlickGGX(NdotV, roughness);
    float ggx1 = GeometrySchlickGGX(NdotL, roughness);

    return ggx1 * ggx2;
}

// Fresnel: Schlick Approximation
vec3 fresnelSchlick(float cosTheta, vec3 F0)
{
    return F0 + (1.0 - F0) * pow(clamp(1.0 - cosTheta, 0.0, 1.0), 5.0);
}
vec3 fresnelSchlickRoughness(float cosTheta, vec3 F0, float roughness)
{
    return F0 + (max(vec3(1.0 - roughness), F0) - F0) * pow(clamp(1.0 - cosTheta, 0.0, 1.0), 5.0);
}
void main()
{
    // 纹理采样
    vec3 albedo     = pow(texture(texture_albedo, TexCoords).rgb, vec3(2.2));
    float metallic  = texture(texture_metallic, TexCoords).r;
    float roughness = texture(texture_roughness, TexCoords).r;
    float ao        = texture(texture_ao, TexCoords).r;
    vec3 emission     = pow(texture(texture_emission, TexCoords).rgb, vec3(2.2)); // gamma correct
//    vec3 emission = vec3(0,0,0);

    // 参数准备
    vec3 N = getNormalFromMap();   // 法线
    vec3 V = normalize(camPos - WorldPos); // 视线方向
    vec3 R = reflect(-V, N); // 反射方向
    vec3 F0 = mix(vec3(0.04), albedo, metallic); // 菲涅尔反射 F0
    vec3 L = normalize(lightPos - WorldPos); // 光源方向
    vec3 H = normalize(V + L); // 半程向量

    // 光照部分
    float NDF = DistributionGGX(N, H, roughness);
    float G   = GeometrySmith(N, V, L, roughness);
    vec3  F   = fresnelSchlick(max(dot(H, V), 0.0), F0);
    vec3 nominator = NDF * G * F;
    float denominator = 4.0 * max(dot(N, V), 0.0) * max(dot(N, L), 0.0) + 0.001;
    vec3 specular = nominator / denominator;
    vec3 kS = F;
    vec3 kD = (1.0 - kS) * (1.0 - metallic);
    float NdotL = max(dot(N, L), 0.0);
    vec3 radiance = lightColor;
    vec3 Lo = (kD * albedo / PI + specular) * radiance * NdotL;


    // IBL ambient
    const float MAX_REFLECTION_LOD = 4.0;
    vec3 prefilteredColor = textureLod(prefilterMap, R,  roughness * MAX_REFLECTION_LOD).rgb;
    F        = fresnelSchlickRoughness(max(dot(N, V), 0.0), F0, roughness);
    vec2 lut = texture(lutMap, vec2(max(dot(N, V), 0.0), roughness)).rg;
    vec3 specularIBL = prefilteredColor * (F * lut.x + lut.y);
    vec3 irradiance = texture(irradianceMap, N).rgb;
    vec3 diffuse    = irradiance * albedo / PI;  // learnOpenGL中并没有 /PI，实践下来除以效果更好
    vec3 ambient = (kD * diffuse + specularIBL) * ao;


    // 光照相加
    vec3 color = ambient + Lo + emission;
    // toneMapping
    color = color / (color + vec3(1.0));
    // 伽马矫正
    color = pow(color, vec3(1.0 / 2.2));
    FragColor = vec4(color, 1.0);
}

效果展示

切换为ACES Filmic Tone Mapping

vec3 RRTAndODTFit(vec3 v)
{
    vec3 a = v * (v + 0.0245786) - 0.000090537;
    vec3 b = v * (0.983729 * v + 0.4329510) + 0.238081;
    return a / b;
}

vec3 ACESFilmToneMapping(vec3 color)
{
    // 适当的曝光缩放，可以视为手动曝光调整（可调参数）
    color *= 0.6;

    // ACES tone mapping 曲线
    color = RRTAndODTFit(color);

    // Clamp 到 [0, 1]
    return clamp(color, 0.0, 1.0);
}

TinyRender开发记录 5-7

Sun, 19 Oct 2025 13:42:48 +0800

Lesson 5: Gouraud shading

本节课实现了 Gouraud shading，对三角形每个顶点用法线求光照，进一步插值到内部像素，相比于phong，phong是要对每个内部像素都需要计算光照，这里简单处理就是默认为255，255，255的白光，计算顶点法线和光照方向的夹角（注意单位化和钝角处理)，得到cos直接乘以光照，就得到了每个顶点的变暗比例，之后再插值到各个像素，关键代码如下

void Triangle::setShadingColor(Eigen::Vector3f lightDir) {
    lightDir.normalize();
    Vector3f basecolor = Vector3f(255,255,255);
    for (int i = 0; i < 3; ++i) {
        // 确保法线已归一化，并限制点积结果非负
        float intensity = std::max(0.0f, normal[i].normalized().dot(lightDir));
        color[i] = basecolor * intensity;
    }
}

因为我的MVP变换和课程设置不一致，所以角度不一样，下面展示 lightDir(1,-1,1)情况下的渲染完整代码在（Gouraud-shading分支）：https://github.com/sdpyy1/CppLearn/tree/Gouraud-shading

Lesson 6: Shaders for the software renderer

phongShading

首先是进行了PhongShading，思路就是插值出每个像素的法向量、每个像素对应的原来的位置（即着色点的位置，需要在顶点着色器中提前存储）以及光源的位置、摄像机的位置来计算高光、漫反射以及加上环境光,主要代码如下（自己实现注意颜色值的变化，防止过曝）

Eigen::Vector3f TGAColorToVector3f(const TGAColor& color) {
    float r = static_cast<float>(color.bgra[2]) / 255.0f;
    float g = static_cast<float>(color.bgra[1]) / 255.0f;
    float b = static_cast<float>(color.bgra[0]) / 255.0f;
    return Eigen::Vector3f(r, g, b);
}
// 将Eigen::Vector3f转换为TGAColor的函数
TGAColor Vector3fToTGAColor(const Eigen::Vector3f& vectorColor) {
    auto clamp = [](float v) { return std::max(0.0f, std::min(1.0f, v)); };
    unsigned char r = static_cast<unsigned char>(clamp(vectorColor.x()) * 255.0f);
    unsigned char g = static_cast<unsigned char>(clamp(vectorColor.y()) * 255.0f);
    unsigned char b = static_cast<unsigned char>(clamp(vectorColor.z()) * 255.0f);
    return TGAColor(r, g, b);
}
// blinnPhongShading
TGAColor blinnPhongShading(const TGAColor & kdColor,const Vector3f & point,const Vector3f & normal) {
    Eigen::Vector3f ka = Eigen::Vector3f(0.005, 0.005, 0.005);
    Eigen::Vector3f kd = TGAColorToVector3f(kdColor);
    Eigen::Vector3f ks = Eigen::Vector3f(0.7937, 0.7937, 0.7937);
    // 环境光强度
    Eigen::Vector3f amb_light_intensity{10, 10, 10};
    // 高光的指数，越大对角度越敏感
    float p = 150;
    // 计算点到光源的向量
    Eigen::Vector3f light_vec = lightDir - point;
    // 计算点到光源的距离
    float r = light_vec.norm();
    // 归一化从点到光源的向量
    Eigen::Vector3f light_dir = light_vec.normalized();
    // 漫反射
    Eigen::Vector3f diffuse = kd.cwiseProduct(lightIntensity / (r * r)) * std::max(0.0f, normal.dot(light_dir));
    // 高光反射
    // 计算从表面点到观察者的向量
    Eigen::Vector3f view_dir = (viewDir - point).normalized();
    // 计算半程向量
    Eigen::Vector3f halfVector = (light_dir + view_dir).normalized();
    Eigen::Vector3f specular = ks.cwiseProduct(lightIntensity / (r * r)) * std::pow(std::max(0.0f, normal.dot(halfVector)), p);
    Eigen::Vector3f all = diffuse + specular + ka.cwiseProduct(amb_light_intensity);
    return Vector3fToTGAColor(all);
}

法线贴图

法线贴图是通过使用 RGB 纹理的红色、绿色和蓝色分量来存储法线的 XYZ 分量，但是存储在法线贴图中的法线是模型坐标系下的法线坐标，如果模型在空间中发生了旋转，那法线位置就会发生变化，所以如果要用法线贴图，需要对法线变换到global坐标系下才行。另外不能简单地给法线左乘一个模型变换矩阵，解释及正确做法如下（也不是一定不行，有几种模型变换是不行滴）下面使用法线贴图作为color得到的图片下面使用法线贴图作为phongshading的法线来渲染光照，注意贴图范围是[-1，1]，而颜色通道是[0,1]，也就是拿到的材质颜色是[0,1]的，需要先转成[-1,1]才可以使用，关键代码如下

1
2

            // 法线来自法线贴图
            Eigen::Vector3f barycentricNorm = TGAColorToVector3f(nm.getColor(texU,texV))*2-Vector3f{1,1,1};

对比直接使用插值的法线和使用贴图法线的效果区别，区别还是很明显的，使用法线贴图并没有增加模型的结构，但精细程度大大提升了

Specular mapping 高光贴图

在之前的设置中镜面反射系数是自己设置的，使用高光贴图就是用来获取这个参数

`1`	`Eigen::Vector3f ks = Eigen::Vector3f(0.7937, 0.7937, 0.7937);`

修改为从高光贴图中获得

1
2

            // 高光系数来自高光贴图
            TGAColor specKd = spec.getColor(texU,texV);

最终效果如下，变化看不太出来了，主要是一些奇怪的高光点消失了

tangent space normal mapping ‌切线空间法线贴图

将法线方向存储在‌切线空间‌（Tangent Space）中，而非模型或世界空间。这种技术可以显著提升表面凹凸感，且对模型变形（如动画）更友好，首先解释一下切线空间这个东西就是把法线存储在切线空间坐标下，如果需要法线就在着色器中，通过 ‌TBN矩阵‌（Tangent-Bitangent-Normal Matrix）将法线从切线空间转换到世界空间

为什么有了法线贴图，还需要切线法线贴图呢？

普通法线贴图与特定的模型紧密绑定的，当模型的形状、朝向或者拓扑结构发生变化时，法线贴图可能就不再适用。切线空间是每个顶点局部的一个坐标系，它由切线（Tangent）、副切线（Bitangent）和法线（Normal）三个向量定义。切线空间法线贴图中的法向量是相对于每个顶点的切线空间而言的。这种表示方式使得法线贴图具有更好的可移植性，同一个切线空间法线贴图可以应用到不同形状和朝向的模型上，只要每个模型的切线空间能够正确计算，就可以得到正确的光照效果。
切线空间法线贴图能够很好地支持模型变形。因为切线空间是随着顶点一起变形的，当模型发生变形时，切线空间也会相应地改变，而切线空间法线贴图中的法向量在新的切线空间中仍然能够正确表示表面的细节。所以，即使模型在动画过程中发生了变形，光照效果依然能够保持正确。

如果不对切线法线贴图进行转换，直接使用，效果如下哈哈哈获取到切线法线贴图后，需要左乘一个TBN矩阵，转为空间法线才能使用，第一列是三角形的切线，第二列是副切线，第三列是法线具体转化函数如下

// 从切线法线转为法线
Eigen::Vector3f getNormalFromTangent(const Triangle& triangle, const Eigen::Vector3f& tangentSpaceNormal, const Eigen::Vector3f& barycentricNorm) {
    // 计算切线
    Eigen::Vector3f edge1 = triangle.globalCoords[1].head<3>() - triangle.globalCoords[0].head<3>();
    Eigen::Vector3f edge2 = triangle.globalCoords[2].head<3>() - triangle.globalCoords[0].head<3>();
    Eigen::Vector2f deltaUV1 = triangle.texCoords[1] - triangle.texCoords[0];
    Eigen::Vector2f deltaUV2 = triangle.texCoords[2] - triangle.texCoords[0];

    float f = 1.0f / (deltaUV1.x() * deltaUV2.y() - deltaUV2.x() * deltaUV1.y());

    Eigen::Vector3f tangent;
    tangent.x() = f * (deltaUV2.y() * edge1.x() - deltaUV1.y() * edge2.x());
    tangent.y() = f * (deltaUV2.y() * edge1.y() - deltaUV1.y() * edge2.y());
    tangent.z() = f * (deltaUV2.y() * edge1.z() - deltaUV1.y() * edge2.z());
    tangent.normalize();

    // 计算副切线
    Eigen::Vector3f bitangent;
    bitangent.x() = f * (-deltaUV2.x() * edge1.x() + deltaUV1.x() * edge2.x());
    bitangent.y() = f * (-deltaUV2.x() * edge1.y() + deltaUV1.x() * edge2.y());
    bitangent.z() = f * (-deltaUV2.x() * edge1.z() + deltaUV1.x() * edge2.z());
    bitangent.normalize();


    // 构建 TBN 矩阵
    Eigen::Matrix3f TBN;
    TBN.col(0) = tangent;
    TBN.col(1) = bitangent;
    TBN.col(2) = barycentricNorm;

    // 将切向法线转换到世界空间
    return TBN * tangentSpaceNormal;
}

最终用转化后的切线作为像素的切线得到的图片如下

Lesson 7: Shadow mapping

简单理解就是把光源当作摄像机，重新渲染一遍场景，但只需要记录每个点离光源最近的点，也就是哪些点能被光源照到，在正式渲染时，判断一个点颜色时，先去刚才记录的光照缓存中查看该点是否能被光照到，来决定是否进行渲染完成的做法是对于一个像素，先去找它原本在空间中的位置，紧接着做MVP变换和视口变换变到以光源为摄像机下的对应像素块的位置，判断该位置深度是否需要阴影，不需要阴影才去正常进行光照，我的简单做法是如果在阴影，就让光照最终结果*0.2,从而变暗，这里这样做只是为了效果好看，不过这个光照模型本身就是不准确的，我的做法并不特别准确，但是理解原理即可整体实现代码如下，其他未展示文件可以在仓库中找到

#include "thirdParty/tgaimage.h"
#include "model.h"
#include <vector>
#include <cmath>
#include "iostream"
using namespace std;
constexpr static int width  = 1000;
constexpr static int height = 1000;
float angleX = 0.0f;
float angleY = 0.0f;
float angleZ = 0.0f;
float tx = 0.0f;
float ty = 0.0f;
float tz = 0.0f;
float sx = 1.0f;
float sy = 1.0f;
float sz = 1.0f;
Eigen::Vector3f eye_pos{0,0,3};
Eigen::Vector3f eye_dir(0.0f, 0.0f, -1.0f);
Eigen::Vector3f up(0.0f, 1.0f, 0.0f);
float fovY = 45.0f;
float aspectRatio = 1.0f;
float near = 0.1f;
float far = 100.0f;
Eigen::Vector3f lightDir{1,1,0};
Eigen::Vector3f lightIntensity{5,5,5};
// 计算三角形面积，可能返回负数，表示背对屏幕
float signed_triangle_area(float ax, float ay, float bx, float by, float cx, float cy) {
    return .5f*((by-ay)*(bx+ax) + (cy-by)*(cx+bx) + (ay-cy)*(ax+cx));
}
Eigen::Vector3f TGAColorToVector3f(const TGAColor& color) {
    float r = static_cast<float>(color.bgra[2]) / 255.0f;
    float g = static_cast<float>(color.bgra[1]) / 255.0f;
    float b = static_cast<float>(color.bgra[0]) / 255.0f;
    return Eigen::Vector3f(r, g, b);
}
// 将Eigen::Vector3f转换为TGAColor的函数
TGAColor Vector3fToTGAColor(const Eigen::Vector3f& vectorColor) {
    auto clamp = [](float v) { return std::max(0.0f, std::min(1.0f, v)); };
    unsigned char r = static_cast<unsigned char>(clamp(vectorColor.x()) * 255.0f);
    unsigned char g = static_cast<unsigned char>(clamp(vectorColor.y()) * 255.0f);
    unsigned char b = static_cast<unsigned char>(clamp(vectorColor.z()) * 255.0f);
    return TGAColor(r, g, b);
}
// blinnPhongShading
TGAColor blinnPhongShading(const TGAColor & textureColor, const Vector3f & point, const Vector3f & normal,TGAColor specKd,bool isShadow) {
    // 环境光系数
    Eigen::Vector3f ka = Eigen::Vector3f(0.005, 0.005, 0.005);
    // 漫反射系数（来自材质贴图）
    Eigen::Vector3f kd = TGAColorToVector3f(textureColor);
    // 高光系数（来自高光贴图）
    Eigen::Vector3f ks = TGAColorToVector3f(specKd);
    Eigen::Vector3f amb_light_intensity{10, 10, 10};

    // 环境光强度
    // 高光的指数，越大对角度越敏感
    float p = 150;
    // 计算点到光源的向量
    Eigen::Vector3f light_vec = lightDir - point;
    // 计算点到光源的距离
    float r = light_vec.norm();
    // 归一化从点到光源的向量
    Eigen::Vector3f light_dir = light_vec.normalized();
    // 漫反射
    Eigen::Vector3f diffuse = kd.cwiseProduct(lightIntensity / (r * r)) * std::max(0.0f, normal.dot(light_dir));
    // 高光反射
    // 计算从表面点到观察者的向量
    Eigen::Vector3f view_dir = (eye_pos - point).normalized();
    // 计算半程向量
    Eigen::Vector3f halfVector = (light_dir + view_dir).normalized();
    Eigen::Vector3f specular = ks.cwiseProduct(lightIntensity / (r * r)) * std::pow(std::max(0.0f, normal.dot(halfVector)), p);
    Eigen::Vector3f all = diffuse + specular + ka.cwiseProduct(amb_light_intensity);
    if (isShadow){
        return Vector3fToTGAColor(all*0.2);
    }
    return Vector3fToTGAColor(all);
}
// 插值函数
Eigen::Vector3f interpolate(const Eigen::Vector3f& v0, const Eigen::Vector3f& v1, const Eigen::Vector3f& v2, double alpha, double beta, double gamma) {
    return alpha * v0 + beta * v1 + gamma * v2;
}
float interpolate(float v0, float v1, float v2, float alpha, float beta, float gamma) {
    return alpha * v0 + beta * v1 + gamma * v2;
}

// 从切线法线转为法线
Eigen::Vector3f getNormalFromTangent(const Triangle& triangle, const Eigen::Vector3f& tangentSpaceNormal, const Eigen::Vector3f& barycentricNorm) {
    // 计算切线
    Eigen::Vector3f edge1 = triangle.globalCoords[1].head<3>() - triangle.globalCoords[0].head<3>();
    Eigen::Vector3f edge2 = triangle.globalCoords[2].head<3>() - triangle.globalCoords[0].head<3>();
    Eigen::Vector2f deltaUV1 = triangle.texCoords[1] - triangle.texCoords[0];
    Eigen::Vector2f deltaUV2 = triangle.texCoords[2] - triangle.texCoords[0];

    float f = 1.0f / (deltaUV1.x() * deltaUV2.y() - deltaUV2.x() * deltaUV1.y());

    Eigen::Vector3f tangent;
    tangent.x() = f * (deltaUV2.y() * edge1.x() - deltaUV1.y() * edge2.x());
    tangent.y() = f * (deltaUV2.y() * edge1.y() - deltaUV1.y() * edge2.y());
    tangent.z() = f * (deltaUV2.y() * edge1.z() - deltaUV1.y() * edge2.z());
    tangent.normalize();

    // 计算副切线
    Eigen::Vector3f bitangent;
    bitangent.x() = f * (-deltaUV2.x() * edge1.x() + deltaUV1.x() * edge2.x());
    bitangent.y() = f * (-deltaUV2.x() * edge1.y() + deltaUV1.x() * edge2.y());
    bitangent.z() = f * (-deltaUV2.x() * edge1.z() + deltaUV1.x() * edge2.z());
    bitangent.normalize();


    // 构建 TBN 矩阵
    Eigen::Matrix3f TBN;
    TBN.col(0) = tangent;
    TBN.col(1) = bitangent;
    TBN.col(2) = barycentricNorm;

    // 将切向法线转换到世界空间
    return TBN * tangentSpaceNormal;
}

void shadow(Triangle &triangle,std::vector<std::vector<float>> *shadowBuffer){
    float ax = triangle.screenCoords[0].x();
    float ay = triangle.screenCoords[0].y();
    float bx = triangle.screenCoords[1].x();
    float by = triangle.screenCoords[1].y();
    float cx = triangle.screenCoords[2].x();
    float cy = triangle.screenCoords[2].y();
    int bbminx = std::floor(std::min(std::min(ax, bx), cx));
    int bbminy = std::ceil(std::min(std::min(ay, by), cy));
    int bbmaxx = std::floor(std::max(std::max(ax, bx), cx));
    int bbmaxy = std::ceil(std::max(std::max(ay, by), cy));
    float total_area = signed_triangle_area(ax, ay, bx, by, cx, cy);

    for (int x = bbminx; x <= bbmaxx; x++) {
        for (int y = bbminy; y <= bbmaxy; y++) {
            // 虽然可以把整个三角形直接剔除，但是我希望只是把屏幕外的像素剔除
            if (x < 0 || x >= width || y < 0 || y >= height) {
                continue;
            }
            float alpha = signed_triangle_area(x, y, bx, by, cx, cy) / total_area;
            float beta = signed_triangle_area(x, y, cx, cy, ax, ay) / total_area;
            float gamma = signed_triangle_area(x, y, ax, ay, bx, by) / total_area;
            if (alpha < 0 || beta < 0 || gamma < 0) continue; // 说明当前像素不在三角形内部
            float barycentricZ = interpolate(triangle.screenCoords[0].z(), triangle.screenCoords[1].z(),triangle.screenCoords[2].z(), alpha, beta, gamma);
            if (shadowBuffer->at(x).at(y) < barycentricZ) {
                shadowBuffer->at(x).at(y) = barycentricZ;
            }
        }
    }
}





// 绘制一个三角形
    void drawTriangle(Triangle &triangle, TGAImage &framebuffer, std::vector<std::vector<float>> *zBuffer, std::vector<std::vector<float>> *shadowBuffer,Texture &texture,
                 Texture &nm, Texture &spec, Texture &nm_tangent,Eigen::Matrix4f mvpForShadow) {
        float ax = triangle.screenCoords[0].x();
        float ay = triangle.screenCoords[0].y();
        float bx = triangle.screenCoords[1].x();
        float by = triangle.screenCoords[1].y();
        float cx = triangle.screenCoords[2].x();
        float cy = triangle.screenCoords[2].y();
        int bbminx = std::floor(std::min(std::min(ax, bx), cx));
        int bbminy = std::ceil(std::min(std::min(ay, by), cy));
        int bbmaxx = std::floor(std::max(std::max(ax, bx), cx));
        int bbmaxy = std::ceil(std::max(std::max(ay, by), cy));

        // 如果面积为负数，背对屏幕，被裁剪
        float total_area = signed_triangle_area(ax, ay, bx, by, cx, cy);
        if (total_area < 1) return;

#pragma omp parallel for
        for (int x = bbminx; x <= bbmaxx; x++) {
            for (int y = bbminy; y <= bbmaxy; y++) {
                // 虽然可以把整个三角形直接剔除，但是我希望只是把屏幕外的像素剔除
                if (x < 0 || x >= width || y < 0 || y >= height) {
                    continue;
                }
                float alpha = signed_triangle_area(x, y, bx, by, cx, cy) / total_area;
                float beta = signed_triangle_area(x, y, cx, cy, ax, ay) / total_area;
                float gamma = signed_triangle_area(x, y, ax, ay, bx, by) / total_area;
                if (alpha < 0 || beta < 0 || gamma < 0) continue; // 说明当前像素不在三角形内部
                float barycentricZ = interpolate(triangle.screenCoords[0].z(), triangle.screenCoords[1].z(),triangle.screenCoords[2].z(), alpha, beta, gamma);
                Eigen::Vector3f barycentricGlobalCoord = interpolate(triangle.globalCoords[0].head<3>(),triangle.globalCoords[1].head<3>(),triangle.globalCoords[2].head<3>(), alpha, beta,gamma);
                float texU = interpolate(triangle.texCoords[0].x(), triangle.texCoords[1].x(),triangle.texCoords[2].x(), alpha, beta, gamma);
                float texV = interpolate(triangle.texCoords[0].y(), triangle.texCoords[1].y(),triangle.texCoords[2].y(), alpha, beta, gamma);
                TGAColor texColor = texture.getColor(texU, texV);
                Eigen::Vector3f barycentricNorm = interpolate(triangle.normal[0], triangle.normal[1],triangle.normal[2], alpha, beta, gamma);
                // 法线来自法线贴图
//            Eigen::Vector3f barycentricNorm = TGAColorToVector3f(nm.getColor(texU,texV))*2-Vector3f{1,1,1};
                // 切线法线贴图
//                Eigen::Vector3f barycentricNmTangent =TGAColorToVector3f(nm_tangent.getColor(texU, texV)) * 2 - Vector3f{1, 1, 1};
//                barycentricNmTangent = getNormalFromTangent(triangle, barycentricNmTangent, barycentricNorm);
                // 高光系数来自高光贴图
                TGAColor specKd = spec.getColor(texU, texV);
                // zbuffer中缓存的渲染物体距离小于当前渲染物体的距离时，才覆盖渲染
                if (zBuffer->at(x).at(y) < barycentricZ) {
                    zBuffer->at(x).at(y) = barycentricZ;
                    // 阴影处理
                    // 1. 找到该像素对应物体在原空间的位置
                    Eigen::Vector4f locationInShaowBuffer = mvpForShadow * (barycentricGlobalCoord.homogeneous());
                    locationInShaowBuffer.x() /= locationInShaowBuffer.w();
                    locationInShaowBuffer.y() /= locationInShaowBuffer.w();
                    locationInShaowBuffer.z() /= locationInShaowBuffer.w();
                    locationInShaowBuffer.x() = 0.5*width*(locationInShaowBuffer.x()+1);
                    locationInShaowBuffer.y() = 0.5*height*(locationInShaowBuffer.y()+1);
                    bool isShadow = false;
                    // 在阴影中
                    if (locationInShaowBuffer.z() < shadowBuffer->at(locationInShaowBuffer.x()).at(locationInShaowBuffer.y())){
                        isShadow = true;
                    }
                    // 直接使用贴图
//                framebuffer.set(x,y, texture.getColor(texU,texV));
                    // 使用phongshading光照模型
                    framebuffer.set(x,y, blinnPhongShading(texColor,barycentricGlobalCoord,barycentricNorm,specKd,isShadow));
                    // 直接使用法线贴图
//                framebuffer.set(x,y, nm.getColor(texU,texV));
                    // 使用法线贴图的法线配合phongshading
//                framebuffer.set(x,y, blinnPhongShading(texColor,barycentricGlobalCoord,barycentricNorm,specKd));
                    // 使用切线法线贴图配合phongshaing
//                    framebuffer.set(x, y,blinnPhongShading(texColor, barycentricGlobalCoord, barycentricNmTangent, specKd));
                }
            }
        }
    }

    int main() {
        Model model("./obj/diablo3_pose/diablo3_pose.obj", "./obj/diablo3_pose/diablo3_pose_diffuse.tga");
        TGAImage framebuffer(width, height, TGAImage::RGB);
        // 定义一个zBuffer,并设置全部数据为最小负数
        auto *zBuffer = new std::vector<std::vector<float>>(width, std::vector<float>(height,std::numeric_limits<float>::lowest()));
        // 用于shadow
        auto *shadowBuffer = new std::vector<std::vector<float>>(width, std::vector<float>(height,std::numeric_limits<float>::lowest()));
        // 获取法线贴图
        Texture nm("./obj/diablo3_pose/diablo3_pose_nm.tga");
        Texture spec("./obj/diablo3_pose/diablo3_pose_spec.tga");
        Texture nm_tangent("./obj/diablo3_pose/diablo3_pose_nm_tangent.tga");

        // 首先先从光源位置渲染，来赋值shadowBuffer
        model.setModelTransformation(angleX, angleY, angleZ, tx, ty, tz, sx, sy, sz);
        model.setViewTransformation(lightDir*4, eye_dir, up);
        model.setProjectionTransformation(fovY, aspectRatio, near, far);
        // 获取所有变换矩阵
        Eigen::Matrix4f mvpForShadow = model.getMVP();
        for (Triangle triangle: model.triangleList) {
            // 坐标投影
            triangle.setScreenCoords(mvpForShadow, width, height);
            // 绘制三角形
            shadow(triangle, shadowBuffer);
        }


        // 转回正常视角，进行渲染
        model.setModelTransformation(angleX, angleY, angleZ, tx, ty, tz, sx, sy, sz);
        model.setViewTransformation(eye_pos, eye_dir, up);
        model.setProjectionTransformation(fovY, aspectRatio, near, far);
        // 获取所有变换矩阵
        Eigen::Matrix4f mvp = model.getMVP();

        // 遍历obj文件中的每个三角形
        for (Triangle triangle: model.triangleList) {
            // 坐标投影
            triangle.setScreenCoords(mvp, width, height);
            // 摄像机空间点转光源空间点的矩阵
            Eigen::Matrix4f viewToLightTrans = mvpForShadow * (mvp.inverse());
            // 绘制三角形
            drawTriangle(triangle, framebuffer, zBuffer,shadowBuffer, model.texture, nm, spec, nm_tangent,mvpForShadow);
        }
        framebuffer.write_tga_file("framebuffer.tga");
        delete (zBuffer);
        delete (shadowBuffer);
        return 0;
    }

最终呈现效果如下，很合理哈，因为右手并未被挡住，所以还是亮的下图通过过曝来展示哪些像素被阴影化了，还是蛮合理的～在使用普通的材质贴图下效果比较好

对于出现的不合理的黑色纹路解释来自别的博客：

原文链接：https://blog.csdn.net/qq_42987967/article/details/125011820 上述照片脖子部位下面有很明显的z-fighting痕迹，主要是因为浮点数精度不足导致的冲突(即当前的点可能索引到附近的点了，而附近的点的shadowbuffer值比该点大造成误判)，毕竟连续的像素位置很接近，则有的像素大于shadow map，有的则小于shadow map，从而产生了离散的显示。此处采用一个解决z-fighting问题的暴力解法，即对于每一个像素投影光源的z轴值都进行一个偏移，只要在该偏移位置不存在连续像素即可展示不错的画面。

我需要将最终比较的z值加一个很小的偏移量，瞬间这些黑色条纹就消失了～

1
2
3

                if (locationInShadowBuffer.z()+0.005 < shadowBuffer->at(locationInShadowBuffer.x()).at(locationInShadowBuffer.y())){
                    isShadow = true;
                }

ai给出的解释：这种现象叫做自阴影

深度图的精度限制‌：Shadow Mapping 需要从光源视角生成深度图（Shadow Map）。由于深度图的分辨率有限，物体表面在光源视角下的离散采样可能导致实际连续的几何表面在深度图中被“阶梯化”。当从摄像机视角比较深度时，同一表面的不同片段可能被错误判定为处于阴影中。
浮点数精度误差‌：深度值存储为浮点数，计算时可能因精度不足导致比较错误。例如，光源视角和摄像机视角的深度计算存在微小差异，导致同一位置被误判为“低于”深度图记录的深度，从而触发阴影。

TinyRender开发记录 1-4

Sun, 19 Oct 2025 13:37:45 +0800

项目介绍

Tiny Renderer or how OpenGL works: software rendering in 500 lines of code 项目地址：https://github.com/ssloy/tinyrenderer In this series of articles, I want to show how OpenGL works by writing its clone (a much simplified one). Surprisingly enough, I often meet people who cannot overcome the initial hurdle of learning OpenGL / DirectX. Thus, I have prepared a short series of lectures, after which my students show quite good renderers. So, the task is formulated as follows: using no third-party libraries (especially graphic ones), get something like this picture:

所以学习最终目标是不使用第三方代码，得到下面这种图，建议学完games101后来复习，不过过程很详细，作为入门也是不错的

环境搭建

虽然项目旨在不使用第三方库，但提供了图片读取、保存、设置像素点颜色的代码 tagimage.h

#pragma once
#include <cstdint>
#include <fstream>
#include <vector>

#pragma pack(push,1)
struct TGAHeader {
    std::uint8_t  idlength{};
    std::uint8_t  colormaptype{};
    std::uint8_t  datatypecode{};
    std::uint16_t colormaporigin{};
    std::uint16_t colormaplength{};
    std::uint8_t  colormapdepth{};
    std::uint16_t x_origin{};
    std::uint16_t y_origin{};
    std::uint16_t width{};
    std::uint16_t height{};
    std::uint8_t  bitsperpixel{};
    std::uint8_t  imagedescriptor{};
};
#pragma pack(pop)

struct TGAColor {
    std::uint8_t bgra[4] = {0,0,0,0};
    std::uint8_t bytespp = {0};

    TGAColor() = default;
    TGAColor(const std::uint8_t R, const std::uint8_t G, const std::uint8_t B, const std::uint8_t A=255) : bgra{B,G,R,A}, bytespp(4) { }
    TGAColor(const std::uint8_t *p, const std::uint8_t bpp) : bytespp(bpp) {
        for (int i=bpp; i--; bgra[i] = p[i]);
    }
    std::uint8_t& operator[](const int i) { return bgra[i]; }
};

struct TGAImage {
    enum Format { GRAYSCALE=1, RGB=3, RGBA=4 };

    TGAImage() = default;
    TGAImage(const int w, const int h, const int bpp);
    bool  read_tga_file(const std::string filename);
    bool write_tga_file(const std::string filename, const bool vflip=true, const bool rle=true) const;
    void flip_horizontally();
    void flip_vertically();
    TGAColor get(const int x, const int y) const;
    void set(const int x, const int y, const TGAColor &c);
    int width()  const;
    int height() const;
private:
    bool   load_rle_data(std::ifstream &in);
    bool unload_rle_data(std::ofstream &out) const;

    int w   = 0;
    int h   = 0;
    int bpp = 0;
    std::vector<std::uint8_t> data = {};
};

tgaimage.cpp

#include <iostream>
#include <cstring>
#include "tgaimage.h"

TGAImage::TGAImage(const int w, const int h, const int bpp) : w(w), h(h), bpp(bpp), data(w*h*bpp, 0) {}

bool TGAImage::read_tga_file(const std::string filename) {
    std::ifstream in;
    in.open (filename, std::ios::binary);
    if (!in.is_open()) {
        std::cerr << "can't open file " << filename << "\n";
        in.close();
        return false;
    }
    TGAHeader header;
    in.read(reinterpret_cast<char *>(&header), sizeof(header));
    if (!in.good()) {
        in.close();
        std::cerr << "an error occured while reading the header\n";
        return false;
    }
    w   = header.width;
    h   = header.height;
    bpp = header.bitsperpixel>>3;
    if (w<=0 || h<=0 || (bpp!=GRAYSCALE && bpp!=RGB && bpp!=RGBA)) {
        in.close();
        std::cerr << "bad bpp (or width/height) value\n";
        return false;
    }
    size_t nbytes = bpp*w*h;
    data = std::vector<std::uint8_t>(nbytes, 0);
    if (3==header.datatypecode || 2==header.datatypecode) {
        in.read(reinterpret_cast<char *>(data.data()), nbytes);
        if (!in.good()) {
            in.close();
            std::cerr << "an error occured while reading the data\n";
            return false;
        }
    } else if (10==header.datatypecode||11==header.datatypecode) {
        if (!load_rle_data(in)) {
            in.close();
            std::cerr << "an error occured while reading the data\n";
            return false;
        }
    } else {
        in.close();
        std::cerr << "unknown file format " << (int)header.datatypecode << "\n";
        return false;
    }
    if (!(header.imagedescriptor & 0x20))
        flip_vertically();
    if (header.imagedescriptor & 0x10)
        flip_horizontally();
    std::cerr << w << "x" << h << "/" << bpp*8 << "\n";
    in.close();
    return true;
}

bool TGAImage::load_rle_data(std::ifstream &in) {
    size_t pixelcount = w*h;
    size_t currentpixel = 0;
    size_t currentbyte  = 0;
    TGAColor colorbuffer;
    do {
        std::uint8_t chunkheader = 0;
        chunkheader = in.get();
        if (!in.good()) {
            std::cerr << "an error occured while reading the data\n";
            return false;
        }
        if (chunkheader<128) {
            chunkheader++;
            for (int i=0; i<chunkheader; i++) {
                in.read(reinterpret_cast<char *>(colorbuffer.bgra), bpp);
                if (!in.good()) {
                    std::cerr << "an error occured while reading the header\n";
                    return false;
                }
                for (int t=0; t<bpp; t++)
                    data[currentbyte++] = colorbuffer.bgra[t];
                currentpixel++;
                if (currentpixel>pixelcount) {
                    std::cerr << "Too many pixels read\n";
                    return false;
                }
            }
        } else {
            chunkheader -= 127;
            in.read(reinterpret_cast<char *>(colorbuffer.bgra), bpp);
            if (!in.good()) {
                std::cerr << "an error occured while reading the header\n";
                return false;
            }
            for (int i=0; i<chunkheader; i++) {
                for (int t=0; t<bpp; t++)
                    data[currentbyte++] = colorbuffer.bgra[t];
                currentpixel++;
                if (currentpixel>pixelcount) {
                    std::cerr << "Too many pixels read\n";
                    return false;
                }
            }
        }
    } while (currentpixel < pixelcount);
    return true;
}

bool TGAImage::write_tga_file(const std::string filename, const bool vflip, const bool rle) const {
    constexpr std::uint8_t developer_area_ref[4] = {0, 0, 0, 0};
    constexpr std::uint8_t extension_area_ref[4] = {0, 0, 0, 0};
    constexpr std::uint8_t footer[18] = {'T','R','U','E','V','I','S','I','O','N','-','X','F','I','L','E','.','\0'};
    std::ofstream out;
    out.open (filename, std::ios::binary);
    if (!out.is_open()) {
        std::cerr << "can't open file " << filename << "\n";
        out.close();
        return false;
    }
    TGAHeader header;
    header.bitsperpixel = bpp<<3;
    header.width  = w;
    header.height = h;
    header.datatypecode = (bpp==GRAYSCALE?(rle?11:3):(rle?10:2));
    header.imagedescriptor = vflip ? 0x00 : 0x20; // top-left or bottom-left origin
    out.write(reinterpret_cast<const char *>(&header), sizeof(header));
    if (!out.good()) {
        out.close();
        std::cerr << "can't dump the tga file\n";
        return false;
    }
    if (!rle) {
        out.write(reinterpret_cast<const char *>(data.data()), w*h*bpp);
        if (!out.good()) {
            std::cerr << "can't unload raw data\n";
            out.close();
            return false;
        }
    } else if (!unload_rle_data(out)) {
        out.close();
        std::cerr << "can't unload rle data\n";
        return false;
    }
    out.write(reinterpret_cast<const char *>(developer_area_ref), sizeof(developer_area_ref));
    if (!out.good()) {
        std::cerr << "can't dump the tga file\n";
        out.close();
        return false;
    }
    out.write(reinterpret_cast<const char *>(extension_area_ref), sizeof(extension_area_ref));
    if (!out.good()) {
        std::cerr << "can't dump the tga file\n";
        out.close();
        return false;
    }
    out.write(reinterpret_cast<const char *>(footer), sizeof(footer));
    if (!out.good()) {
        std::cerr << "can't dump the tga file\n";
        out.close();
        return false;
    }
    out.close();
    return true;
}

// TODO: it is not necessary to break a raw chunk for two equal pixels (for the matter of the resulting size)
bool TGAImage::unload_rle_data(std::ofstream &out) const {
    const std::uint8_t max_chunk_length = 128;
    size_t npixels = w*h;
    size_t curpix = 0;
    while (curpix<npixels) {
        size_t chunkstart = curpix*bpp;
        size_t curbyte = curpix*bpp;
        std::uint8_t run_length = 1;
        bool raw = true;
        while (curpix+run_length<npixels && run_length<max_chunk_length) {
            bool succ_eq = true;
            for (int t=0; succ_eq && t<bpp; t++)
                succ_eq = (data[curbyte+t]==data[curbyte+t+bpp]);
            curbyte += bpp;
            if (1==run_length)
                raw = !succ_eq;
            if (raw && succ_eq) {
                run_length--;
                break;
            }
            if (!raw && !succ_eq)
                break;
            run_length++;
        }
        curpix += run_length;
        out.put(raw?run_length-1:run_length+127);
        if (!out.good()) {
            std::cerr << "can't dump the tga file\n";
            return false;
        }
        out.write(reinterpret_cast<const char *>(data.data()+chunkstart), (raw?run_length*bpp:bpp));
        if (!out.good()) {
            std::cerr << "can't dump the tga file\n";
            return false;
        }
    }
    return true;
}

TGAColor TGAImage::get(const int x, const int y) const {
    if (!data.size() || x<0 || y<0 || x>=w || y>=h)
        return {};
    return TGAColor(data.data()+(x+y*w)*bpp, bpp);
}

void TGAImage::set(int x, int y, const TGAColor &c) {
    if (!data.size() || x<0 || y<0 || x>=w || y>=h) return;
    memcpy(data.data()+(x+y*w)*bpp, c.bgra, bpp);
}

void TGAImage::flip_horizontally() {
    int half = w>>1;
    for (int i=0; i<half; i++)
        for (int j=0; j<h; j++)
            for (int b=0; b<bpp; b++)
                std::swap(data[(i+j*w)*bpp+b], data[(w-1-i+j*w)*bpp+b]);
}

void TGAImage::flip_vertically() {
    int half = h>>1;
    for (int i=0; i<w; i++)
        for (int j=0; j<half; j++)
            for (int b=0; b<bpp; b++)
                std::swap(data[(i+j*w)*bpp+b], data[(i+(h-1-j)*w)*bpp+b]);
}

int TGAImage::width() const {
    return w;
}

int TGAImage::height() const {
    return h;
}

写一个测试来确保环境正常

#include "tgaimage.h"
const TGAColor white = TGAColor(255, 255, 255, 255);
const TGAColor red   = TGAColor(255, 0,   0,   255);
int main(int argc, char** argv) {
    TGAImage image(100, 100, TGAImage::RGB);
    image.set(52, 41, red);
    image.flip_vertically(); // 垂直方向翻转图片，反转y坐标，作者解释是希望图片的原点在左下角，但很多库原点都在左上角
    image.write_tga_file("output.tga");
    return 0;
}

运行后图片如下

Lesson 1: Bresenham’s Line Drawing Algorithm（画线算法）

首先进行初始化，在图上标记三个位置

#include "tgaimage.h"
constexpr TGAColor white   = {255, 255, 255, 255}; // attention, BGRA order
constexpr TGAColor green   = {  0, 255,   0, 255};
constexpr TGAColor red     = {  255,   0, 0, 255};
constexpr TGAColor blue    = {255, 128,  64, 255};
constexpr TGAColor yellow  = {  0, 200, 255, 255};
int main(int argc, char** argv) {
    constexpr int width  = 64;
    constexpr int height = 64;
    TGAImage framebuffer(width, height, TGAImage::RGB);
    int ax =  7, ay =  3;
    int bx = 12, by = 37;
    int cx = 62, cy = 53;
    framebuffer.set(ax, ay, white);
    framebuffer.set(bx, by, white);
    framebuffer.set(cx, cy, white);
    framebuffer.write_tga_file("framebuffer.tga");
    return 0;
}

得到结果如下首先来学习下如何在像素上画一条线第一次尝试：想象用参数t来表示的一个在$x_a和x_b$之间的点$(x(t),y(t))$

$$ \begin{cases} x(t) = a_x + t \cdot (b_x - a_x) \\ y(t) = a_y + t \cdot (b_y - a_y) \end{cases} $$

如果我们变换一下形式就会发现，这就是插值的公式

$$ \begin{cases} x(t) = (1-t) \cdot a_x + t \cdot b_x \\ y(t) = (1-t) \cdot a_y + t \cdot b_y \end{cases} $$

下面来尝试一下通过控制t来绘制这条直线

void drawLine_first(int x1,int y1,int x2,int y2,TGAImage &img,TGAColor color){
    for(float t = 0;t<=1;t+=0.02){
        int x = std::round(x1 + t * (x2-x1)); // round会进行四舍五入
        int y = std::round(y1 + t * (y2-y1));
        img.set(x,y,color);
    }
}

考虑左下角的a点和右上角的c点，如果我从a向c绘制一次，再从c向a绘制一次，结果如下

图中能明显看出问题，一是在x上有缝隙，二是不同的绘制方向结果是不同的，第三另外t步长的设置也不容易控制接下来看第二种尝试，代码的改变写在了注释中

void drawLine_Second(int ax, int ay, int bx, int by, TGAImage &img, TGAColor color){
    for (int x = ax ; x<= bx; x++) { // 不再以t控制，而是以x的进行进行控制，保证了水平方向上不会有空隙
    	// 如果不加强制转换，当分子分母都是整数时，计算结果的小数部分会被截断
        float t = (x-ax)/static_cast<float>(bx-ax); // 变换了形式，表示出当x移动一格时，t是多少，
        int y = std::round( ay + (by-ay)*t );
        img.set(x, y, color);
    }
}

这里碰到了Cpp的static_cast，顺便学习一下是什么隐式转换（Implicit Conversion）：编译器或解释器‌自动完成‌的类型转换，无需程序员显式指定。显式转换（Explicit Conversion）：程序员‌主动指定‌的类型转换，通常通过语法或函数强制实现。 static_cast是 C++ 中一种显式类型转换操作符，‌用于在编译时进行类型转换，‌适用场景‌：明确的、安全的类型转换（如基本类型转换、向上转换、void* 转换），不用c语言风格的强制转换是为了规避风险。从下图看到问题2，3已经解决了，原本有的问题1空隙也没有了，但是出现了新的很大的空隙，甚至一条线直接消失了线消失比较好解决，原因就是从右上角向左下角画线，if就进不去

void drawLine_Second(int ax, int ay, int bx, int by, TGAImage &img, TGAColor color){
    if (ax>bx) { // make it left−to−right
        std::swap(ax, bx);
        std::swap(ay, by);
    }
    for (int x = ax ; x<= bx; x++) { // 不再以t控制，而是以x的进行进行控制，保证了水平方向上不会有空隙
        // 如果不加强制转换，当分子分母都是整数时，计算结果的小数部分会被截断
        float t = (x-ax)/static_cast<float>(bx-ax); // 变换了形式，表示出当x移动一格时，t是多少，
        int y = std::round( ay + (by-ay)*t );
        img.set(x, y, color);
    }
}

下面就要解决a->b这么大空隙了，这个问题就是斜率大的线段的采样不足，因为x只走了几步就到了，也就只会画出几个点接下来进行第三次尝试，解决思路就是如果斜率太大，就从y进行for，而不是x，教程中的解决思路十分巧妙，如果斜率太大，就交换x坐标和y坐标，同时绘制时绘制坐标变成$(y,x)$

// 最终版本
void drawLine(int ax, int ay, int bx, int by, TGAImage &framebuffer, TGAColor color) {
    bool steep = std::abs(ax-bx) < std::abs(ay-by);
    if (steep) { // if the drawLine is steep, we transpose the image
        std::swap(ax, ay);
        std::swap(bx, by);
    }
    if (ax>bx) { // make it left−to−right
        std::swap(ax, bx);
        std::swap(ay, by);
    }
    int y = ay;
    int ierror = 0;
    for (int x=ax; x<=bx; x++) {
        if (steep) // if transposed, de−transpose
            framebuffer.set(y, x, color);
        else
            framebuffer.set(x, y, color);
        ierror += 2 * std::abs(by-ay);
        y += (by > ay ? 1 : -1) * (ierror > bx - ax);
        ierror -= 2 * (bx-ax)   * (ierror > bx - ax);
    }
}

至此就完成了比较好的效果的直线绘制，第四次尝试是如何优化算法的运行速度，这里就不说了，直接上他最终的优化代码作为后续使用，但是走样（锯齿）问题没有解决，这里不详细说，后边课程肯定会涉及到。

Lesson 2: Triangle rasterization 三角形光栅化

本节课目的是画一个实心的三角形（上节课只画了边）首先提供一个画线框三角形的代码

constexpr int width  = 128;
constexpr int height = 128;
// 绘制一个三角形
void drawTriangle(int ax, int ay, int bx, int by, int cx, int cy, TGAImage &framebuffer, TGAColor color) {
    drawLine(ax, ay, bx, by, framebuffer, color);
    drawLine(bx, by, cx, cy, framebuffer, color);
    drawLine(cx, cy, ax, ay, framebuffer, color);
}
// 绘制三个三角形进行测试
int main(int argc, char** argv) {
    TGAImage framebuffer(width, height, TGAImage::RGB);
    drawTriangle(  7, 45, 35, 100, 45,  60, framebuffer, red);
    drawTriangle(120, 35, 90,   5, 45, 110, framebuffer, white);
    drawTriangle(115, 83, 80,  90, 85, 120, framebuffer, green);
    framebuffer.write_tga_file("framebuffer.tga");
    return 0;
}

填充三角形需要做的事情：

它应该简单快捷
它应该是对称的 —— 输出不应该依赖于传递给函数的顶点顺序
如果两个三角形共享两个顶点，由于光栅化舍入误差，它们之间不应该有间隙

Scanline rendering 线性扫描

这块不是很想实现，因为学过games101后，已经知道更好的方法是什么了😂，这里参考别的博客看看原理是啥吧。

https://blog.csdn.net/qq_42987967/article/details/124831459

思路就是先对顶点y坐标进行排序，并从中间顶点水平切一刀，这样扫描时比例变化是正常的不会突然反向，交点A沿t0到t2的主斜边移动，B沿t0到t1的侧边移动，移动过程中填充内部的像素

void triangle(Vec2i t0, Vec2i t1, Vec2i t2, TGAImage &image, TGAColor color) { 
    // sort the vertices, t0, t1, t2 lower−to−upper (bubblesort yay!) 
    if (t0.y>t1.y) std::swap(t0, t1); 
    if (t0.y>t2.y) std::swap(t0, t2); 
    if (t1.y>t2.y) std::swap(t1, t2); 
    int total_height = t2.y-t0.y; 
    for (int y=t0.y; y<=t1.y; y++) { 
        int segment_height = t1.y-t0.y+1; 
        float alpha = (float)(y-t0.y)/total_height; 
        float beta  = (float)(y-t0.y)/segment_height; // be careful with divisions by zero 
        Vec2i A = t0 + (t2-t0)*alpha; 
        Vec2i B = t0 + (t1-t0)*beta; 
        if (A.x>B.x) std::swap(A, B); 
        for (int j=A.x; j<=B.x; j++) { 
            image.set(j, y, color); // attention, due to int casts t0.y+i != A.y 
        } 
    } 
    for (int y=t1.y; y<=t2.y; y++) { 
        int segment_height =  t2.y-t1.y+1; 
        float alpha = (float)(y-t0.y)/total_height; 
        float beta  = (float)(y-t1.y)/segment_height; // be careful with divisions by zero 
        Vec2i A = t0 + (t2-t0)*alpha; 
        Vec2i B = t1 + (t2-t1)*beta; 
        if (A.x>B.x) std::swap(A, B); 
        for (int j=A.x; j<=B.x; j++) { 
            image.set(j, y, color); // attention, due to int casts t0.y+i != A.y 
        } 
    } 
}

Modern rasterization approach 现代栅格化方法

基本思路就是用包围盒围住三角形，减少需要遍历的三角形数量，之后遍历盒子中每个像素，判断是否在三角形内部，伪代码如下

triangle(vec2 points[3]) {
    vec2 bbox[2] = find_bounding_box(points);
    for (each pixel in the bounding box) {
        if (inside(points, pixel)) {
            put_pixel(pixel);
        }
    }
}

首先是包围盒的建立，其实就找三个顶点的最大值和最小值，就能画出一个围住三角形最小的矩形

    int bbminx = std::min(std::min(ax, bx), cx); // bounding box for the triangle
    int bbminy = std::min(std::min(ay, by), cy); // defined by its top left and bottom right corners
    int bbmaxx = std::max(std::max(ax, bx), cx);
    int bbmaxy = std::max(std::max(ay, by), cy);

之后就是剔除不在三角形内部的像素，在games101提供的方法是用像素坐标叉乘三条边顺序组成的向量，如果叉乘结果都在一个方向，那这个像素点就在三角形内部，在这个教程中并不是这样做的，它是利用重心坐标，计算出一个点对于这个三角形的重心坐标$(\alpha,\beta,\gamma)$，只要有一个是负数，就表示不再三角形内，那就用他这种方法吧。重心坐标反映的是划分为三个小三角形的面积比，如果点在三角形外，那面积算出来就成负数了。首先提供一个算三角形面积的函数

1
2
3

double signed_triangle_area(int ax, int ay, int bx, int by, int cx, int cy) {
    return .5*((by-ay)*(bx+ax) + (cy-by)*(cx+bx) + (ay-cy)*(ax+cx));
}

下来就可以用面积比来求重心坐标了

#pragma omp parallel for
    for (int x=bbminx; x<=bbmaxx; x++) {
        for (int y=bbminy; y<=bbmaxy; y++) {
            double alpha = signed_triangle_area(x, y, bx, by, cx, cy) / total_area;
            double beta  = signed_triangle_area(x, y, cx, cy, ax, ay) / total_area;
            double gamma = signed_triangle_area(x, y, ax, ay, bx, by) / total_area;
            if (alpha<0 || beta<0 || gamma<0) continue; // negative barycentric coordinate => the pixel is outside the triangle
            framebuffer.set(x, y, color);
        }
    }
}

#pragma omp parallel for是OpenMP中的一个指令，用于并行化for循环。OpenMP是一种并行编程模型，可以在支持OpenMP的编译器上使用最终的三角形绘制如下

// 绘制一个三角形
void drawTriangle(int ax, int ay, int bx, int by, int cx, int cy, TGAImage &framebuffer, TGAColor color) {
    int bbminx = std::min(std::min(ax, bx), cx); // bounding box for the triangle
    int bbminy = std::min(std::min(ay, by), cy); // defined by its top left and bottom right corners
    int bbmaxx = std::max(std::max(ax, bx), cx);
    int bbmaxy = std::max(std::max(ay, by), cy);
    double total_area = signed_triangle_area(ax, ay, bx, by, cx, cy);

#pragma omp parallel for
    for (int x=bbminx; x<=bbmaxx; x++) {
        for (int y=bbminy; y<=bbmaxy; y++) {
            double alpha = signed_triangle_area(x, y, bx, by, cx, cy) / total_area;
            double beta  = signed_triangle_area(x, y, cx, cy, ax, ay) / total_area;
            double gamma = signed_triangle_area(x, y, ax, ay, bx, by) / total_area;
            if (alpha<0 || beta<0 || gamma<0) continue; // negative barycentric coordinate => the pixel is outside the triangle
            framebuffer.set(x, y, color);
        }
    }
}

back-face culling 背面剔除

一般来说法线背对相机或光线方向的平面可认为是没用的，可以不用绘制将其剔除以减少运算量。原理是如果正面的三角形都是顺时针，那背面的都是逆时针，另外一种方法是计算三角形法向量与摄像机的点乘，小于0说明它是背对的。在第2课中使用的是计算三角形的面积，下面这个代码是带符号的，所以负的面积说明三角形是背对的。

1
2
3

double signed_triangle_area(int ax, int ay, int bx, int by, int cx, int cy) {
    return .5*((by-ay)*(bx+ax) + (cy-by)*(cx+bx) + (ay-cy)*(ax+cx));
}

在这里引入向量和模型导入的函数 vector.h

生成下图，可以看出来把所有三角形全画出来，脸部轮廓都不见了修改三角形绘制函数，如果计算出来的三角形面积是负数，就直接不绘制了，这里设置小于1，是把面积太小的三角形直接省略了

void drawTriangle(int ax, int ay, int bx, int by, int cx, int cy, TGAImage &framebuffer, TGAColor color) {
    int bbminx = std::min(std::min(ax, bx), cx);
    int bbminy = std::min(std::min(ay, by), cy);
    int bbmaxx = std::max(std::max(ax, bx), cx);
    int bbmaxy = std::max(std::max(ay, by), cy);
    double total_area = signed_triangle_area(ax, ay, bx, by, cx, cy);
    if (total_area<1) return;

#pragma omp parallel for
    for (int x=bbminx; x<=bbmaxx; x++) {
        for (int y=bbminy; y<=bbmaxy; y++) {
            double alpha = signed_triangle_area(x, y, bx, by, cx, cy) / total_area;
            double beta  = signed_triangle_area(x, y, cx, cy, ax, ay) / total_area;
            double gamma = signed_triangle_area(x, y, ax, ay, bx, by) / total_area;
            if (alpha<0 || beta<0 || gamma<0) continue;
            framebuffer.set(x, y, color);
        }
    }
}

修改后明显可以看出脸部轮廓出来了

使用2k分辨率，效果更好了

Lesson 3: Hidden faces removal (z buffer)

首先介绍一下代码变动模型获取使用开源库

//
// Created by LEI XU on 4/28/19.
//
//
// This loader is created by Robert Smith.
// https://github.com/Bly7/OBJ-Loader
// Use the MIT license.


#ifndef RASTERIZER_OBJ_LOADER_H
#define RASTERIZER_OBJ_LOADER_H

#pragma once


#include <iostream>
#include <vector>
#include <string>
#include <fstream>
#include <math.h>

// Print progress to console while loading (large models)
#define OBJL_CONSOLE_OUTPUT

// Namespace: OBJL
//
// Description: The namespace that holds eveyrthing that
//	is needed and used for the OBJ Model Loader
namespace objl
{
    // Structure: Vector2
    //
    // Description: A 2D Vector that Holds Positional Data
    struct Vector2
    {
        // Default Constructor
        Vector2()
        {
            X = 0.0f;
            Y = 0.0f;
        }
        // Variable Set Constructor
        Vector2(float X_, float Y_)
        {
            X = X_;
            Y = Y_;
        }
        // Bool Equals Operator Overload
        bool operator==(const Vector2& other) const
        {
            return (this->X == other.X && this->Y == other.Y);
        }
        // Bool Not Equals Operator Overload
        bool operator!=(const Vector2& other) const
        {
            return !(this->X == other.X && this->Y == other.Y);
        }
        // Addition Operator Overload
        Vector2 operator+(const Vector2& right) const
        {
            return Vector2(this->X + right.X, this->Y + right.Y);
        }
        // Subtraction Operator Overload
        Vector2 operator-(const Vector2& right) const
        {
            return Vector2(this->X - right.X, this->Y - right.Y);
        }
        // Float Multiplication Operator Overload
        Vector2 operator*(const float& other) const
        {
            return Vector2(this->X *other, this->Y * other);
        }

        // Positional Variables
        float X;
        float Y;
    };

    // Structure: Vector3
    //
    // Description: A 3D Vector that Holds Positional Data
    struct Vector3
    {
        // Default Constructor
        Vector3()
        {
            X = 0.0f;
            Y = 0.0f;
            Z = 0.0f;
        }
        // Variable Set Constructor
        Vector3(float X_, float Y_, float Z_)
        {
            X = X_;
            Y = Y_;
            Z = Z_;
        }
        // Bool Equals Operator Overload
        bool operator==(const Vector3& other) const
        {
            return (this->X == other.X && this->Y == other.Y && this->Z == other.Z);
        }
        // Bool Not Equals Operator Overload
        bool operator!=(const Vector3& other) const
        {
            return !(this->X == other.X && this->Y == other.Y && this->Z == other.Z);
        }
        // Addition Operator Overload
        Vector3 operator+(const Vector3& right) const
        {
            return Vector3(this->X + right.X, this->Y + right.Y, this->Z + right.Z);
        }
        // Subtraction Operator Overload
        Vector3 operator-(const Vector3& right) const
        {
            return Vector3(this->X - right.X, this->Y - right.Y, this->Z - right.Z);
        }
        // Float Multiplication Operator Overload
        Vector3 operator*(const float& other) const
        {
            return Vector3(this->X * other, this->Y * other, this->Z * other);
        }
        // Float Division Operator Overload
        Vector3 operator/(const float& other) const
        {
            return Vector3(this->X / other, this->Y / other, this->Z / other);
        }

        // Positional Variables
        float X;
        float Y;
        float Z;
    };

    // Structure: Vertex
    //
    // Description: Model Vertex object that holds
    //	a Position, Normal, and Texture Coordinate
    struct Vertex
    {
        // Position Vector
        Vector3 Position;

        // Normal Vector
        Vector3 Normal;

        // Texture Coordinate Vector
        Vector2 TextureCoordinate;
    };

    struct Material
    {
        Material()
        {
            name;
            Ns = 0.0f;
            Ni = 0.0f;
            d = 0.0f;
            illum = 0;
        }

        // Material Name
        std::string name;
        // Ambient Color
        Vector3 Ka;
        // Diffuse Color
        Vector3 Kd;
        // Specular Color
        Vector3 Ks;
        // Specular Exponent
        float Ns;
        // Optical Density
        float Ni;
        // Dissolve
        float d;
        // Illumination
        int illum;
        // Ambient Texture Map
        std::string map_Ka;
        // Diffuse Texture Map
        std::string map_Kd;
        // Specular Texture Map
        std::string map_Ks;
        // Specular Hightlight Map
        std::string map_Ns;
        // Alpha Texture Map
        std::string map_d;
        // Bump Map
        std::string map_bump;
    };

    // Structure: Mesh
    //
    // Description: A Simple Mesh Object that holds
    //	a name, a vertex list, and an index list
    struct Mesh
    {
        // Default Constructor
        Mesh()
        {

        }
        // Variable Set Constructor
        Mesh(std::vector<Vertex>& _Vertices, std::vector<unsigned int>& _Indices)
        {
            Vertices = _Vertices;
            Indices = _Indices;
        }
        // Mesh Name
        std::string MeshName;
        // Vertex List
        std::vector<Vertex> Vertices;
        // Index List
        std::vector<unsigned int> Indices;

        // Material
        Material MeshMaterial;
    };

    // Namespace: Math
    //
    // Description: The namespace that holds all of the math
    //	functions need for OBJL
    namespace math
    {
        // Vector3 Cross Product
        Vector3 CrossV3(const Vector3 a, const Vector3 b)
        {
            return Vector3(a.Y * b.Z - a.Z * b.Y,
                           a.Z * b.X - a.X * b.Z,
                           a.X * b.Y - a.Y * b.X);
        }

        // Vector3 Magnitude Calculation
        float MagnitudeV3(const Vector3 in)
        {
            return (sqrtf(powf(in.X, 2) + powf(in.Y, 2) + powf(in.Z, 2)));
        }

        // Vector3 DotProduct
        float DotV3(const Vector3 a, const Vector3 b)
        {
            return (a.X * b.X) + (a.Y * b.Y) + (a.Z * b.Z);
        }

        // Angle between 2 Vector3 Objects
        float AngleBetweenV3(const Vector3 a, const Vector3 b)
        {
            float angle = DotV3(a, b);
            angle /= (MagnitudeV3(a) * MagnitudeV3(b));
            return angle = acosf(angle);
        }

        // Projection Calculation of a onto b
        Vector3 ProjV3(const Vector3 a, const Vector3 b)
        {
            Vector3 bn = b / MagnitudeV3(b);
            return bn * DotV3(a, bn);
        }
    }

    // Namespace: Algorithm
    //
    // Description: The namespace that holds all of the
    // Algorithms needed for OBJL
    namespace algorithm
    {
        // Vector3 Multiplication Opertor Overload
        Vector3 operator*(const float& left, const Vector3& right)
        {
            return Vector3(right.X * left, right.Y * left, right.Z * left);
        }

        // A test to see if P1 is on the same side as P2 of a line segment ab
        bool SameSide(Vector3 p1, Vector3 p2, Vector3 a, Vector3 b)
        {
            Vector3 cp1 = math::CrossV3(b - a, p1 - a);
            Vector3 cp2 = math::CrossV3(b - a, p2 - a);

            if (math::DotV3(cp1, cp2) >= 0)
                return true;
            else
                return false;
        }

        // Generate a cross produect normal for a triangle
        Vector3 GenTriNormal(Vector3 t1, Vector3 t2, Vector3 t3)
        {
            Vector3 u = t2 - t1;
            Vector3 v = t3 - t1;

            Vector3 normal = math::CrossV3(u,v);

            return normal;
        }

        // Check to see if a Vector3 Point is within a 3 Vector3 Triangle
        bool inTriangle(Vector3 point, Vector3 tri1, Vector3 tri2, Vector3 tri3)
        {
            // Test to see if it is within an infinite prism that the triangle outlines.
            bool within_tri_prisim = SameSide(point, tri1, tri2, tri3) && SameSide(point, tri2, tri1, tri3)
                                     && SameSide(point, tri3, tri1, tri2);

            // If it isn't it will never be on the triangle
            if (!within_tri_prisim)
                return false;

            // Calulate Triangle's Normal
            Vector3 n = GenTriNormal(tri1, tri2, tri3);

            // Project the point onto this normal
            Vector3 proj = math::ProjV3(point, n);

            // If the distance from the triangle to the point is 0
            //	it lies on the triangle
            if (math::MagnitudeV3(proj) == 0)
                return true;
            else
                return false;
        }

        // Split a String into a string array at a given token
        inline void split(const std::string &in,
                          std::vector<std::string> &out,
                          std::string token)
        {
            out.clear();

            std::string temp;

            for (int i = 0; i < int(in.size()); i++)
            {
                std::string test = in.substr(i, token.size());

                if (test == token)
                {
                    if (!temp.empty())
                    {
                        out.push_back(temp);
                        temp.clear();
                        i += (int)token.size() - 1;
                    }
                    else
                    {
                        out.push_back("");
                    }
                }
                else if (i + token.size() >= in.size())
                {
                    temp += in.substr(i, token.size());
                    out.push_back(temp);
                    break;
                }
                else
                {
                    temp += in[i];
                }
            }
        }

        // Get tail of string after first token and possibly following spaces
        inline std::string tail(const std::string &in)
        {
            size_t token_start = in.find_first_not_of(" \t");
            size_t space_start = in.find_first_of(" \t", token_start);
            size_t tail_start = in.find_first_not_of(" \t", space_start);
            size_t tail_end = in.find_last_not_of(" \t");
            if (tail_start != std::string::npos && tail_end != std::string::npos)
            {
                return in.substr(tail_start, tail_end - tail_start + 1);
            }
            else if (tail_start != std::string::npos)
            {
                return in.substr(tail_start);
            }
            return "";
        }

        // Get first token of string
        inline std::string firstToken(const std::string &in)
        {
            if (!in.empty())
            {
                size_t token_start = in.find_first_not_of(" \t");
                size_t token_end = in.find_first_of(" \t", token_start);
                if (token_start != std::string::npos && token_end != std::string::npos)
                {
                    return in.substr(token_start, token_end - token_start);
                }
                else if (token_start != std::string::npos)
                {
                    return in.substr(token_start);
                }
            }
            return "";
        }

        // Get element at given index position
        template <class T>
        inline const T & getElement(const std::vector<T> &elements, std::string &index)
        {
            int idx = std::stoi(index);
            if (idx < 0)
                idx = int(elements.size()) + idx;
            else
                idx--;
            return elements[idx];
        }
    }

    // Class: Loader
    //
    // Description: The OBJ Model Loader
    class Loader
    {
    public:
        // Default Constructor
        Loader()
        {

        }
        ~Loader()
        {
            LoadedMeshes.clear();
        }

        // Load a file into the loader
        //
        // If file is loaded return true
        //
        // If the file is unable to be found
        // or unable to be loaded return false
        bool LoadFile(std::string Path)
        {
            // If the file is not an .obj file return false
            if (Path.substr(Path.size() - 4, 4) != ".obj")
                return false;


            std::ifstream file(Path);

            if (!file.is_open())
                return false;

            LoadedMeshes.clear();
            LoadedVertices.clear();
            LoadedIndices.clear();

            std::vector<Vector3> Positions;
            std::vector<Vector2> TCoords;
            std::vector<Vector3> Normals;

            std::vector<Vertex> Vertices;
            std::vector<unsigned int> Indices;

            std::vector<std::string> MeshMatNames;

            bool listening = false;
            std::string meshname;

            Mesh tempMesh;

#ifdef OBJL_CONSOLE_OUTPUT
            const unsigned int outputEveryNth = 1000;
            unsigned int outputIndicator = outputEveryNth;
#endif

            std::string curline;
            while (std::getline(file, curline))
            {
#ifdef OBJL_CONSOLE_OUTPUT
                if ((outputIndicator = ((outputIndicator + 1) % outputEveryNth)) == 1)
                {
                    if (!meshname.empty())
                    {
                        std::cout
                                << "\r- " << meshname
                                << "\t| vertices > " << Positions.size()
                                << "\t| texcoords > " << TCoords.size()
                                << "\t| normals > " << Normals.size()
                                << "\t| triangles > " << (Vertices.size() / 3)
                                << (!MeshMatNames.empty() ? "\t| material: " + MeshMatNames.back() : "");
                    }
                }
#endif

                // Generate a Mesh Object or Prepare for an object to be created
                if (algorithm::firstToken(curline) == "o" || algorithm::firstToken(curline) == "g" || curline[0] == 'g')
                {
                    if (!listening)
                    {
                        listening = true;

                        if (algorithm::firstToken(curline) == "o" || algorithm::firstToken(curline) == "g")
                        {
                            meshname = algorithm::tail(curline);
                        }
                        else
                        {
                            meshname = "unnamed";
                        }
                    }
                    else
                    {
                        // Generate the mesh to put into the array

                        if (!Indices.empty() && !Vertices.empty())
                        {
                            // Create Mesh
                            tempMesh = Mesh(Vertices, Indices);
                            tempMesh.MeshName = meshname;

                            // Insert Mesh
                            LoadedMeshes.push_back(tempMesh);

                            // Cleanup
                            Vertices.clear();
                            Indices.clear();
                            meshname.clear();

                            meshname = algorithm::tail(curline);
                        }
                        else
                        {
                            if (algorithm::firstToken(curline) == "o" || algorithm::firstToken(curline) == "g")
                            {
                                meshname = algorithm::tail(curline);
                            }
                            else
                            {
                                meshname = "unnamed";
                            }
                        }
                    }
#ifdef OBJL_CONSOLE_OUTPUT
                    std::cout << std::endl;
                    outputIndicator = 0;
#endif
                }
                // Generate a Vertex Position
                if (algorithm::firstToken(curline) == "v")
                {
                    std::vector<std::string> spos;
                    Vector3 vpos;
                    algorithm::split(algorithm::tail(curline), spos, " ");

                    vpos.X = std::stof(spos[0]);
                    vpos.Y = std::stof(spos[1]);
                    vpos.Z = std::stof(spos[2]);

                    Positions.push_back(vpos);
                }
                // Generate a Vertex Texture Coordinate
                if (algorithm::firstToken(curline) == "vt")
                {
                    std::vector<std::string> stex;
                    Vector2 vtex;
                    algorithm::split(algorithm::tail(curline), stex, " ");

                    vtex.X = std::stof(stex[0]);
                    vtex.Y = std::stof(stex[1]);

                    TCoords.push_back(vtex);
                }
                // Generate a Vertex Normal;
                if (algorithm::firstToken(curline) == "vn")
                {
                    std::vector<std::string> snor;
                    Vector3 vnor;
                    algorithm::split(algorithm::tail(curline), snor, " ");

                    vnor.X = std::stof(snor[0]);
                    vnor.Y = std::stof(snor[1]);
                    vnor.Z = std::stof(snor[2]);

                    Normals.push_back(vnor);
                }
                // Generate a Face (vertices & indices)
                if (algorithm::firstToken(curline) == "f")
                {
                    // Generate the vertices
                    std::vector<Vertex> vVerts;
                    GenVerticesFromRawOBJ(vVerts, Positions, TCoords, Normals, curline);

                    // Add Vertices
                    for (int i = 0; i < int(vVerts.size()); i++)
                    {
                        Vertices.push_back(vVerts[i]);

                        LoadedVertices.push_back(vVerts[i]);
                    }

                    std::vector<unsigned int> iIndices;

                    VertexTriangluation(iIndices, vVerts);

                    // Add Indices
                    for (int i = 0; i < int(iIndices.size()); i++)
                    {
                        unsigned int indnum = (unsigned int)((Vertices.size()) - vVerts.size()) + iIndices[i];
                        Indices.push_back(indnum);

                        indnum = (unsigned int)((LoadedVertices.size()) - vVerts.size()) + iIndices[i];
                        LoadedIndices.push_back(indnum);

                    }
                }
                // Get Mesh Material Name
                if (algorithm::firstToken(curline) == "usemtl")
                {
                    MeshMatNames.push_back(algorithm::tail(curline));

                    // Create new Mesh, if Material changes within a group
                    if (!Indices.empty() && !Vertices.empty())
                    {
                        // Create Mesh
                        tempMesh = Mesh(Vertices, Indices);
                        tempMesh.MeshName = meshname;
                        int i = 2;
                        while(1) {
                            tempMesh.MeshName = meshname + "_" + std::to_string(i);

                            for (auto &m : LoadedMeshes)
                                if (m.MeshName == tempMesh.MeshName)
                                    continue;
                            break;
                        }

                        // Insert Mesh
                        LoadedMeshes.push_back(tempMesh);

                        // Cleanup
                        Vertices.clear();
                        Indices.clear();
                    }

#ifdef OBJL_CONSOLE_OUTPUT
                    outputIndicator = 0;
#endif
                }
                // Load Materials
                if (algorithm::firstToken(curline) == "mtllib")
                {
                    // Generate LoadedMaterial

                    // Generate a path to the material file
                    std::vector<std::string> temp;
                    algorithm::split(Path, temp, "/");

                    std::string pathtomat = "";

                    if (temp.size() != 1)
                    {
                        for (int i = 0; i < temp.size() - 1; i++)
                        {
                            pathtomat += temp[i] + "/";
                        }
                    }


                    pathtomat += algorithm::tail(curline);

#ifdef OBJL_CONSOLE_OUTPUT
                    std::cout << std::endl << "- find materials in: " << pathtomat << std::endl;
#endif

                    // Load Materials
                    LoadMaterials(pathtomat);
                }
            }

#ifdef OBJL_CONSOLE_OUTPUT
            std::cout << std::endl;
#endif

            // Deal with last mesh

            if (!Indices.empty() && !Vertices.empty())
            {
                // Create Mesh
                tempMesh = Mesh(Vertices, Indices);
                tempMesh.MeshName = meshname;

                // Insert Mesh
                LoadedMeshes.push_back(tempMesh);
            }

            file.close();

            // Set Materials for each Mesh
            for (int i = 0; i < MeshMatNames.size(); i++)
            {
                std::string matname = MeshMatNames[i];

                // Find corresponding material name in loaded materials
                // when found copy material variables into mesh material
                for (int j = 0; j < LoadedMaterials.size(); j++)
                {
                    if (LoadedMaterials[j].name == matname)
                    {
                        LoadedMeshes[i].MeshMaterial = LoadedMaterials[j];
                        break;
                    }
                }
            }

            if (LoadedMeshes.empty() && LoadedVertices.empty() && LoadedIndices.empty())
            {
                return false;
            }
            else
            {
                return true;
            }
        }

        // Loaded Mesh Objects
        std::vector<Mesh> LoadedMeshes;
        // Loaded Vertex Objects
        std::vector<Vertex> LoadedVertices;
        // Loaded Index Positions
        std::vector<unsigned int> LoadedIndices;
        // Loaded Material Objects
        std::vector<Material> LoadedMaterials;

    private:
        // Generate vertices from a list of positions,
        //	tcoords, normals and a face line
        void GenVerticesFromRawOBJ(std::vector<Vertex>& oVerts,
                                   const std::vector<Vector3>& iPositions,
                                   const std::vector<Vector2>& iTCoords,
                                   const std::vector<Vector3>& iNormals,
                                   std::string icurline)
        {
            std::vector<std::string> sface, svert;
            Vertex vVert;
            algorithm::split(algorithm::tail(icurline), sface, " ");

            bool noNormal = false;

            // For every given vertex do this
            for (int i = 0; i < int(sface.size()); i++)
            {
                // See What type the vertex is.
                int vtype;

                algorithm::split(sface[i], svert, "/");

                // Check for just position - v1
                if (svert.size() == 1)
                {
                    // Only position
                    vtype = 1;
                }

                // Check for position & texture - v1/vt1
                if (svert.size() == 2)
                {
                    // Position & Texture
                    vtype = 2;
                }

                // Check for Position, Texture and Normal - v1/vt1/vn1
                // or if Position and Normal - v1//vn1
                if (svert.size() == 3)
                {
                    if (svert[1] != "")
                    {
                        // Position, Texture, and Normal
                        vtype = 4;
                    }
                    else
                    {
                        // Position & Normal
                        vtype = 3;
                    }
                }

                // Calculate and store the vertex
                switch (vtype)
                {
                    case 1: // P
                    {
                        vVert.Position = algorithm::getElement(iPositions, svert[0]);
                        vVert.TextureCoordinate = Vector2(0, 0);
                        noNormal = true;
                        oVerts.push_back(vVert);
                        break;
                    }
                    case 2: // P/T
                    {
                        vVert.Position = algorithm::getElement(iPositions, svert[0]);
                        vVert.TextureCoordinate = algorithm::getElement(iTCoords, svert[1]);
                        noNormal = true;
                        oVerts.push_back(vVert);
                        break;
                    }
                    case 3: // P//N
                    {
                        vVert.Position = algorithm::getElement(iPositions, svert[0]);
                        vVert.TextureCoordinate = Vector2(0, 0);
                        vVert.Normal = algorithm::getElement(iNormals, svert[2]);
                        oVerts.push_back(vVert);
                        break;
                    }
                    case 4: // P/T/N
                    {
                        vVert.Position = algorithm::getElement(iPositions, svert[0]);
                        vVert.TextureCoordinate = algorithm::getElement(iTCoords, svert[1]);
                        vVert.Normal = algorithm::getElement(iNormals, svert[2]);
                        oVerts.push_back(vVert);
                        break;
                    }
                    default:
                    {
                        break;
                    }
                }
            }

            // take care of missing normals
            // these may not be truly acurate but it is the
            // best they get for not compiling a mesh with normals
            if (noNormal)
            {
                Vector3 A = oVerts[0].Position - oVerts[1].Position;
                Vector3 B = oVerts[2].Position - oVerts[1].Position;

                Vector3 normal = math::CrossV3(A, B);

                for (int i = 0; i < int(oVerts.size()); i++)
                {
                    oVerts[i].Normal = normal;
                }
            }
        }

        // Triangulate a list of vertices into a face by printing
        //	inducies corresponding with triangles within it
        void VertexTriangluation(std::vector<unsigned int>& oIndices,
                                 const std::vector<Vertex>& iVerts)
        {
            // If there are 2 or less verts,
            // no triangle can be created,
            // so exit
            if (iVerts.size() < 3)
            {
                return;
            }
            // If it is a triangle no need to calculate it
            if (iVerts.size() == 3)
            {
                oIndices.push_back(0);
                oIndices.push_back(1);
                oIndices.push_back(2);
                return;
            }

            // Create a list of vertices
            std::vector<Vertex> tVerts = iVerts;

            while (true)
            {
                // For every vertex
                for (int i = 0; i < int(tVerts.size()); i++)
                {
                    // pPrev = the previous vertex in the list
                    Vertex pPrev;
                    if (i == 0)
                    {
                        pPrev = tVerts[tVerts.size() - 1];
                    }
                    else
                    {
                        pPrev = tVerts[i - 1];
                    }

                    // pCur = the current vertex;
                    Vertex pCur = tVerts[i];

                    // pNext = the next vertex in the list
                    Vertex pNext;
                    if (i == tVerts.size() - 1)
                    {
                        pNext = tVerts[0];
                    }
                    else
                    {
                        pNext = tVerts[i + 1];
                    }

                    // Check to see if there are only 3 verts left
                    // if so this is the last triangle
                    if (tVerts.size() == 3)
                    {
                        // Create a triangle from pCur, pPrev, pNext
                        for (int j = 0; j < int(tVerts.size()); j++)
                        {
                            if (iVerts[j].Position == pCur.Position)
                                oIndices.push_back(j);
                            if (iVerts[j].Position == pPrev.Position)
                                oIndices.push_back(j);
                            if (iVerts[j].Position == pNext.Position)
                                oIndices.push_back(j);
                        }

                        tVerts.clear();
                        break;
                    }
                    if (tVerts.size() == 4)
                    {
                        // Create a triangle from pCur, pPrev, pNext
                        for (int j = 0; j < int(iVerts.size()); j++)
                        {
                            if (iVerts[j].Position == pCur.Position)
                                oIndices.push_back(j);
                            if (iVerts[j].Position == pPrev.Position)
                                oIndices.push_back(j);
                            if (iVerts[j].Position == pNext.Position)
                                oIndices.push_back(j);
                        }

                        Vector3 tempVec;
                        for (int j = 0; j < int(tVerts.size()); j++)
                        {
                            if (tVerts[j].Position != pCur.Position
                                && tVerts[j].Position != pPrev.Position
                                && tVerts[j].Position != pNext.Position)
                            {
                                tempVec = tVerts[j].Position;
                                break;
                            }
                        }

                        // Create a triangle from pCur, pPrev, pNext
                        for (int j = 0; j < int(iVerts.size()); j++)
                        {
                            if (iVerts[j].Position == pPrev.Position)
                                oIndices.push_back(j);
                            if (iVerts[j].Position == pNext.Position)
                                oIndices.push_back(j);
                            if (iVerts[j].Position == tempVec)
                                oIndices.push_back(j);
                        }

                        tVerts.clear();
                        break;
                    }

                    // If Vertex is not an interior vertex
                    float angle = math::AngleBetweenV3(pPrev.Position - pCur.Position, pNext.Position - pCur.Position) * (180 / 3.14159265359);
                    if (angle <= 0 && angle >= 180)
                        continue;

                    // If any vertices are within this triangle
                    bool inTri = false;
                    for (int j = 0; j < int(iVerts.size()); j++)
                    {
                        if (algorithm::inTriangle(iVerts[j].Position, pPrev.Position, pCur.Position, pNext.Position)
                            && iVerts[j].Position != pPrev.Position
                            && iVerts[j].Position != pCur.Position
                            && iVerts[j].Position != pNext.Position)
                        {
                            inTri = true;
                            break;
                        }
                    }
                    if (inTri)
                        continue;

                    // Create a triangle from pCur, pPrev, pNext
                    for (int j = 0; j < int(iVerts.size()); j++)
                    {
                        if (iVerts[j].Position == pCur.Position)
                            oIndices.push_back(j);
                        if (iVerts[j].Position == pPrev.Position)
                            oIndices.push_back(j);
                        if (iVerts[j].Position == pNext.Position)
                            oIndices.push_back(j);
                    }

                    // Delete pCur from the list
                    for (int j = 0; j < int(tVerts.size()); j++)
                    {
                        if (tVerts[j].Position == pCur.Position)
                        {
                            tVerts.erase(tVerts.begin() + j);
                            break;
                        }
                    }

                    // reset i to the start
                    // -1 since loop will add 1 to it
                    i = -1;
                }

                // if no triangles were created
                if (oIndices.size() == 0)
                    break;

                // if no more vertices
                if (tVerts.size() == 0)
                    break;
            }
        }

        // Load Materials from .mtl file
        bool LoadMaterials(std::string path)
        {
            // If the file is not a material file return false
            if (path.substr(path.size() - 4, path.size()) != ".mtl")
                return false;

            std::ifstream file(path);

            // If the file is not found return false
            if (!file.is_open())
                return false;

            Material tempMaterial;

            bool listening = false;

            // Go through each line looking for material variables
            std::string curline;
            while (std::getline(file, curline))
            {
                // new material and material name
                if (algorithm::firstToken(curline) == "newmtl")
                {
                    if (!listening)
                    {
                        listening = true;

                        if (curline.size() > 7)
                        {
                            tempMaterial.name = algorithm::tail(curline);
                        }
                        else
                        {
                            tempMaterial.name = "none";
                        }
                    }
                    else
                    {
                        // Generate the material

                        // Push Back loaded Material
                        LoadedMaterials.push_back(tempMaterial);

                        // Clear Loaded Material
                        tempMaterial = Material();

                        if (curline.size() > 7)
                        {
                            tempMaterial.name = algorithm::tail(curline);
                        }
                        else
                        {
                            tempMaterial.name = "none";
                        }
                    }
                }
                // Ambient Color
                if (algorithm::firstToken(curline) == "Ka")
                {
                    std::vector<std::string> temp;
                    algorithm::split(algorithm::tail(curline), temp, " ");

                    if (temp.size() != 3)
                        continue;

                    tempMaterial.Ka.X = std::stof(temp[0]);
                    tempMaterial.Ka.Y = std::stof(temp[1]);
                    tempMaterial.Ka.Z = std::stof(temp[2]);
                }
                // Diffuse Color
                if (algorithm::firstToken(curline) == "Kd")
                {
                    std::vector<std::string> temp;
                    algorithm::split(algorithm::tail(curline), temp, " ");

                    if (temp.size() != 3)
                        continue;

                    tempMaterial.Kd.X = std::stof(temp[0]);
                    tempMaterial.Kd.Y = std::stof(temp[1]);
                    tempMaterial.Kd.Z = std::stof(temp[2]);
                }
                // Specular Color
                if (algorithm::firstToken(curline) == "Ks")
                {
                    std::vector<std::string> temp;
                    algorithm::split(algorithm::tail(curline), temp, " ");

                    if (temp.size() != 3)
                        continue;

                    tempMaterial.Ks.X = std::stof(temp[0]);
                    tempMaterial.Ks.Y = std::stof(temp[1]);
                    tempMaterial.Ks.Z = std::stof(temp[2]);
                }
                // Specular Exponent
                if (algorithm::firstToken(curline) == "Ns")
                {
                    tempMaterial.Ns = std::stof(algorithm::tail(curline));
                }
                // Optical Density
                if (algorithm::firstToken(curline) == "Ni")
                {
                    tempMaterial.Ni = std::stof(algorithm::tail(curline));
                }
                // Dissolve
                if (algorithm::firstToken(curline) == "d")
                {
                    tempMaterial.d = std::stof(algorithm::tail(curline));
                }
                // Illumination
                if (algorithm::firstToken(curline) == "illum")
                {
                    tempMaterial.illum = std::stoi(algorithm::tail(curline));
                }
                // Ambient Texture Map
                if (algorithm::firstToken(curline) == "map_Ka")
                {
                    tempMaterial.map_Ka = algorithm::tail(curline);
                }
                // Diffuse Texture Map
                if (algorithm::firstToken(curline) == "map_Kd")
                {
                    tempMaterial.map_Kd = algorithm::tail(curline);
                }
                // Specular Texture Map
                if (algorithm::firstToken(curline) == "map_Ks")
                {
                    tempMaterial.map_Ks = algorithm::tail(curline);
                }
                // Specular Hightlight Map
                if (algorithm::firstToken(curline) == "map_Ns")
                {
                    tempMaterial.map_Ns = algorithm::tail(curline);
                }
                // Alpha Texture Map
                if (algorithm::firstToken(curline) == "map_d")
                {
                    tempMaterial.map_d = algorithm::tail(curline);
                }
                // Bump Map
                if (algorithm::firstToken(curline) == "map_Bump" || algorithm::firstToken(curline) == "map_bump" || algorithm::firstToken(curline) == "bump")
                {
                    tempMaterial.map_bump = algorithm::tail(curline);
                }
            }

            // Deal with last material

            // Push Back loaded Material
            LoadedMaterials.push_back(tempMaterial);

            // Test to see if anything was loaded
            // If not return false
            if (LoadedMaterials.empty())
                return false;
                // If so return true
            else
                return true;
        }
    };
}
#endif //RASTERIZER_OBJ_LOADER_H

线性代数使用Eigen库

三角形类

#ifndef TINYRENDERER_TRIANGLE_H
#define TINYRENDERER_TRIANGLE_H
#include <Eigen/Eigen>
using namespace Eigen;
class Triangle{
public:
    Eigen::Vector4f globalCoords[3];
    Eigen::Vector3f color[3];
    Eigen::Vector2f texCoords[3];
    Eigen::Vector3f normal[3];
    Eigen::Vector3f screenCoords[3];
    Triangle();

    void setGlobalCoords(int ind, Eigen::Vector4f ver);
    void setNormal(int ind, Eigen::Vector3f n);
    void setTexCoord(int ind,Eigen::Vector2f uv);
    void setScreenCoord(int ind,int width,int height);
};

#endif //TINYRENDERER_TRIANGLE_H

#include "Triangle.h"

Triangle::Triangle() {
    globalCoords[0] << 0,0,0,1;
    globalCoords[1] << 0,0,0,1;
    globalCoords[2] << 0,0,0,1;

    color[0] << 0.0, 0.0, 0.0;
    color[1] << 0.0, 0.0, 0.0;
    color[2] << 0.0, 0.0, 0.0;

    texCoords[0] << 0.0, 0.0;
    texCoords[1] << 0.0, 0.0;
    texCoords[2] << 0.0, 0.0;
}

void Triangle::setGlobalCoords(int ind, Vector4f ver){
    globalCoords[ind] = ver;
}
void Triangle::setNormal(int ind, Vector3f n){
    normal[ind] = n;
}
void Triangle::setTexCoord(int ind, Vector2f uv) {
    texCoords[ind] = uv;
}
// 简单实现正交投影
Vector3f world2screen(Vector4f globalCoord,int width,int height) {
    return Vector3f(int((globalCoord.x()+1.)*width/2.+.5), int((globalCoord.y()+1.)*height/2.+.5), globalCoord.z());
}
void Triangle::setScreenCoord(int ind,int width,int height) {
    screenCoords[ind] = world2screen(this->globalCoords[ind],width,height);
}

模型类

#ifndef __MODEL_H__
#define __MODEL_H__

#include <vector>
#include <Eigen/Eigen>
#include "Triangle.h"

class Model {
private:
public:
    explicit Model(const char *filename);
    ~Model();
    std::vector<Triangle> triangleList;

};

#endif //__MODEL_H__

#include "model.h"
#include "thirdParty/OBJ_Loader.h"
// 加载模型就直接用教程的代码了！
Model::Model(const char *filename) {
    objl::Loader Loader;
    Loader.LoadFile(filename);
    std::cout << "?";

    for (const auto &mesh: Loader.LoadedMeshes){
        for(int i=0;i<mesh.Vertices.size();i+=3)
        {

            Triangle * t = new Triangle;
            for(int j=0;j<3;j++)
            {
                t->setGlobalCoords(j, Vector4f(mesh.Vertices[i + j].Position.X, mesh.Vertices[i + j].Position.Y,mesh.Vertices[i + j].Position.Z, 1.0));
                t->setNormal(j,Vector3f(mesh.Vertices[i+j].Normal.X,mesh.Vertices[i+j].Normal.Y,mesh.Vertices[i+j].Normal.Z));
                t->setTexCoord(j,Vector2f(mesh.Vertices[i+j].TextureCoordinate.X, mesh.Vertices[i+j].TextureCoordinate.Y));
            }
            this->triangleList.push_back(*t);
        }
    }
}

Model::~Model() {
}

已经告诉了使用zbuffer，其实就是把处于后边的物体就不需要渲染了，在背面剔除后，删掉了不需要处理的三角形，但是在像素层面，位于前面的颜色应该把后边的颜色挡住首先来定义一个zbuffer，我没有使用教程中的一位数组表示，因为我不希望代码理解起来过于复杂

1
2
3

    // 定义一个zbuffer，并设置为无穷小
    std::unique_ptr<std::vector<std::vector<float>>> zBuffer = std::make_unique<std::vector<std::vector<float>>>(width, std::vector<float>(height));
    auto * zBuffer = new std::vector<std::vector<float>>(width, std::vector<float>(std::numeric_limits<float>::lowest()));

在这种情况下，绘制像素前要先判断当前想要绘制的颜色是否被挡住，至于是大于号还是小于号，看如何定义，当前模型是z越大离屏幕越近

	double alpha = signed_triangle_area(x, y, bx, by, cx, cy) / total_area;
	double beta  = signed_triangle_area(x, y, cx, cy, ax, ay) / total_area;
	double gamma = signed_triangle_area(x, y, ax, ay, bx, by) / total_area;
	if (alpha<0 || beta<0 || gamma<0) continue; // 说明当前像素不在三角形内部
	float barycentricZ = alpha*triangle.screenCoords[0].z() + beta*triangle.screenCoords[1].z() + gamma*triangle.screenCoords[2].z();
	// zbuffer中缓存的渲染物体距离小于当前渲染物体的距离时，才覆盖渲染
	if (x<width && y < height && zBuffer->at(x).at(y) < barycentricZ){
	    zBuffer->at(x).at(y) = barycentricZ;
	    framebuffer.set(x,y,color);
	}

当前的整体代码如下

#include "thirdParty/tgaimage.h"
#include "model.h"
#include <vector>
#include <cmath>
#include <iostream>

constexpr TGAColor white   = {255, 255, 255, 255};
constexpr TGAColor green   = {  0, 255,   0, 255};
constexpr TGAColor red     = {  255,   0, 0, 255};
constexpr TGAColor blue    = {255, 128,  64, 255};
constexpr TGAColor yellow  = {  0, 200, 255, 255};
constexpr static int width  = 2560;
constexpr static int height = 1920;
// 画线尝试1
void drawLine_first(int ax, int ay, int bx, int by, TGAImage &img, TGAColor color){
    for(float t = 0;t<=1;t+=0.02){
        int x = std::round(ax + t * (bx - ax)); // round会进行四舍五入
        int y = std::round(ay + t * (by - ay));
        img.set(x,y,color);
    }
}
// 画线尝试2
void drawLine_second(int ax, int ay, int bx, int by, TGAImage &img, TGAColor color){
    if (ax>bx) { // make it left−to−right
        std::swap(ax, bx);
        std::swap(ay, by);
    }
    for (int x = ax ; x<= bx; x++) { // 不再以t控制，而是以x的进行进行控制，保证了水平方向上不会有空隙
        // 如果不加强制转换，当分子分母都是整数时，计算结果的小数部分会被截断
        float t = (x-ax)/static_cast<float>(bx-ax); // 变换了形式，表示出当x移动一格时，t是多少，
        int y = std::round( ay + (by-ay)*t );
        img.set(x, y, color);
    }
}
// 画线尝试3
void drawLine_third(int ax, int ay, int bx, int by, TGAImage &img, TGAColor color){
    bool steep = std::abs(ax-bx) < std::abs(ay-by);
    if (steep) { // if the drawLine is steep, we transpose the image
        std::swap(ax, ay);
        std::swap(bx, by);
    }
    if (ax>bx) { // make it left−to−right
        std::swap(ax, bx);
        std::swap(ay, by);
    }
    for (int x = ax ; x<= bx; x++) { // 不再以t控制，而是以x的进行进行控制，保证了水平方向上不会有空隙
        // 如果不加强制转换，当分子分母都是整数时，计算结果的小数部分会被截断
        float t = (x-ax)/static_cast<float>(bx-ax); // 变换了形式，表示出当x移动一格时，t是多少，
        int y = std::round( ay + (by-ay)*t );
        if (steep) // if transposed, de−transpose
            img.set(y, x, color);
        else
            img.set(x, y, color);
    }
}
// 最终版本 对计算进行了优化
void drawLine(int ax, int ay, int bx, int by, TGAImage &framebuffer, TGAColor color) {
    bool steep = std::abs(ax-bx) < std::abs(ay-by);
    if (steep) { // if the drawLine is steep, we transpose the image
        std::swap(ax, ay);
        std::swap(bx, by);
    }
    if (ax>bx) { // make it left−to−right
        std::swap(ax, bx);
        std::swap(ay, by);
    }
    int y = ay;
    int ierror = 0;
    for (int x=ax; x<=bx; x++) {
        if (steep) // if transposed, de−transpose
            framebuffer.set(y, x, color);
        else
            framebuffer.set(x, y, color);
        ierror += 2 * std::abs(by-ay);
        y += (by > ay ? 1 : -1) * (ierror > bx - ax);
        ierror -= 2 * (bx-ax)   * (ierror > bx - ax);
    }
}
// 三角形面积，可能返回负数，表示背对屏幕
double signed_triangle_area(int ax, int ay, int bx, int by, int cx, int cy) {
    return .5*((by-ay)*(bx+ax) + (cy-by)*(cx+bx) + (ay-cy)*(ax+cx));
}
// 绘制一个三角形
void drawTriangle(Triangle triangle, TGAImage &framebuffer, std::vector<std::vector<float>> * zBuffer,TGAColor color) {
    float ax = triangle.screenCoords[0].x();
    float ay = triangle.screenCoords[0].y();
    float bx = triangle.screenCoords[1].x();
    float by = triangle.screenCoords[1].y();
    float cx = triangle.screenCoords[2].x();
    float cy = triangle.screenCoords[2].y();
    float bbminx = std::min(std::min(ax, bx), cx);
    float bbminy = std::min(std::min(ay, by), cy);
    float bbmaxx = std::max(std::max(ax, bx), cx);
    float bbmaxy = std::max(std::max(ay, by), cy);

    // 如果面积为负数，背对屏幕，被裁剪
    double total_area = signed_triangle_area(ax, ay, bx, by, cx, cy);
    if (total_area<1) return;

#pragma omp parallel for
    for (int x=bbminx; x<=bbmaxx; x++) {
        for (int y=bbminy; y<=bbmaxy; y++) {
            double alpha = signed_triangle_area(x, y, bx, by, cx, cy) / total_area;
            double beta  = signed_triangle_area(x, y, cx, cy, ax, ay) / total_area;
            double gamma = signed_triangle_area(x, y, ax, ay, bx, by) / total_area;
            if (alpha<0 || beta<0 || gamma<0) continue; // 说明当前像素不在三角形内部
            float barycentricZ = alpha*triangle.screenCoords[0].z() + beta*triangle.screenCoords[1].z() + gamma*triangle.screenCoords[2].z();
            // zbuffer中缓存的渲染物体距离小于当前渲染物体的距离时，才覆盖渲染
            if (x<width && y < height && zBuffer->at(x).at(y) < barycentricZ){
                zBuffer->at(x).at(y) = barycentricZ;
                framebuffer.set(x,y,color);
            }
        }
    }
}

int main() {
    auto * model = new Model("./obj/african_head/african_head.obj");
    TGAImage framebuffer(width, height, TGAImage::RGB);
    // 定义一个zBuffer,并设置全部数据为最小负数
    auto * zBuffer = new std::vector<std::vector<float>>(width, std::vector<float>(height,std::numeric_limits<float>::lowest()));
    // 遍历obj文件中的每个三角形
    for (Triangle triangle : model->triangleList) {
        // 将当前三角形的三个顶点都投影到屏幕
        for (int i = 0; i < 3; ++i) triangle.setScreenCoord(i,width,height);
        // 绘制三角形
        drawTriangle(triangle, framebuffer, zBuffer, TGAColor(rand()%255, rand()%255, rand()%255, 255));
    }
//    framebuffer.flip_vertically();
    framebuffer.write_tga_file("framebuffer.tga");
    return 0;
}

下一步就是把材质贴上去，也就是设置颜色时不再使用随机颜色，而是根据三个顶点的纹理坐标进行插值，获得一个像素点的纹理坐标，从纹理图片对应位置获取颜色来设置首先得有一个承载材质的类，我这里使用的是TGAImage来读取图片,并把材质类作为Model的成员

#ifndef TINYRENDERER_TEXTURE_H
#define TINYRENDERER_TEXTURE_H
#include <Eigen/Eigen>
#include "thirdParty/tgaimage.h"
class Texture{
private:
    TGAImage texture;

public:
    Texture(const std::string& name)
    {

        texture.read_tga_file("");
        width = texture.width();
        height = texture.height();
    }

    int width, height;

    TGAColor getColor(float u, float v)
    {
        auto u_img = u * width;
        auto v_img = (1 - v) * height;
        TGAColor color = texture.get(v_img, u_img);
        return color;
    }
};
#endif //TINYRENDERER_TEXTURE_H

在main中首先对uv坐标进行插值，之后在设置像素颜色时，通过插值的uv坐标，到uv图中找对应位置的颜色

            float texU = alpha*triangle.texCoords[0].x() + beta*triangle.texCoords[1].x() + gamma*triangle.texCoords[2].x();
            float texV = alpha*triangle.texCoords[0].y() + beta*triangle.texCoords[1].y() + gamma*triangle.texCoords[2].y();
            // zbuffer中缓存的渲染物体距离小于当前渲染物体的距离时，才覆盖渲染
            if (x<width && y < height && zBuffer->at(x).at(y) < barycentricZ){
                zBuffer->at(x).at(y) = barycentricZ;
                framebuffer.set(x,y,texture.getColor(texU,texV));
            }

生成效果如下图所示到目前为止我自己的实现可以在github的分支结点中找到：https://github.com/sdpyy1/CppLearn/tree/56841b79fe7c74bce1d9210f1a42e2a3ca019768/tinyrenderer

Lesson 4: Perspective projection

这里我不希望只完成他课程的简单情况，我直接把MVP矩阵+视口变换全部封装了，详情可查看我的仓库，下边是主要代码

#include "model.h"
#include "thirdParty/OBJ_Loader.h"
Model::Model(const char * objFileName,const char * texFileName) : texture(texFileName){
    objl::Loader Loader;
    Loader.LoadFile(objFileName);
    this->modelMatrix = Eigen::Matrix4f::Identity();
    this->viewMatrix = Eigen::Matrix4f::Identity();
    this->projectionMatrix = Eigen::Matrix4f::Identity();
    for (const auto &mesh: Loader.LoadedMeshes){
        for(int i=0;i<mesh.Vertices.size();i+=3)
        {
            Triangle t;
            for(int j=0;j<3;j++)
            {
                // 此处设置每个三角形的属性
                t.setGlobalCoord(j, Vector4f(mesh.Vertices[i + j].Position.X, mesh.Vertices[i + j].Position.Y,
                                              mesh.Vertices[i + j].Position.Z, 1.0));
                t.setNormal(j,Vector3f(mesh.Vertices[i+j].Normal.X,mesh.Vertices[i+j].Normal.Y,mesh.Vertices[i+j].Normal.Z));
                t.setTexCoord(j,Vector2f(mesh.Vertices[i+j].TextureCoordinate.X, mesh.Vertices[i+j].TextureCoordinate.Y));
                Matrix4f mvp = projectionMatrix * viewMatrix * modelMatrix;
            }
            this->triangleList.push_back(t);
        }
    }
}
// 将角度转换为弧度
constexpr float deg2rad(float degrees) {
    return degrees * M_PI / 180.0f;
}
// 生成绕 x, y, z 轴旋转的变换矩阵
Eigen::Matrix4f rotation(float angleX, float angleY, float angleZ) {
    // 分别计算绕 x, y, z 轴旋转的矩阵
    Eigen::Matrix4f rotationX = Eigen::Matrix4f::Identity();
    float radX = deg2rad(angleX);
    rotationX(1, 1) = std::cos(radX);
    rotationX(1, 2) = -std::sin(radX);
    rotationX(2, 1) = std::sin(radX);
    rotationX(2, 2) = std::cos(radX);

    Eigen::Matrix4f rotationY = Eigen::Matrix4f::Identity();
    float radY = deg2rad(angleY);
    rotationY(0, 0) = std::cos(radY);
    rotationY(0, 2) = std::sin(radY);
    rotationY(2, 0) = -std::sin(radY);
    rotationY(2, 2) = std::cos(radY);

    Eigen::Matrix4f rotationZ = Eigen::Matrix4f::Identity();
    float radZ = deg2rad(angleZ);
    rotationZ(0, 0) = std::cos(radZ);
    rotationZ(0, 1) = -std::sin(radZ);
    rotationZ(1, 0) = std::sin(radZ);
    rotationZ(1, 1) = std::cos(radZ);

    // 组合三个旋转矩阵，这里假设旋转顺序为 Z -> Y -> X
    Eigen::Matrix4f modelMatrix = rotationX * rotationY * rotationZ;
    return modelMatrix;
}
// 生成平移变换矩阵
Eigen::Matrix4f translation(float tx, float ty, float tz) {
    Eigen::Matrix4f translationMatrix = Eigen::Matrix4f::Identity();
    translationMatrix(0, 3) = tx;
    translationMatrix(1, 3) = ty;
    translationMatrix(2, 3) = tz;
    return translationMatrix;
}
// 生成缩放变换矩阵
Eigen::Matrix4f scaling(float sx, float sy, float sz) {
    Eigen::Matrix4f scalingMatrix = Eigen::Matrix4f::Identity();
    scalingMatrix(0, 0) = sx;
    scalingMatrix(1, 1) = sy;
    scalingMatrix(2, 2) = sz;
    return scalingMatrix;
}
// 视图变换矩阵
Eigen::Matrix4f get_view_matrix(Eigen::Vector3f eye_pos, Eigen::Vector3f target, Eigen::Vector3f up) {
    // TODO:还没理解怎么换的
    // 观察方向
    Vector3f z = (eye_pos - target).normalized();
    // 叉乘得右方向
    Vector3f r = z.cross(up).normalized();
    // 叉乘得上方向
    Vector3f u = z.cross(r).normalized();
    Eigen::Matrix4f translate;
    translate << r.x(),r.y(),r.z(),-r.dot(eye_pos),
                u.x(),u.y(),u.z(),-u.dot(eye_pos),
                -z.x(),-z.y(),-z.z(),z.dot(eye_pos),
                0,0,0,1;
    // 效果是将摄像机作为原点情况下各个点的坐标
    return translate;

}
Eigen::Matrix4f get_projection_matrix(float eye_fov, float aspect_ratio, float n, float f) {

    Eigen::Matrix4f projection = Eigen::Matrix4f::Identity();
    float t = -tan((eye_fov/360)*M_PI)*(abs(n)); //top
    float r = t/aspect_ratio;

    Eigen::Matrix4f Mp;//透视矩阵
    Mp <<
       n, 0, 0,   0,
            0, n, 0,   0,
            0, 0, n+f, -n*f,
            0, 0, 1,   0;
    Eigen::Matrix4f Mo_tran;//平移矩阵
    Mo_tran <<
            1, 0, 0, 0,
            0, 1, 0, 0,  //b=-t;
            0, 0, 1, -(n+f)/2 ,
            0, 0, 0, 1;
    Eigen::Matrix4f Mo_scale;//缩放矩阵
    Mo_scale <<
             1/r,     0,       0,       0,
            0,       1/t,     0,       0,
            0,       0,       2/(n-f), 0,
            0,       0,       0,       1;
    projection = (Mo_scale*Mo_tran)* Mp;//投影矩阵
    //这里一定要注意顺序，先透视再正交;正交里面先平移再缩放；否则做出来会是一条直线！
    return projection;
}
void Model::setModelTransformation(float angleX, float angleY, float angleZ, float tx, float ty, float tz, float sx, float sy, float sz){
    if (triangleList.empty()){
        std::cout << "模型未导入！"<<std::endl;
        return;
    }
    Eigen::Matrix4f rotationMatrix = rotation(angleX, angleY, angleZ);
    Eigen::Matrix4f translationMatrix = translation(tx, ty, tz);
    Eigen::Matrix4f scalingMatrix = scaling(sx, sy, sz);
    // 按缩放 -> 旋转 -> 平移的顺序组合变换矩阵
    modelMatrix = translationMatrix * rotationMatrix * scalingMatrix;
}
// 应用视图变换的函数
void Model::setViewTransformation(Eigen::Vector3f eye_pos, Eigen::Vector3f target, Eigen::Vector3f up) {
    viewMatrix = get_view_matrix(eye_pos,target,up);
}
// 应用透视变换的函数
void Model::setProjectionTransformation(float fovY, float aspectRatio, float near, float far) {
    projectionMatrix = get_projection_matrix(fovY, aspectRatio, near, far);
}

Matrix4f Model::getMVP(){
    return projectionMatrix * viewMatrix * modelMatrix;
}


Model::~Model() {
}