轻量封装WebGPU渲染系统示例<55>- 顶点数据更新

当前示例源码github地址:

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

当前示例运行效果:

​​​​​​​

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

export class VertexUpdateTest {
	private mRscene = new RendererScene();
	initialize(): void {
		this.mRscene.initialize({
			canvasWith: 512,
			canvasHeight: 512,
			rpassparam:
			{
				multisampled: true
			}
		});
		this.initScene();
		this.initEvent();
	}
	private mPlane: PlaneEntity;
	private initScene(): void {

		let rc = this.mRscene;

		let plane = new PlaneEntity({
			axisType: 1,
			geometryDynamic: true,
			extent: [-600, -600, 1200, 1200]
		});
		this.mPlane = plane;
		rc.addEntity(plane);
	}
	
	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 => {
		
		let geom = this.mPlane.geometry;
		let attrib = geom.getAttribDataWithTypeName('position');
		
		let vs = attrib.data as Float32Array;
		vs[0] -= 100;
		attrib.update();
	};
	run(): void {
		this.mRscene.run();
	}
}

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

2023 年四川省职业院校技能大赛(高职组)应用软件系统开发赛项样题

2023 年四川省职业院校技能大赛 (高职组)应用软件系统开发赛项样题 目录 竞赛说明 二、竞赛内容 三、竞赛成果物提交​编辑 四、文档及组件 五、竞赛注意事项 模块一:系统需求分析 二、任务要求 三、竞赛任务 任务 1:智造双碳—能…

从2023看2024前端发展趋势

前言 流光溯影,纵观2023全年,整个前端业界呈现出百业凋零之状,更不乏有“前端已死”等论调甚嚣尘上。从全局视角看IT行业,除了AI领域的大语言模型爆发外,整体都鲜有特别亮眼及突出的技术展现。故而,作为IT…

啊?这也算事务?!

作者简介:大家好,我是smart哥,前中兴通讯、美团架构师,现某互联网公司CTO 联系qq:184480602,加我进群,大家一起学习,一起进步,一起对抗互联网寒冬 学习必须往深处挖&…

学Python的正确顺序千万别弄反了,到时候后悔就来不及了

学Python的正确顺序:从基础到高级,步步为营 在当今数字化时代,Python已成为最受欢迎的编程语言之一。它不仅广泛应用于数据分析、人工智能和Web开发等领域,还为初学者提供了一个友好且功能强大的平台。然而,学习Python…

2023 全球 AI 大事件盘点

本文来自微信公众号硅星人

python观察图像的幅度谱和相位谱——冈萨雷斯数字图像处理

原理 在图像处理中,当我们对图像进行傅里叶变换,可以得到两个重要的成分:幅度谱和相位谱。这些成分在图像分析和处理中扮演着关键的角色。 傅里叶变换 傅里叶变换是一种将信号从时域(或空间域)转换到频率域的工具。对…

EOS运行启动 keosd 和 nodeos

EOS运行启动 keosd 和 nodeos 启动keosd:启动nodeos 安装完eosio后keosd和nodeos是一起带着的,我把EOS的运行keosd 和 nodeos官网教程放上来: https://developers.eos.io/welcome/latest/getting-started-guide/local-development-environment/start-nod…

智能制造 - 你需要了解的 10 个基本要素

智能制造 - 您需要了解的 10 个基本要素 在第四次工业革命 (IoT4) 的动态格局中,智能制造成为生产方式的关键变革。先进技术和创新工艺的融合正在塑造工业领域的新时代。探索智能制造的基本要素以及它们如何共同重新定义制造领域的效率、生产力和敏捷性。 一、数字…

Vue+elementUI引入MessageUI展示问题

VueelementUI引入MessageUI展示问题 1.出现问题的界面 2.解决问题 import "element-plus/theme-chalk/el-message.css";

公共用例库计划--个人版(一)

