轻量封装WebGPU渲染系统示例<27>- 浮点RTT纹理(源码)

当前示例源码github地址:

https://github.com/vilyLei/voxwebgpu/blob/feature/rendering/src/voxgpu/sample/FloatRTT.ts

当前示例运行效果:

此示例基于此渲染系统实现,当前示例TypeScript源码如下:

javascript 复制代码
const floatRTT = { diffuse: { uuid: "rtt0", rttTexture: {}, format: 'rgba16float' } };

export class FloatRTT {

	private mRscene = new RendererScene();

	initialize(): void {
		console.log("FloatRTT::initialize() ...");

		let multisampleEnabled = true;
		let depthTestEnabled = false;
		let rpassparam = { multisampleEnabled, depthTestEnabled };
		this.mRscene.initialize({ rpassparam });

		this.initScene();
	}

	private applyRTTPass(extent: number[]): void {
		let rs = this.mRscene;

		let shaderSrc = {
			vert: { code: vertWGSL, uuid: "vert" },
			frag: { code: fragCalc, uuid: "calcFrag" }
		};
		const attachment = {
			texture: floatRTT,
			clearValue: [0.1, 0.1, 0.1, 1.0]
		};
		const colorAttachments = [attachment];

		let rPass = rs.createRenderPass({ separate: true, colorAttachments });

		const diffuseTex = { diffuse: { url: "static/assets/huluwa.jpg", flipY: true } };

		let rttEntity = new FixScreenPlaneEntity({ extent: [-1, -1, 2, 2], textures: [diffuseTex], shaderSrc, shadinguuid: "floatRTT" });
		rPass.addEntity(rttEntity);

		shaderSrc = {
			vert: { code: vertWGSL, uuid: "vert" },
			frag: { code: fragRead, uuid: "readFrag" }
		};

		// display float rtt rendering result
		extent = [-0.8, -0.8, 1.6, 1.6];
		let entity = new FixScreenPlaneEntity({ extent, flipY: true, textures: [floatRTT], shaderSrc, shadinguuid: "calcColor" });
		rs.addEntity(entity);

		// display origin image
		extent = [-0.95, -0.95, 0.6, 0.6];
		entity = new FixScreenPlaneEntity({ extent, flipY: false, textures: [diffuseTex]});
		rs.addEntity(entity);
	}
	private initScene(): void {
		this.applyRTTPass( [-1, -1, 2, 2] );
	}

	run(): void {
		this.mRscene.run();
	}
}
相关推荐
qq_3861705015 小时前
3DM转换成GLB
3d
mm_exploration15 小时前
halcon激光三角测量(二十一)calibrate_sheet_of_light_calplate
图像处理·3d·halcon·点云处理
视觉人机器视觉17 小时前
机器视觉检测中,2D面阵相机和线扫相机的区别
人工智能·数码相机·计算机视觉·3d·视觉检测
工业3D_大熊1 天前
HOOPS Web Platform:3D模型轻量化与可视化的高效解决方案
3d·3d web轻量化·3d建模·3d模型轻量化·3d数据格式转换·工业3d·几何建模
mirrornan2 天前
3D数字化技术:重塑“人货场”,开启营销新纪元
3d·3d展示·3d数字化
视觉人机器视觉2 天前
机器视觉3D工业相机机器视觉检测的优缺点
数码相机·3d·视觉检测
CodeCraft Studio3 天前
轻量级CAD编辑器CADEditorX发布15.2新版本,新增3D模型爆炸视图新工具等
计算机视觉·3d·编辑器
视觉人机器视觉3 天前
什么是平面环形无影光源
人工智能·计算机视觉·平面·3d·c#·视觉检测
视觉人机器视觉3 天前
机器视觉中的3d和2d的区别
3d
杀生丸学AI4 天前
【三维重建】FeatureGS:特征值优化的几何精度和伪影减少3DGS的重构
人工智能·3d·aigc·三维重建·扩散模型·高斯泼溅