轻量封装WebGPU渲染系统示例<50>- Json数据描述材质等场景信息

news2024/9/22 9:39:38

当前示例源码github地址:

https://github.com/vilyLei/voxwebgpu/blob/feature/material/src/voxgpu/sample/DataDrivenScene2.ts

当前示例运行效果:

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

json场景数据:

{
	"renderer": {
		"mtplEnabled": true,
		"camera": {
			"eye": [
				1100,
				1100,
				500
			],
			"up": [
				0,
				1,
				0
			]
		}
	},
	"scene": {
		"light": {
			"pointLights": [
				{
					"position": [
						0,
						190,
						0
					],
					"color": [
						5,
						0,
						0
					],
					"factor1": 0.00001,
					"factor2": 0.00002
				}
			],
			"directionLights": [
				{
					"direction": [-1, -1, 0],
					"color": [0.5, 0.5, 0.5]
				}
			],
			"spotLights": []
		},
		"shadow": {
			"intensity": 0.4,
			"radius": 4
		},
		"fog": {
			"color": [
				0.3,
				0.7,
				0.2
			]
		}
	},
	"entities": [
		{
			"plane": {
				"entity": {
					"axisType": 1,
					"extent": [
						-600,
						-600,
						1200,
						1200
					],
					"transform": {
						"position": [
							0,
							0,
							0
						]
					},
					"materials": [
						{
							"type": "default",
							"lighting": true,
							"shadow": false,
							"shadowReceived": true,
							"fogging": true,
							"arms": [
								1,
								0.3,
								0.2
							],
							"albedo": [
								0.6,
								0.6,
								0.5
							]
						}
					]
				}
			}
		},
		{
			"sphere": {
				"entity": {
					"radius": 80,
					"transform": {
						"position": [
							0,
							100,
							200
						]
					},
					"materials": [
						{
							"type": "default",
							"lighting": true,
							"shadow": true,
							"shadowReceived": true,
							"fogging": true,
							"arms": [
								1,
								0.3,
								0.2
							],
							"albedo": [
								0.7,
								0.6,
								0.5
							]
						}
					]
				}
			}
		},
		{
			"cube": {
				"entity": {
					"size": 80,
					"transform": {
						"position": [
							220,
							130,
							-10
						],
						"scale": [
							2,
							1.5,
							3
						],
						"rotation": [
							-190,
							0,
							200
						]
					},
					"materials": [
						{
							"type": "default",
							"lighting": true,
							"shadow": true,
							"shadowReceived": true,
							"fogging": true,
							"arms": [
								1,
								0.4,
								0.2
							],
							"albedo": [
								0.3,
								0.7,
								0.8
							]
						}
					]
				}
			}
		},
		{
			"torus": {
				"entity": {
					"radius": 150,
					"axisType": 1,
					"rings": 50,
					"segments": 30,
					"transform": {
						"position": [
							0,
							230,
							0
						]
					},
					"materials": [
						{
							"type": "default",
							"lighting": true,
							"shadow": true,
							"shadowReceived": true,
							"fogging": true,
							"arms": [
								1,
								0.2,
								0.2
							],
							"albedo": [
								0.2,
								0.5,
								0.8
							]
						}
					]
				}
			}
		},
		{
			"model": {
				"entity": {
					"url": "static/assets/draco/monkey.drc",
					"transform": {
						"position": [
							0,
							380,
							0
						],
						"scale": [
							100,
							100,
							100
						],
						"rotation": [
							0,
							90,
							0
						]
					},
					"materials": [
						{
							"type": "default",
							"lighting": true,
							"shadow": true,
							"shadowReceived": true,
							"fogging": true,
							"arms": [
								1,
								0.5,
								0.2
							],
							"albedo": [
								0.6,
								0.3,
								0.8
							]
						}
					]
				}
			}
		},
		{
			"cube": {
				"entity": {
					"size": 2050,
					"normalScale": -1,
					"materials": [
						{
							"type": "default",
							"lighting": true,
							"fogging": true,
							"arms": [
								1,
								0.3,
								0.2
							],
							"albedo": [
								0.3,
								0.3,
								0.7
							],
							"faceCullMode": "front"
						}
					]
				}
			}
		},
		{
			"gltf": {
				"entity": {}
			}
		},
		{
			"usd": {
				"entity": {}
			}
		}
	]
}

