轻量封装WebGPU渲染系统示例<12>- 基础3D对象实体(源码)

当前示例源码github地址:

https://github.com/vilyLei/voxwebgpu/blob/main/src/voxgpu/sample/PrimitiveEntityTest.ts

此示例渲染系统实现的特性:

  1. 用户态与系统态隔离。

细节请见:引擎系统设计思路 - 用户态与系统态隔离-CSDN博客

  1. 高频调用与低频调用隔离。

  2. 面向用户的易用性封装。

  3. 渲染数据(内外部相关资源)和渲染机制分离。

  4. 用户操作和渲染系统调度并行机制。

  5. 数据/语义驱动。

当前示例运行效果:

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

javascript 复制代码
export class PrimitiveEntityTest {
	private mRscene = new RendererScene();

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

		const rc = this.mRscene;
		rc.initialize();
		this.initEvent();
		this.initScene();
	}
	private initEvent(): void {
		const rc = this.mRscene;
		rc.addEventListener(MouseEvent.MOUSE_DOWN, this.mouseDown);
		new MouseInteraction().initialize(rc, 0, false).setAutoRunning(true);
	}
	private mouseDown = (evt: MouseEvent): void => {};
	private initScene(): void {
		const rc = this.mRscene;

		let entities: PrimitiveEntity[] = [
			new SphereEntity(),
			new BoxEntity(),
			new CylinderEntity(),
			new CubeEntity({cubeSize: 130}),
			new TorusEntity({radius: 110, axisType: 1}),
			new PlaneEntity({axisType: 1})
		];

		for (let i = 0; i < entities.length; ++i) {

			let entity = entities[i]
				.setAlbedo(new Color4().randomRGB(1.5, 0.1))
				.setARM(1.1, Math.random() * 0.95 + 0.05, Math.random() * 0.9 + 0.1);

			entity.transform.setXYZ(-600 + i * 200, 0, 0);
			rc.addEntity(entity);
		}
	}

	run(): void {
		this.mRscene.run();
	}
}
相关推荐
1 小时前
3D碰撞检测系统 基于SAT算法+Burst优化(Unity)
算法·3d·unity·c#·游戏引擎·sat
dzj20216 小时前
Unity是如何把3D场景显示到屏幕上的——Unity的渲染过程
3d·unity·游戏引擎·渲染·图形学
小赖同学啊20 小时前
GIS地理信息系统建设:高精度3D建模
3d
计算机sci论文精选1 天前
CVPR 2024 3D传感框架实现无监督场景理解新纪元
人工智能·机器学习·计算机视觉·3d·cvpr·传感技术
程序员编程指南1 天前
Qt OpenGL 集成:开发 3D 图形应用
c语言·数据库·c++·qt·3d
GISBox1 天前
GISBox实操指南:如何将IFC文件高效转换为3DTiles格式‌‌
3d·免费工具
Listennnn1 天前
3D Semantic Occupancy Prediction
3d
三月的一天1 天前
react+threejs实现自适应分屏查看/3D场景对比功能/双场景对比查看器
3d·分屏控制·react threejs·多场景渲染
lqjun08271 天前
相机内外参矩阵:从3D世界坐标到2D像素坐标变换
数码相机·3d·矩阵
渲吧云渲染1 天前
解码3D格式转换
3d