1、公共用例库计划 1.1、目标 在公司测试管理体系的演变过程中,从禅道过渡到devops再到云效平台,我们已经实现了对bug和用例的有效集中管理。然而,在实际操作中发现,尽管用例管理得到了初步整合,但在面对不同系统和测…

详解信道容量,信道速率,安全速率的区别

目录 一. 信道容量与信道速率 二. 小结 三. 安全速率与物理层安全 3.1 香农物理层安全模型 3.2 安全信道速率 四. 补充安全中断概率(Secrecy Outage Probability, SOP) 五. 补充安全分集度(Secrecy Diversity Order, SDO) …

【深度学习】Normalizing flow原理推导+Pytorch实现

1、前言 N o r m a l i z i n g f l o w \boxed{Normalizing \hspace{0.1cm} flow} Normalizingflow​,流模型,一种能够与目前流行的生成模型—— G A N 、 V A E \boxed{\mathbf{GAN、VAE}} GAN、VAE​相媲美的模型。其也是一个生成模型,可是…

【网络安全 | Misc】Ditf 安恒九月赛

正文 binwalk发现rar: 修改后缀,打开需要密码: 修改高度: 得到密码: StRe1izia得到一个流量包: 联系上文搜素png得到: 追踪流: 得到Base64代码: flag{Oz_4nd_Hir0_lov3_F…

算法通关村第十四关—堆能高效解决的经典问题(白银)

堆能高效解决的经典问题 一、在数组中找第K大的元素 LeetCode215 给定整数数组ums和整数k,请返回数组中第k个最大的元素。请注意,你需要找的是数组排序后的第k个最大的元素,而不是第k个不同的元素。 示例1: 输入:[3,2,1,5,6,4]和…

循环生成对抗网络(CycleGAN)

一、说明 循环生成对抗网络(CycleGAN)是一种训练深度卷积神经网络以执行图像到图像翻译任务的方法。网络使用不成对的数据集学习输入和输出图像之间的映射。 二、基本介绍 CycleGAN 是图像到图像的翻译模型,就像Pix2Pix一样。Pix2Pix模型面临…

计算机组成原理复习7

内存管理 文章目录 内存管理存储器概述存储器的分类按在计算机中的作用(层次)分类按存储介质分类按存取方式分类按信息的可保存性分类 存储器的性能指标存储容量单位成本存储速度:数据传输率数据的宽度/存储周期 存储器的层次化结构多级存储系…

抖音详情API:从零开始构建抖音应用

随着短视频的兴起,抖音已经成为了一个全球范围内的热门平台。对于开发人员而言,利用抖音详情API从零开始构建抖音应用具有巨大的潜力和机会。本文将为你提供从零开始构建抖音应用的指南,包括开发环境搭建、API请求格式、用户认证等关键环节&a…

八. 实战:CUDA-BEVFusion部署分析-环境搭建

目录 前言0. 简述1. CUDA-BEVFusion浅析2. CUDA-BEVFusion环境配置2.1 简述2.2 源码下载2.3 模型数据下载2.4 基础软件安装2.5 protobuf安装2.5.1 apt 方式安装2.5.2 源码方式安装 2.6 编译运行2.6.1 配置 environment.sh2.6.2 利用TensorRT构建模型2.6.3 编译运行程序 2.7 拓展…

【电子通识】LED有关的几个参数和定义

主波长与峰值波长 看LED灯数据手册的时候会发现有两种不同的波长参数:“峰值波长 Peak Wavelength”和 “主波长 Dominant Wavelength”,那么这两个波长代表什么? 峰值波长 λP(Peak Wavelength ) : 定义为光谱辐射功率最大处所对…

JavaScript元素根据父级元素宽高缩放

/*** 等比缩放* param wrap 外部容器* param container 待缩放的容器* returns {{width: number, height: number}}* 返回值:width:宽度, height:高度*/aspectRatio(wrap: any, container: any) {// w h / ratio, h w * ratioconst wrapW wrap.width;const wrapH…