代码:

export class DataDrivenScene2 {

	private mScene = new DataDrivenRScene();
	initialize(): void {

		let url = "static/assets/scene/sceneData02.json";

		new HttpFileLoader().loadJson(
			url,
			(json: object, url: string): void => {
				console.log("json: ", json);
				this.initScene(json);
			}
		);
	}
	private initScene(json: object): void {
		this.mScene.initialize(json);
		this.initEvent();
	}
	private initEvent(): void {
		const rc = this.mScene;
		new MouseInteraction().initialize(rc.rscene, 0, false).setAutoRunning(true);
	}
	run(): void {
		this.mScene.run();
	}
}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1316281.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

设计模式——组合模式(结构型)

引言 组合模式是一种结构型设计模式, 你可以使用它将对象组合成树状结构, 并且能像使用独立对象一样使用它们。 问题 如果应用的核心模型能用树状结构表示, 在应用中使用组合模式才有价值。 例如, 你有两类对象: ​…

搞懂这6 个持续集成工具,领先80%测试人

📢专注于分享软件测试干货内容,欢迎点赞 👍 收藏 ⭐留言 📝 如有错误敬请指正!📢交流讨论:欢迎加入我们一起学习!📢资源分享:耗时200小时精选的「软件测试」资…

太空旅行:计算机技术的崭新航程

太空旅行:计算机技术的崭新航程 一、引言 自古以来,人类就对浩渺的宇宙充满了无尽的好奇和渴望。随着科技的飞速发展,太空旅行已经从科幻小说中的构想变为现实。在这个过程中,计算机技术起到了不可或缺的作用。从阿波罗时代的初…

12V升18V4A同步升压恒压WT3210

12V升18V4A同步升压恒压WT3210 WT3210 是一款高功率密度的全集成同步升压转换器,内部集成的功率MOSFET管导通电阻为上管8mΩ和下管15mΩ。可为便携式系统提供空间小尺寸 解决方案。WT3210具有 2.7V 至 20V 的宽输入电压范围,应用在单节或两节锂电池的便携…

数据可视化?这些平台能处

图表在各行各业都起到举重若轻的作用,无论是项目汇报、业绩分析,亦或是数据挖掘、统计分析,良好的可视化可以为我们的阐述起到画龙点睛的效果。在一篇文章中,如果只有密密麻麻的文字堆积,无论是谁恐怕都无法长期保持注…

[Verilog] Verilog 简介

主页: 元存储的博客 全文 2100 字。 文章目录 前言1. Verilog 简介2. 主要特性3. 应用领域总结 前言 Verilog HDL(简称 Verilog )是一种硬件描述语言,用于数字电路的系统设计。可对算法级、门级、开关级等多种抽象设计层次进行建…

GZ015 机器人系统集成应用技术样题3-学生赛

2023年全国职业院校技能大赛 高职组“机器人系统集成应用技术”赛项 竞赛任务书(学生赛) 样题3 选手须知: 本任务书共 26页,如出现任务书缺页、字迹不清等问题,请及时向裁判示意,并进行任务书的更换。参赛队…

seaborn库图形进行数据分析(基于tips数据集)

Seaborn 是一个基于 matplotlib 的数据可视化库,可以用来绘制各种统计图表,包括散点图、条形图、折线图、箱线图等。Seaborn 提供了一些用于美化图表的默认样式和颜色主题,使得生成的图表更具有吸引力。下面是一些 Seaborn 库的常用功能和用法…

性能测试基础知识总结

1、CPU 使用率 除了空闲时间外的其他时间占总 CPU 时间的百分比,就是CPU 使用率,即 1- 空闲时间/CPU 总时间。 当计算 CPU 使用率时,我们通常使用 /proc/stat 文件中的数据。该文件提供了有关 CPU 的计数器信息,包括各种状态下的…

