当前位置: 首页 > news >正文

轻量封装WebGPU渲染系统示例<7>-材质多pass(源码)

当前示例源码github地址:

https://github.com/vilyLei/voxwebgpu/blob/version-1.01/src/voxgpu/sample/MultiMaterialPass.ts

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

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

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

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

4. 渲染数据和渲染机制分离。

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

当前示例运行效果:

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

export class MultiMaterialPass {private mEntity: Entity3D;geomData = new GeomDataBuilder();renderer = new WGRenderer();initialize(): void {console.log("MultiMaterialPass::initialize() ...");const shdSrc = {vertShaderSrc: { code: vertWGSL, uuid: "vtxShdCode" },fragShaderSrc: { code: fragWGSL, uuid: "fragShdCode" }};let material0 = this.createMaterial(shdSrc, [new WGImage2DTextureData("static/assets/blueTransparent.png")], ["transparent"], "front");let material1 = this.createMaterial(shdSrc, [new WGImage2DTextureData("static/assets/blueTransparent.png")], ["transparent"], "back");this.mEntity = this.createEntity([material0, material1]);}private createMaterial(shdSrc: WGRShderSrcType, texDatas?: WGImage2DTextureData[], blendModes: string[] = [], faceCullMode = "back"): WGMaterial {let pipelineDefParam = {depthWriteEnabled: true,faceCullMode: faceCullMode,blendModes: [] as string[]};pipelineDefParam.blendModes = blendModes;const texTotal = texDatas ? texDatas.length : 0;const material = new WGMaterial({shadinguuid: "base-material-tex" + texTotal,shaderCodeSrc: shdSrc,pipelineDefParam});if (texTotal > 0) {const texWrappers: WGTextureWrapper[] = new Array(texTotal);for (let i = 0; i < texTotal; ++i) {texWrappers[i] = new WGTextureWrapper({ texture: { data: texDatas[i], shdVarName: "texture" + i } });}material.textures = texWrappers;}return material;}private createEntity(materials: WGMaterial[], pv?: Vector3): Entity3D {const renderer = this.renderer;const rgd = this.geomData.createSphere(150, 30, 30);const geometry = new WGGeometry().addAttribute({ shdVarName: "position", data: rgd.vs, strides: [3] }).addAttribute({ shdVarName: "uv", data: rgd.uvs, strides: [2] }).setIndexBuffer({ name: "geomIndex", data: rgd.ivs });const entity = new Entity3D();entity.materials = materials;entity.geometry = geometry;entity.transform.setPosition(pv ? pv : new Vector3());renderer.addEntity(entity);return entity;}private mRotY = 0.0;run(): void {this.mRotY += 0.5;this.mEntity.transform.setRotationXYZ(0, this.mRotY, this.mRotY + 0.5);this.mEntity.update();this.renderer.run();}
}

相关文章:

轻量封装WebGPU渲染系统示例<7>-材质多pass(源码)

当前示例源码github地址: https://github.com/vilyLei/voxwebgpu/blob/version-1.01/src/voxgpu/sample/MultiMaterialPass.ts 此示例渲染系统实现的特性: 1. 用户态与系统态隔离。 2. 高频调用与低频调用隔离。 3. 面向用户的易用性封装。 4. 渲染数据和渲染机制分离。 …...

0030Java程序设计-积分管理系统论文

文章目录 摘  要**目  录**系统实现系统功能需求3.2.1 管理员功能3.2.2 柜员功能 开发环境 摘  要 随着计算机和网络的不断革新&#xff0c;世界已经进入了前所未有的电子时代。作为实用性强、应用范围广泛的会员管理系统也正在被越来越多的各类企业用于消费管理领域。然…...

H5游戏源码分享-考眼力游戏猜猜金币在哪

H5游戏源码分享-考眼力游戏猜猜金币在哪 <!DOCTYPE html> <html> <head><meta http-equiv"Content-Type" content"text/html; charsetUTF-8"><meta charset"UTF-8"><meta name"apple-mobile-web-app-capa…...

2023 年值得关注的国外网络安全初创公司

网络安全初创公司试图解决的问题往往有点超前于主流。他们可以比大多数老牌公司更快地填补空白或新兴需求。初创公司通常可以更快地创新&#xff0c;因为它们不受安装基础的限制。 当然&#xff0c;缺点是初创公司往往缺乏资源和成熟度。公司致力于初创公司的产品或平台是有风…...