HPM6750系列--第九篇 GPIO详解(基本操作)

一、目的 在之前的博文中我们主要介绍了不同系统不同开发编译调试环境的配置和操作(命令行方式、Visual Studio Code、Segger Embedded Studio for RISC-V),以帮助大家准备好学习环境为目的,但是未涉及到芯片本身以及外设的讲解。…

CCF编程能力等级认证GESP—C++2级—20230318

CCF编程能力等级认证GESP—C2级—20230318 单选题(每题 2 分,共 30 分)判断题(每题 2 分,共 20 分)编程题 (每题 25 分,共 50 分)画三角形百鸡问题 答案及解析单选题判断题编程题1编程题2 单选题…

【MySQL学习之基础篇】概述

文章目录 1. mysql的启动和停止命令2. 客户端连接3. 数据模型 1. mysql的启动和停止命令 通过指令启动或停止,以管理员身份运行cmd,进入命令行执行如下指令: (1)启动myaql net start mysql(2)…

解决App Store上架提示您必须上传 12.9 英寸 iPad Pro(第 2 代)显示屏的截屏

出错场景 在App Store Connect中,上架App时,出现以下错误提示. 要开始审核流程,必须提供以下项目:您必须上传 12.9 英寸 iPad Pro(第 2 代)显示屏的截屏。(2048,2732)您…

netty-daxin-2(netty常用事件讲解)

文章目录 netty常用事件讲解ChannelHandler接口ChannelHandler适配器类ChannelInboundHandler 子接口Channel 的状态调用时机ChannelHandler 生命周期示例NettServer&CustomizeInboundHandlerNettyClient测试分析 ChannelInboundHandlerAdapter适配器类SimpleChannelInboun…

【MySQL学习之基础篇】多表查询

文章目录 1. 多表关系1.1. 一对多1.2. 多对多1.3. 一对一 2. 多表查询概述2.1. 数据准备2.2. 概述 3. 查询的分类3.1. 内连接查询3.2. 外连接查询3.3. 自连接3.3.1. 自连接查询3.3.2. 联合查询 3.4. 子查询3.4.1. 概述3.4.2. 标量子查询3.4.3. 列子查询3.4.4. 行子查询3.4.5. 表…

等等Domino 14.0FP1

大家好,才是真的好。 节奏确实太快了,有时候我深感我也追不上。 以前Notes Domino是三年磨一剑,也就说每三年才发一个大版本,从2019年开始,进行了高频提速,居然一年一个大版本! 周末&#xf…

vue-json-excel 在导出一行a-table明细后再去导出另一行明细但导出结果还是和第一次一样

通过接口等拿到数据后要使用setTimeout稍微延时下再去触发导出,不然数还未更新就导出了

分库分表以后,如何实现扩容?

在实际开发中,数据库的扩容和不同的分库分表规则直接相关,今天我们从系统设计的角度,抽象了一个项目开发中出现的业务场景,从数据库设计、路由规则,以及数据迁移方案的角度进行讨论。 从业务场景出发进行讨论 假设这…

LeetCode(60)K 个一组翻转链表【链表】【困难】

目录 1.题目2.答案3.提交结果截图 链接: K 个一组翻转链表 1.题目 给你链表的头节点 head ,每 k 个节点一组进行翻转,请你返回修改后的链表。 k 是一个正整数,它的值小于或等于链表的长度。如果节点总数不是 k 的整数倍&#xf…

1231. 航班时间(整行字符串输入:getline(cin,line))

题目: 1231. 航班时间 - AcWing题库 输入样例: 3 17:48:19 21:57:24 11:05:18 15:14:23 17:21:07 00:31:46 (1) 23:02:41 16:13:20 (1) 10:19:19 20:41:24 22:19:04 16:41:09 (1)输出样例: 04:09:05 12:10:39 14:22:05 思路: …