搞定蓝牙-第六篇(HID

搞定蓝牙-第六篇&#xff08;HID&#xff09; ble与HIDHOGPGAPP与HID ESP32程序分析 ble与HID HOGP 我们发现&#xff0c;电脑连接了蓝牙键盘就可以直接使用了&#xff0c;不需要配置任何东西&#xff0c;那么&#xff0c;这两者是怎么通讯的呢。我们使用的电脑windows系统内…...

Open3D(C++) 最小二乘拟合平面(直接求解法)

目录 一、算法原理二、代码实现三、结果展示本文由CSDN点云侠原创,原文链接。 一、算法原理 平面方程的一般表达式为: A x + B y + C...

lua移植及使用

编译环境&#xff1a;Ubuntu16.04 64位 交叉编译工具&#xff1a;arm-hisiv500-linux-gcc 文章目录 1. 项目背景2. lua开源版本选择3. 封装代码3.1 源码简介3.2 封装类3.2.1 头文件3.2.2 类的实现3.3.3 sample代码 1. 项目背景 使用lua脚本&#xff0c;读取key对应的值&#x…...

【鸿蒙软件开发】ArkTS基础组件之Select(下拉菜单)、Slider(滑动条)

文章目录 前言一、Select下拉菜单1.1 子组件1.2 接口参数 1.3 属性1.4 事件1.5 示例代码 二、Slider2.1 子组件2.2 接口参数&#xff1a;SliderStyle枚举说明 2.3 属性2.4 事件SliderChangeMode枚举说明 2.5 示例代码 总结 前言 Select组件&#xff1a;提供下拉选择菜单&#…...

linux ssh 免密登录

概述 在大数据测试环境搭建时&#xff0c;经常会用到 ssh 免密登录 &#xff0c;方便机器之间分发文件&#xff0c;从一个机器上登录至其它机器也方便 如何配置 linux 的 ssh 免密登录? 非免密登录 端口是22 [rootKS8P-Test-K8S06 ~]# ssh KS8P-Test-K8S06端口非22 [roo…...

秒级启动的集成测试框架

本文介绍了一种秒级启动的集成测试框架&#xff0c;使用该框架可以方便的修改和完善测试用例&#xff0c;使得测试用例成为测试过程的产物。 背景 传统的单元测试&#xff0c;测试的范围往往非常有限&#xff0c;常常覆盖的是一些工具类、静态方法或者较为底层纯粹的类实现&…...

Redux 数据仓库

Redux 数据仓库 解决React 数据管理&#xff08;状态管理&#xff09; &#xff0c;用于中大型&#xff0c;数据比较庞大&#xff0c;组件之间数据交互多的情况下使用。 作者&#xff1a;如果你不知道是否需要使用Redux,那么你就不需要它&#xff01; 解决组件的数据通信。 …...

[毕设记录]@开题调研:一些产品

我感觉产品能代表落地的一些实际应用&#xff0c;会和研究的角度有些差别&#xff0c;但是需求和兴趣往往是从现实中来的&#xff0c;在上一篇blog里面看外国blog的时候顺着搜搜到了很多国外的智慧校园chatbot解决方案 文章目录 Comm100streebomodern campusUniBuddy Comm100 …...

CSS3中的字体和文本样式

CSS3优化了CSS 2.1的字体和文本属性&#xff0c;同时新增了各种文字特效&#xff0c;使网页文字更具表现力和感染力&#xff0c;丰富了网页设计效果&#xff0c;如自定义字体类型、更多的色彩模式、文本阴影、生态生成内容、各种特殊值、函数等。 1、字体样式 字体样式包括类…...

LVS集群-DR模式【部署高可用LVS-DR集群】

文章目录 2.2 实战&#xff1a;配置LVS-DR集群2.2.1 配置IP&#xff08;Director Server的部署配置&#xff09;2.2.2 生成ens33:1配置文件 &#xff08;Director Server的部署配置&#xff09;2.2.3 配置LVS-DR规则&#xff08;Director Server的部署配置&#xff09;2.2.4 两…...

银河麒麟服务器版v4安装程序缺少依赖包,改为利用手机联网在线安装

1 将安卓手机连接使用usb转typec线连接到服务器的usb口。&#xff08;linux桌面版&#xff09;也可以类似的方法手机联网。 2 在手机热点中打开usb共享 3 使用ifconfig命令找到手机被服务器识别成的网卡名 4 使用dhclient “手机网卡名”命令&#xff0c;使服务器能上网。 5 变…...

Maven第一章:Maven安装、验证、使用

Maven第一章:Maven安装、验证、使用 前言 谁适合阅读本教程? Java开发人员:Maven是Java项目管理和构建工具,因此对Java开发人员来说是一个重要的工具。阅读Maven知识可以帮助他们更好地理解如何使用Maven来管理Java项目,包括依赖管理、构建自动化、项目构建和部署等。项目…...

ios 代码上下文截屏之后导致的图片异常问题

业务场景&#xff0c;之前是直接将当前的collectionview截长屏操作&#xff0c;第一次截图会出现黑色部分原因是视图未完全布局&#xff0c;原因是第一次使用了Masonry约束然后再截图的时候进行了frame赋值&#xff0c;可以查看下Masonry约束和frame的冲突&#xff0c;全部修改…...

《嵌入式软\硬件开发难点-2023-10-29》

一、《嵌入式软件开发难点》 内存有限、螺蛳壳里做道肠&#xff1b;处理能力有限&#xff0c;必须做好规划&#xff0c;榨取系统每一份处理能力&#xff1b;现代开发工具和实际工具难实施&#xff0c;资源问题&#xff1a;C/Python/Java&#xff1b;调试跟踪问题较困难&#x…...

基于5G工业CPE打造智慧煤矿无人巡检监测应用

煤炭是我国重要的能源资源&#xff0c;对于煤炭的开采和利用也是我国重要的工业产业部分。得益于5G物联网技术的发展普及&#xff0c;煤矿场景也迎来智能化升级&#xff0c;实现了包括智能采掘、智能调度、无人运输、无人巡检等新型应用&#xff0c;极大提升了煤矿采运产业的效…...

考点之数据结构

概论 时间复杂度和空间复杂度是计算机科学中用来评估算法性能的重要指标。 时间复杂度&#xff1a; 时间复杂度衡量的是算法运行所需的时间。它表示算法执行所需的基本操作数量随着输入大小的增长而变化的趋势。 求法&#xff1a; 通常通过分析算法中基本操作执行的次数来…...

生成xcframework

打包 XCFramework 的方法 XCFramework 是苹果推出的一种多平台二进制分发格式&#xff0c;可以包含多个架构和平台的代码。打包 XCFramework 通常用于分发库或框架。 使用 Xcode 命令行工具打包 通过 xcodebuild 命令可以打包 XCFramework。确保项目已经配置好需要支持的平台…...

(十)学生端搭建

本次旨在将之前的已完成的部分功能进行拼装到学生端&#xff0c;同时完善学生端的构建。本次工作主要包括&#xff1a; 1.学生端整体界面布局 2.模拟考场与部分个人画像流程的串联 3.整体学生端逻辑 一、学生端 在主界面可以选择自己的用户角色 选择学生则进入学生登录界面…...

鸿蒙中用HarmonyOS SDK应用服务 HarmonyOS5开发一个生活电费的缴纳和查询小程序

一、项目初始化与配置 1. 创建项目 ohpm init harmony/utility-payment-app 2. 配置权限 // module.json5 {"requestPermissions": [{"name": "ohos.permission.INTERNET"},{"name": "ohos.permission.GET_NETWORK_INFO"…...

rnn判断string中第一次出现a的下标

# coding:utf8 import torch import torch.nn as nn import numpy as np import random import json""" 基于pytorch的网络编写 实现一个RNN网络完成多分类任务 判断字符 a 第一次出现在字符串中的位置 """class TorchModel(nn.Module):def __in…...

佰力博科技与您探讨热释电测量的几种方法

热释电的测量主要涉及热释电系数的测定&#xff0c;这是表征热释电材料性能的重要参数。热释电系数的测量方法主要包括静态法、动态法和积分电荷法。其中&#xff0c;积分电荷法最为常用&#xff0c;其原理是通过测量在电容器上积累的热释电电荷&#xff0c;从而确定热释电系数…...

Python基于历史模拟方法实现投资组合风险管理的VaR与ES模型项目实战

说明&#xff1a;这是一个机器学习实战项目&#xff08;附带数据代码文档&#xff09;&#xff0c;如需数据代码文档可以直接到文章最后关注获取。 1.项目背景 在金融市场日益复杂和波动加剧的背景下&#xff0c;风险管理成为金融机构和个人投资者关注的核心议题之一。VaR&…...

站群服务器的应用场景都有哪些?

站群服务器主要是为了多个网站的托管和管理所设计的&#xff0c;可以通过集中管理和高效资源的分配&#xff0c;来支持多个独立的网站同时运行&#xff0c;让每一个网站都可以分配到独立的IP地址&#xff0c;避免出现IP关联的风险&#xff0c;用户还可以通过控制面板进行管理功…...

Web中间件--tomcat学习

Web中间件–tomcat Java虚拟机详解 什么是JAVA虚拟机 Java虚拟机是一个抽象的计算机&#xff0c;它可以执行Java字节码。Java虚拟机是Java平台的一部分&#xff0c;Java平台由Java语言、Java API和Java虚拟机组成。Java虚拟机的主要作用是将Java字节码转换为机器代码&#x…...

群晖NAS如何在虚拟机创建飞牛NAS

套件中心下载安装Virtual Machine Manager 创建虚拟机 配置虚拟机 飞牛官网下载 https://iso.liveupdate.fnnas.com/x86_64/trim/fnos-0.9.2-863.iso 群晖NAS如何在虚拟机创建飞牛NAS - 个人信息分享...

django blank 与 null的区别

1.blank blank控制表单验证时是否允许字段为空 2.null null控制数据库层面是否为空 但是&#xff0c;要注意以下几点&#xff1a; Django的表单验证与null无关&#xff1a;null参数控制的是数据库层面字段是否可以为NULL&#xff0c;而blank参数控制的是Django表单验证时字…...